XMLHttpRequest cannot load http://localhost:3000/. No 'Access-Control-Allow-Origin' header is presen

来源:互联网 发布:淘宝卖家折八百官网 编辑:程序博客网 时间:2024/05/29 12:13

express解决
跨域问题主要在header上下功夫
首先提供一个w3c的header定义 http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html
再提供一个网友提供的header详解 http://kb.cnblogs.com/page/92320/

这两个有助于帮助大家理解header的类型和作用,
但是遗憾的是跨域相关的两个header属性我都没有找到相关的定义,
下面直接告诉大家
1是Access-Control-Allow-Origin 允许的域
2是Access-Control-Allow-Headers 允许的header类型
第一项可以直接设为* 表示任意
但是第二项不能这样写,在chrome中测试跨域发现报错,
最终的代码看起来是这个样子:

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(); });

代码完善:

//allow custom header and CORS 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 , yourHeaderFeild'); res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS'); if (req.method == 'OPTIONS') { res.send(200); /让options请求快速返回/ } else { next(); } });

参考:解决NodeJS+Express模块的跨域访问控制问题:Access-Control-Allow-Origin - 推酷
最后介绍一个cors模块,引入就可以解决了。代码如下:

var express = require('express') , cors = require('cors') , app = express(); app.use(cors()); app.get('/products/:id', function(req, res, next){ res.json({msg: 'This is CORS-enabled for all origins!'}); }); app.listen(80, function(){ console.log('CORS-enabled web server listening on port 80'); });
阅读全文
0 0
原创粉丝点击