linux 服务器 docker nginx 部署 vue 前端 程序

我的Docker专栏

1.vue 打包 这个就不说了

2.把vue打包好的文件上传到nginx的html中 3.修改nginx配置文件 下面是我的配置文件,供参考

user  root;
worker_processes  auto;

error_log  /var/log/nginx/error.log notice;
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;
	#第一个程序
	server {
          
   
		listen       80; #监听端口
		listen  [::]:80;
		server_name  localhost; #这个不用改

		location / {
          
   
			root   /usr/share/nginx/html/ui; #这里是跳转的路径 特别注意 这里的路径不是linux你上传的路径 而是你启动nginx启动时候映射得docker内部路径
			index  index.html index.htm; #显示的index页面
		}
		
		location /api/ {
          
    
			proxy_pass   http://101.42.249.162:8005/api/; #这里是代理后端的路径
		}
	
		error_page   500 502 503 504  /50x.html;
		location = /50x.html {
          
   
			root   /usr/share/nginx/html;
		}
	}
	#第二个程序
	server {
          
   
		listen       8092;
		listen  [::]:8092;
		server_name  localhost;

		location / {
          
   
			root   /usr/share/nginx/html/ms;
			index  index.html index.htm;
		}
		
		location /api/ms/ {
          
   
			proxy_pass   http://101.42.249.162:8097/api/ms/;
		}
	
		error_page   500 502 503 504  /50x.html;
		location = /50x.html {
          
   
			root   /usr/share/nginx/html;
		}
	}

    sendfile        on;

    keepalive_timeout  65;

    include /etc/nginx/conf.d/*.conf;
}

记得把你前端的端口映射到主机上,当你访问主机上的端口时,才会映射到docker里面的端口,才会被nginx监听到,才会让nginx映射到指定的页面

经验分享 程序员 微信小程序 职场和发展