阿里云服务器使用docker安装Nginx + Nginx配置vue项目+ Nginx开启https，配置ssl证书

test阿不良人

已于 2023-06-12 11:19:37 修改

阅读量704

点赞数 2

文章标签： nginx 阿里云服务器

于 2023-06-12 10:58:43 首次发布

本文链接：https://blog.csdn.net/m0_54793512/article/details/131162701

版权

1.基于docker安装nginx

docker pull nginx //拉取nginx最新镜像
docker images    //查看镜像

2. 打包vue项目，一般前端就会打包好或者自己命令：

npm run build

就会生成一个dish文件夹，这就是打包好的Vue项目资源

3.镜像已经下载好了，接下来进行挂载

4..运行一个nginx镜像

docker run -d --name nginxtest -p 80:80  nginx:latest

5.主机任意位置创建一个空文件夹nginx，我是在home目录中创建的

6.将nginx配置文件copy到主机：


docker cp nginxtest:/etc/nginx/nginx.conf /home/nginx/
docker cp nginxtest:/etc/nginx/conf.d /home/nginx/conf/
docker cp nginxtest:/usr/share/nginx/html /home/nginx/html
docker cp nginxtest:/var/log/nginx/ /home/nginx/logs/
docker cp nginxtest:/etc/ssl/certs/ /home/nginx/certs/

// 这里的nginxtest是容器名称 
// 第一个路径：容器内的路径
// 第二个路径：主机路径(对应第二步创建的nginx文件夹)

目录结构如下：有时候会多一层文件夹，手动调整即可。

conf下面有：

certs下有：（后期安装ssl证书的关键点）

7.删除容器

docker rm -f nginxtest

8.重新运行一个容器(并且映射对应的目录文件)

docker run -d  --name nginx -p 80:80 -p 443:443 -v /home/nginx/nginx.conf:/etc/nginx/nginx.conf -v /home/nginx/logs:/var/log/nginx -v /home/nginx/html:/usr/share/nginx/html -v /home/nginx/conf:/etc/nginx/conf.d -v /home/nginx/certs:/etc/ssl/certs  --privileged=true     -e TZ=Asia/Shanghai nginx:latest


-v目录挂载，宿主机和容器内部进行映射

9.将打包好的Vue资源部署到nginx目录，将dist文件夹中的内容全部Copy到第三步中挂载的html文件夹下，如：

10.

配置参考：

项目说明：

在我的项目中为了处理跨域问题，前端所有向后端服务器的请求都加了api前缀，例如：

http://127.0.0.1:8081/api/login

而向后端发送的真实请求为：

http://127.0.0.1:8081/login

因此在nginx的default.conf中添加以下配置：

location /api{
         proxy_pass   http://127.0.0.1:8081/;
    }
// 意思是：
//    当遇到请求 http://127.0.0.1:8081/api/login
//    就会将之转发到 http://127.0.0.1:8081/login

最后配置如下：