宝鸡做宝鸡做网站网站/品牌策划设计

　　跨域有多种方式，现在的情况看来还是CORS更适合一些，有很多优点，比如浏览器正式支持、支持post、可以控制跨域访问的网站等。

 

　　我们来看看node如何实现cors方式的跨域。在网上找到了一些代码，考过来之后运行报错，可能这个是在express里面的写法吧，那么原生的写法是什么样子的呢？又找了半天，并且经过测试得到了原生的写法：

 

express的写法：

---app.js---
app.all('*', function(req, res, next) {res.header("Access-Control-Allow-Origin", "*");res.header("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With");res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");res.header("X-Powered-By",' 3.2.1')if(req.method=="OPTIONS") res.send(200);/*让options请求快速返回*/else  next();
});

 

node原生写法：

var http = require("http");http.createServer(function (req, res) {var a={"a1":"www"};// 获得客户端的Cookievar Cookies = {};req.headers.cookie && req.headers.cookie.split(';').forEach(function( Cookie ) {var parts = Cookie.split('=');Cookies[ parts[ 0 ].trim() ] = ( parts[ 1 ] || '' ).trim();});console.log(Cookies);//获取自定义头
        console.log(req.headers.xtoken);// 向客户端设置一个Cookieres.setHeader('Set-Cookie','myCookie2=test');//res.setHeader("Access-Control-Allow-Origin", "*");res.setHeader("Access-Control-Allow-Origin", "http://127.0.0.1:8050"); //带cookie的话，不能写*res.setHeader("Access-Control-Allow-Credentials", true); //允许带 cookieres.setHeader("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With,xToken");res.setHeader("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");res.setHeader("X-Powered-By",' 3.2.1');res.writeHeader(200, {'Content-Type': 'application/json'});if(req.method=="OPTIONS"){/*让options请求快速返回*/res.end();}else{res.write(JSON.stringify(a));res.end();}}}).listen(8080);

 

 

　　需要先用 setHeader 进行设置，最后再用 writeHeader 进行设置。这样就可以了。

　　还有一些小地方，设置不好的话很容易报错。翻来覆去调试了好久才好。

 

　　然后就是客户端的写法了，由于客户端使用的框架不同，设置方式也有点差别，这里先介绍一下比较基本的jQuery的方式。

 

$.ajax({type: "POST",          //post方式 dataType: "JSON",      //json格式的数据cache: false,           //客户端不缓存headers: {           //自定义头    xtoken: "1234qwert"},
               xhrFields: {//允许跨域访问时添加cookiewithCredentials: true     //true "Access-Control-Allow-Origin" 不能写* ；false可以写 *
               },crossDomain: true,url: "http://127.0.0.1:8080/1234",data: {"a":"11"},        //json格式的数据//timeout: 2000,error: function (request, textStatus, errorThrown) { //访问失败，自动停止加载动画，并且给出提示alert("提交的时候发生错误！");},success: function (data) {$("#div").html(data.a1);}});

 

　　这里的 xhrFields 设置，折腾半天，找了好久终于搞定了。其实只需要在后端加一行代码就行。

 

　　另外用了自定义头，客户端会自动发起两次请求。就是说你的代码之ajax了一次，但是浏览器会发起两个请求，后端会收到两个请求，所以有了

if(req.method=="OPTIONS") res.send(200); 这样的判断。

 

 

参考目录

 

1、node的原生 header： https://www.cnblogs.com/jay--zhang/p/6229139.html 

 

2、node 接收 自定义 header

 作者：zding92 
来源：CSDN 
原文：https://blog.csdn.net/u011481543/article/details/79582555 
 

 

3、解决cookie的问题 ：https://www.jb51.net/article/137278.htm