Docker-Nginx 容器部署前端项目

Docker-Nginx 容器部署前端项目_第1张图片

Docker nginx 容器运行命令

docker run --name nginx-server -d -p 80:80 -p 8088:8088 -v /etc/nginx/nginx.conf:/etc/nginx/nginx.conf -v /root:/root --rm nginx
命令参数

--name 容器名称
-d 容器后台运行
-p 映射端口,默认80 为前端项目首页,8088端口预留
-v 映射目录,把系统 /etc/nginx/nginx.conf 目录文件映射到容器中的/etc/nginx/nginx.conf 位置, /root 为前端代码上一级目录
--rm 容器停止后删除

nginx 配置

Docker nginx 容器中的 nginx.conf 配置映射的系统本地 /etc/nginx/nginx.conf 文件

nginx.conf 内容

user  nginx;
worker_processes  1;
error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;
events {
  worker_connections  1024;
}
http {
  include       /etc/nginx/mime.types;
  default_type  application/octet-stream;
  log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                    '$status $body_bytes_sent "$http_referer" '
                    '"$http_user_agent" "$http_x_forwarded_for"';
  access_log  /var/log/nginx/access.log  main;
  sendfile        on;
  keepalive_timeout  65;
  server {
    listen       80;
    server_name  localhost;
    location / {
      root   /root/code/project_frontend/dist;
      index  index.html;
      try_files $uri $uri/ /index.html;
    }
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
      root   /usr/share/nginx/html;
    }
  }
}

/root/code/project_frontend/dist 地址为前端Vue项目打包目录

服务器 nginx 默认ip地址 http://10.255.xxx.xxx/ , 默认前端项目页面

问题记录

如果出现访问 http://10.255.xxx.xxx/ 地址页面 403 的情况,一般是由于目录权限问题导致,使用 chmod -R 777 修改对应的目录权限即可 eg. chmod -R 777 /root

HTTP 403

403错误是一种在网站访问过程中,常见的错误提示,表示资源不可用。服务器理解客户的请求,但拒绝处理它,通常由于服务器上文件或目录的权限设置导致的WEB访问错误。

如果喜欢,点个赞再走呗 ^-^

你可能感兴趣的:(Docker-Nginx 容器部署前端项目)