node.js配置允许跨域请求,设置允许携带的请求头参数

最近在用node.js写自己的后台时遇见了跨域问题,之前处理跨域都是在前端配置代理解决的,这次打算在后台解决,中途也遇
到了一些坑,比如我在请求头里加了一个自定义的参数token,结果后台配置的时候没有允许请求能够携带该参数,造成预检请求
发出后,就没任何响应了。为此折腾了半天才发现问题。。。还是对它不够了解,所以查阅了相关资料,下面做出自己的理解:

都知道跨域是因为浏览器的同源策略造成的,当客户端访问服务端时,如果两端的ip、端口、协议任意一个不同就会产生跨域。
下面介绍node.js后台如何配置允许跨域访问:

如果产生了跨域,客服端在访问服务端时,除了get请求外,其它请求都会先向客户端发送一个为 OPTIONS 的预检请求(预请求),
该请求到达服务端后,服务端会判断是否允许该请求继续访问,下面贴出我在node.js中如何配置的跨域中间件:

我是用的是express框架,在app.js中配置允许跨域(把这段代码放在你的其它中间件之前,如果对您有帮助请帮我点个赞喔(* ̄︶ ̄) ):

// 配置跨域请求中间件(服务端允许跨域请求)
var allowCors = function(req, res, next) {
    res.header("Access-Control-Allow-Origin", req.headers.origin); // 设置允许来自哪里的跨域请求访问(req.headers.origin为当前访问来源的域名与端口)
    res.header("Access-Control-Allow-Methods", "GET,PUT,POST,DELETE,OPTIONS"); // 设置允许接收的请求类型
    res.header("Access-Control-Allow-Headers", "Content-Type,request-origin"); // 设置请求头中允许携带的参数
    res.header("Access-Control-Allow-Credentials", "true"); // 允许客户端携带证书式访问。保持跨域请求中的Cookie。注意:此处设true时,Access-Control-Allow-Origin的值不能为 ‘*‘
    res.header("Access-control-max-age", 1000); // 设置请求通过预检后多少时间内不再检验,减少预请求发送次数
    next();
};
app.use(allowCors); // 使用跨域中间件

原文地址:https://www.cnblogs.com/maxiansheng/p/12524348.html

时间: 2024-10-05 23:27:19

node.js配置允许跨域请求,设置允许携带的请求头参数的相关文章

NodeJ node.js Jquery Ajax 跨域请求

Jquery + Ajax 跨域请求 说白了就是前台请求ajax数据(JSON)但是请求的数据不在本地的绝对路径下,接口数据 是没有这个安全性的我对外公开的接口数据,只要你找到接口你就可以使用里面的数据 ,但是在浏览器端他做了一套机制就是 不让你随意的访问别人服务器的外来接口,如果是好的数据的化  你可以学习使用,如果是一些恶意数据,对服务器对个人来说都是没有安全性的,目前明白一点就是 阻止跨域请求就是 浏览器的原因,也算是ajax的原因,所以这个前台你是无能为力的. 解决办法: 服务器端进行权

Nginx配置springboot-vue跨域

nginx-springboot-vue前后端分离跨域配置 引言 接着上篇--简单的springboot-vue前后端分离登录Session拦截的demo,其中跨域是通过springboot后端全局设置的,但是碰到了奇怪的问题,用了个不优雅的方式解决. 于是想到使用Nginx跨域应该就不会如此了. windows下载安装 http://nginx.org/ 下载稳定版,解压缩. 查看配置文件 /nginx-1.16.0/conf/nginx.conf : #gzip on; server { l

vue.js学习之 跨域请求代理与axios传参

vue.js学习之 跨域请求代理与axios传参 一:跨域请求代理 1:打开config/index.js module.exports{ dev: { } } 在这里面找到proxyTable{},改为这样: proxyTable: { '/api': { target: 'http://121.41.130.58:9090',//设置你调用的接口域名和端口号 别忘了加http changeOrigin: true, pathRewrite: { '^/api': ''//这里理解成用'/ap

Jsonp的js实现,跨域请求,同源策略机制

Jsonp的js实现,跨域请求,同源策略机制1.跨域请求:请求URL的协议,域名,端口三者之间任意一个与当前页面地址不同即为跨域 存在跨域的情况: 网络协议不同,端口不通,域名不同,子域名不同,域名和域名对应IP不同2.同源策略机制:(相对情况,保护隐私不被泄露) 同源策略概念(Same-Origin Policy) 同源指:域名,协议,端口相同.不同源的客户端脚本(Javascript,ActionScript)在 没明确授权的情况下,不能读写对方的资源.3.Jsonp的js实现: Jsonp

js中各种跨域问题实战小结(二)

这里接上篇:js中各种跨域问题实战小结(一) 后面继续学习的过程中,对上面第一篇有稍作休整.下面继续第二部分: -->5.利用iframe和location.hash -->6.window.name跨域实现 利用iframe和location.hash实现跨域 想必有很多人像我之前一样,或许只知道上面文中所说的那几种方法.所以,我刚了解到可以用iframe和location.hash来实现跨域的时候,我会想,为什么他们可以实现.iframe是什么,有什么特性,location.hash是什么

第五节:SignalR大杂烩(与MVC融合、全局的几个配置、跨域的应用、C/S程序充当Client和Server)

一. 说在前面的话 本节主要在前面章节的基础上补充了几个简单的知识点,比如:第三方调用通过 GlobalHost.ConnectionManager.GetHubContext<MySpecHub1>();来获取Hub对象,那么能不能封装一下不必每次都这么获取呢?再比如SignalR传输是否有大小限制,一下传输10w个字能否传输成功?最后着重整理一下跨域的各种使用情况,结合C/S程序充当客户端和服务器端. 本节内容包括: ①. SignalR与MVC或者WebApi简单的整合. ②. 全局的几

为什么我的跨域 AJAX 发了两个请求?

为什么我的跨域 AJAX 发了两个请求? 转载自:http://todoit.me/ajax-preflight/ 最近在做一个 VUE 的项目的时候, 和后端的小伙伴对接口, 想方便开发, 于是要求后端的小伙伴在所有的接口都加上跨域的许可 (Access-Control-Allow-Origin) (后来事实证明这不是一个很好的解决方案, 因为 vue-cli 提供了 proxy-table 作为 AJAX请求的代理, 只需要配置一下就好, 编译上线也不要改动代码) however, 经过这次

WCF配置问题(配置WCF跨域)

其它的先放一边.今天先来分享一下前段时间给公司做网站WCF服务接口的心得. 配置文件的配置问题 这里既然讨论WCF配置文件的问题,那么怎么创建的就不一一讲解了.好多博主都有提过的.所以直接分享自己开发时的收获,这里感谢好多给我启发的人,@好多人.... 我这里就拿登录接口来分享下吧. 先贴出代码. 这是服务端代码 因为ASP的兼容性问题,这里的AspNetCompatibilityRequirementsMode用Allowed(这里说一下,因为前段用Ajax调的接口,所以用了callback)

【JS】AJAX跨域

AJAX跨域介绍 AJAX 跨域访问是用户访问A网站时所产生的对B网站的跨域访问请求均提交到A网站的指定页面 由于安全方面的原因, 客户端js使用xmlhttprequest只能用来向来源网站发送请求,比如在www.readlog.cn下去请求test.readlog.cn的数据,都是不行的. 什么是AJAX跨域问题 简单来说,就是前端调用后端服务接口时 如果服务接口不是同一个域,就会产生跨域问题 AJAX跨域场景 前后端分离.服务化的开发模式 前后端开发独立,前端需要大量调用后端接口的场景 只