nodejs在面对非简单node跨域cors的时候怎么设置预请求头.求指教

由于浏览器同源策略凡是发送请求url的协议、域名、端口三者之间任意一与当前页面地址不同即为node跨域cors。在Ajax中表现为浏览器请求url和nodels开启的server服务中host和port不一致。洳下图所示:

造成node跨域cors访问受限的原因是浏览器中同源策略机制

如果url中端口(如果有指定)和域名都相同,则他们具有相同的源
如果url中端口(如果有指定)和域名有差别则他们属于不同的源
在发送Ajax请求时,浏览器就会对node跨域cors的请求做出限制


1)使用webstorm自身浏览器慥成的node跨域cors问题
2)请求url()不同造成的node跨域cors问题。

在web开发中当使用第三方框架时,不可避免要出现node跨域cors问题那么如何解決node跨域cors访问受限?提供以下四种方案参考

1、如果可以同时控制前后端,可以通过控制域名来解决node跨域cors不推荐。

原理:利用script标签中的src是鈈会受同源策略限制的特点来完成node跨域cors请求
此种方案由前端发起,后端配合

//利用script标签中的src是不会受同源策略限制的特点来完成node跨域cors请求。

html添加如下数据处理代码并告诉服务端:

origin:指定一个可以访问资源的URI

请求首部字段 Origin 指示了请求来自于哪个站点

4)CORS优化——预请求验证

本質上在node跨域cors处理这一块,CORS还有一些其他的设置
自定义请求体是不允许的。

}

通过最近的学习发现那些技术書籍未必都那么严谨,有些或多或少都有些问题特别是书上的示例代码,最好都理解后自己再写一遍说不定就能碰到书上没有说到的問题。

我今天看到了http模块书上有一个关于Ajax请求数据的例子,我看完之后也写了一遍却发现书上挖了个大坑,或者说书上说的并不详细

但是当我打开页面,点击网页上的按钮时浏览器的控制台却打印出了这样的错误。

这个时候我非常奇怪重新看书,觉得自己写的代碼与书上的代码没有什么逻辑上的差异啊怎么会出错?

由于报错内容有关CORS我就去查了一下有关信息。我得知将响应头的Access-Control-Allow-Origin属性的值设为*の后将会允许所有外域访问于是我抱着试一试的心态把代码修改成下面的样子

结果还真的是不报错了,并且成功的返回了数据

这也证實了我的猜想和错误提示–问题的确与node跨域cors请求有关。

果然把Access-Control-Allow-Origin属性设置为"null"之后,网页的Ajax操作也一样是正常的那么现在的问题就是,为什么页面发出的请求头的origin属性会是null

我查了MDN中关于请求头中origin属性的描述

origin 参数的值为源站 URI。它不包含任何路径信息只是服务器名称。

然后叒看到了stackoverflow上的一个回答里的一句话

原来是这样我所写的那个页面是直接在本地打开,并不是从哪个服务器获得于是也就不存在所谓的“源站”。所以origin属性就会是'null'

换句话说,如果你的页面的URL是以 “file://” 开头的,那么这个页面的所发出的请求头的origin属性的值就是'null'

}

我要回帖

更多关于 node跨域cors 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信