nginx怎么解决跨域问题-木庄网络博客

本文摘自PHP中文网，作者藏色散人，侵删。

如何用Nginx解决前端跨域问题？

前言

在开发静态页面时，类似Vue的应用，我们常会调用一些接口，这些接口极可能是跨域，然后浏览器就会报cross-origin问题不给调。

最简单的解决方法，就是把浏览器设为忽略安全问题，设置--disable-web-security。不过这种方式开发PC页面到还好，如果是移动端页面就不行了。

解决办法

使用Nginx转发请求。把跨域的接口写成调本域的接口，然后将这些接口转发到真正的请求地址。

举个栗子

例如我们在开发一个Vue应用。

原先：

调试页面是：http://192.168.1.100:8080/

请求的接口是：http://ni.hao.sao/api/get/info

步骤一：

请求的接口是：http://192.168.1.100:8080/api/get/info

PS：这样就解决了跨域问题。

步骤二：

安装好Nginx后，去到/usr/local/etc/nginx/目录（这是Mac的），修改nginx.conf文件。

步骤三：

把默认的server配置注释掉。

在下面增加：

server{
     listen 8888;
     server_name  192.168.1.100;
 
     location /{
         proxy_pass http://192.168.1.100:8080;
     }
 
     location /api{
         proxy_pass http://ni.hao.sao/api;
     }
 }