前端接口跨域解决方案

目录

1.nginx反向代理解决（访问nginx的端口，代理到首页访问）

 2.修改浏览器操作（3种方法）

安装插件【Allow-Control-Allow-Origin: *】，并将开关打开

3.后端使用中间件来处理前端的访问 

4.通过 browser-sync + http-proxy-middleware来实现跨域(快速搭建服务，适用于平时偶尔开发活动页面)

5 通过谷歌插件XSwitch来解决跨域 （cros中写要跨域访问的域名）

---

 

---

 

1.nginx反向代理解决（访问nginx的端口，代理到首页访问）

• vim /usr/local/etc/nginx/nginx.conf  打开nginx配置文件,进行配置

•  server {
          listen       80; // nginx服务端口
          server_name  localhost;
  
          location / {
              proxy_pass http://localhost:8001/; //项目的首页
          }
  
          location /api/ { // 监听  /api/  进行代理接口访问
              proxy_pass http://localhost:8000/; // 访问的后端跨域接口
          }
  }

   

 2.修改浏览器操作（3种方法）

第一种 (mac电脑)

• 创建一个文件夹MyChromeACAO，这个文件夹是用来保存关闭安全策略后的用户信息的，名字可以随意取，位置也可以随意放
• pwd查看当前文件全部路径
• 打开终端，输入  open -n /Applications/Google\ Chrome.app/ --args --disable-web-security  --user-data-dir=/Users/XX/Desktop/MyChromeACAO    ---------------红色字体为建的文件夹完整路径
• 回车之后会启动一个非安全模式的谷歌浏览器，可以跨域访问接口 

第二种 

安装插件【Allow-Control-Allow-Origin: *】，并将开关打开

第三种

 右击浏览器--属性--快捷方式--目标，在引号内加参数--disable-web-security

3.后端使用中间件来处理前端的访问 

4.通过 browser-sync + http-proxy-middleware来实现跨域(快速搭建服务，适用于平时偶尔开发活动页面)

5 通过谷歌插件XSwitch来解决跨域 （cros中写要跨域访问的域名）