赞
踩
通过给不同的域名配置不同的反向代理实现将域名指向不同的端口,分别用Express在3000端口与3001端口代理静态Vue网站即可实现在一台服务器上部署多个Vue项目
user nobody; worker_processes 1; worker_rlimit_nofile 65535; #error_log logs/error.log notice; events { accept_mutex off; use epoll; worker_connections 8192; } http { include mime.types; default_type application/octet-stream; log_format combinedio '$remote_addr - $remote_user [$time_local] ' '"$request" $status $body_bytes_sent ' '"$http_referer" "$http_user_agent" $request_length $request_time $upstream_response_time'; access_log logs/access.log combinedio; sendfile on; gzip on; tcp_nopush on; tcp_nodelay on; keepalive_timeout 0; client_body_timeout 10; client_header_timeout 10; client_header_buffer_size 1k; large_client_header_buffers 4 4k; output_buffers 2 32k; client_max_body_size 64m; client_body_buffer_size 256k; server_tokens off; include http.d/*.conf; server { listen 80; server_name test.demo.club; location / { add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS'; add_header 'Access-Control-Allow-Headers' 'DNT,web-token,app-token,Authorization,Accept,Origin,Keep-Alive,User-Agent,X-Mx-ReqToken,X-Data-Type,X-Auth-Token,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range'; add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range'; proxy_pass http://127.0.0.1:3000; } } server { listen 80; server_name www.demo.club; location / { proxy_pass http://127.0.0.1:3001; } } # include include/*.conf; }
具体Nginx.conf如上
最初思路并不是现在的实现方法,而是计划使用81端口反向代理至3001端口实现访问81端口来跳转第二页面,但实际情况是并不能通过域名:81的形式直接访问到81端口,因此此方式失败
另一种思路是通过配置路由来分配不同反向代理,如
# 配置重定向到/usr/financial
# location ^~/ifinancial {
# root /usr/financial;
# index index.html;
# rewrite ^/ifinancial/(.*)\.*$ /ifinancial/$1 break;
# try_files $uri $uri/ /ifinancial/index.html;
# }
但这种方式需要在Vue配置文件中同步更改根路由,同时网上只给出路由模式使用History时的解决方案,因此在多次尝试后舍弃了此种思路
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。