如何使用nginx解决前端跨域问题

注：前端项目是用h5写的，在浏览器运行，因为浏览器的同源策略，调用接口时会出现跨域问题，现使用nginx解决这个问题（开发环境是在mac端）

1. 安装nginx

 brew install nginx 

nginx安装完之后可以使用nginx -v 来验证是否安装成功，如果出现版本信息则安装成功

2. 修改nginx.conf

• mac一般在/usr/local/etc/nginx目录下

cd /usr/local/etc/nginx/

• 打开nginx.conf 

vim nginx.conf

• 编辑nginx.conf文件：找到 http 下的 server，修改配置如下

server {

        listen   5000;                      //监听端口

        server_name   localhost     //主机名称

        location   / {

           root    /Users/unicom/chenjia/face;        //文件根目录

           index   index.html  index.htm;                //默认起始页

        }

        location   /apis {    //前端请求/apis都转到http://192.168.191:8080

           rewrite  ^.+apis/?(.*)$ /$1 break;

           include  uwsgi_params;

           proxy_pass  http://192.168.191.1:8080;

        }

 }

3.修改请求路径

$.ajax({

   type:  'post',

   url:  '/apis/ttface/detectlandmark'

})

浏览器打开页面：localhost:5000/index/html 。请求成功，不再提示跨域