关于生产环境跨域问题

---

前言

提示：上篇文章提到了跨域问题和代理问题，解决之后熬了几天功能终于上线了，发布之后，直接傻眼了，url请求直接404了，本以为在不济也是个跨域报错，没想到直接404

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、在开发环境的Vue.config中设置了proxy？不好意思！生产环境没有用

原因分析：
首先得知道开发环境中前端使用的是什么？肯定是用的Vue。
生产环境用的又是什么呢？是webpack打包后的Html。
在用开发环境的时候，Vue中有vue.cli，自带了 Proxy 的能力，所以可以帮忙代理。跨域问题就解决了
Html有这种类似vue.cli的东西吗？（至少我不知道）所以到生产环境自然就没有用了

二、生产环境怎么办呢？

1.关闭浏览器跨域

这种方法铁定不行，客户哪知道什么跨域，所以pass

2.CORS

即资源共享，可以让后端人员去加，但是调用别人家API，总不至于让别人去给你设置这玩意吧

3.Nginx

作为一个老牌的反向代理工具，把你生产服务器反向代理出去不就可以了，在配置文件修改就行。
nginx配置在linux的位置一般在etc/nginx/nginx.config中，如果有多个服务，可能会分成多个配置文件进行管理，具体可以去问运维人员，你这个项目的反向代理配置在哪里（既然都问了，不如让他直接给你改得了，把源Ip给他就行），之后就可以修改代码了

	server {
	    listen 80;
	    server_name 项目名;
	    
		#自己项目的配置
	    location / {
	        proxy_set_header X-Real-IP $remote_addr;
	        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
	        proxy_set_header Host $http_host;
	        proxy_set_header X-NginX-Proxy true;
			#自己项目的位置
	        proxy_pass http://localhost:8083/;
	        proxy_redirect off;
	    }
	
		#添加访问目录为/api的代理配置,使以“/apiV1”开头的地址都转到“源IP（反向代理）”上
	    location /apiV1 { 
	        rewrite  ^/apiV1/(.*)$ /$1 break;
	        proxy_pass   '源IP（反向代理）';
	    }
}

总结

反向代理是什么呢？
简单来说就是别人访问我们的服务器，我们指向某个服务

跨域和反向代理还是挺重要的，面试高频题啊，有什么错误和建议欢迎指出