跨域的三种方法（cors、nginx、jsonp）

cors

在server-run.js服务器中配置：

var allowCrossDomain = function (req, res, next) {
    res.header('Access-Control-Allow-Origin', '*');//自定义中间件，设置跨域需要的响应头。
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, DELETE');  //允许任何方法
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type,X-Session-Token');   //允许任何类型
    next();
   };
 app.use(allowCrossDomain);

nginx

• 下载nginx文件
• nginx进行跨域操作步骤
• 首先在nginx.conf进行跨域操作
• 验证地址是否跨域成功（http://localhost:8089/）
• 在Html页面修改ajax请求（http://localhost:8089/api/articles/100?name=webpack） 将所有的ajax请求的端口号都改为8089
• 实现完成。

nginx配置内容

  server {
    listen       8089;  #服务端口
    server_name  localhost;  #服务名
    root   html;    #web根目录
    # cors
    add_header Access-Control-Allow-Origin $http_origin always;  # '*' 
    add_header Access-Control-Allow-Credentials true always;
    add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS' always;
    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' always;

    #请求http://localhost:8080/api，将该请求转发http://localhost:3000/api
    location /api {
        proxy_pass http://localhost:3000/api;
    }
}

注意项

• http://localhost:8089/ 成功才表示代理完成

jsonp

  <script> 只支持get方式
前端修改：
  function getByJson(){
            $.ajax({
                url:"http://localhost:3000/api/jsop",
                data:{name:"xxxx"},
                dataType:"jsonp",
                jsonpCallback:"handleResponse"
            })
        }
        // 回调函数
        function handleResponse(data){  // data--服务端数据
            console.log(data);    
        }
server修改
app.get("/api/jsonp",function(req,res){
    var data={name:"test"}
    data=JSON.stringify(data); //转字符串
    var callback='handleResponse('+data+')';
    res.send(callback)
})