nginx配置外网访问服务器

简单记录一下打包vue项目后，部署到服务器并且配置nginx，使得能够被外网访问

1. 服务器配置（阿里云）

首先进入阿里云服务器控制台，在云服务器组中找到 云服务器ECS -->安全组 -->创建安全组 -->访问规则（入方向） -->快速添加 选择443和80

2. nginx配置

刚开始将打包好的dist包放到nginx中启动后，遇见一系列问题。
首先，刷新页面后默认路由的路径没有了，只剩下IP和端口了。
配置好try_files $uri $uri/ /index.html last; 之后，刷新页面后不会出现路由“丢失”问题了。
然后调用接口出现405的问题，在尝试了多次之后，最终以下配置比较有效，可以正常访问了

server { 	listen 80; 	server_name localhost;  	location / { 		root dist; #项目的前端打包后的文件夹 		try_files $uri $uri/ /index.html last; 		index index.html index.htm; 		add_header Access-Control-Allow-Origin *; 		add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS'; 		add_header Access-Control-Allow-Headers 		'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization'; 		if ($request_method = 'OPTIONS') { 			return 204; 		} 	} 	location /api/{ 		proxy_pass http://xxxxx:xxxx/;  		proxy_set_header X-Real-IP $remote_addr;  		proxy_set_header X-Forwarded-For $remote_addr; 	} } 

需要注意的是：proxy_pass http://xxxxx:xxxx/; 要代理的接口地址必须加 / 具体原因没弄清楚，还望各位不吝赐教，本文算是简单的笔记记录吧，方便自己和其他人参考