node.js如何配置跨域?

更新日期: 2019-08-26阅读: 1.8k标签: 跨域

在node.js中可以使用res.header()方法来配置跨域。res.header()方法可以用来设置允许跨域的域名、允许的header类型、跨域允许的请求方式等。


node.js配置跨域的方法如下:

设置允许所有域名跨域:

app.all("*",function(req,res,next){    
//设置允许跨域的域名,*代表允许任意域名跨域
    res.header("Access-Control-Allow-Origin","*");    
    //允许的header类型
    res.header("Access-Control-Allow-Headers","content-type");    
    //跨域允许的请求方式 
    res.header("Access-Control-Allow-Methods","DELETE,PUT,POST,GET,OPTIONS");    
    if (req.method.toLowerCase() == 'options')
        res.send(200);  //让options尝试请求快速结束
    else
        next();
}

设置允许指定域名跨域:

app.all("*",function(req,res,next){    
//设置允许跨域的域名,*代表允许任意域名跨域
    res.header("Access-Control-Allow-Origin","http://www.zhangpeiyue.com");   
     //允许的header类型
    res.header("Access-Control-Allow-Headers","content-type");    
    //跨域允许的请求方式 
    res.header("Access-Control-Allow-Methods","DELETE,PUT,POST,GET,OPTIONS");    
    if (req.method.toLowerCase() == 'options')
        res.send(200);  //让options尝试请求快速结束
    else
        next();
}

设置允许多个域名跨域:

app.all("*",function(req,res,next){   
 if( req.headers.origin.toLowerCase() == "http://www.zhangpeiyue.com"
        || req.headers.origin.toLowerCase() =="http://127.0.0.1" ) {        
        //设置允许跨域的域名,*代表允许任意域名跨域
        res.header("Access-Control-Allow-Origin", req.headers.origin);
    }    //允许的header类型
    res.header("Access-Control-Allow-Headers", "content-type");    
    //跨域允许的请求方式 
    res.header("Access-Control-Allow-Methods", "DELETE,PUT,POST,GET,OPTIONS");    
    if (req.method.toLowerCase() == 'options')
        res.send(200);  //让options尝试请求快速结束
    else
        next();    
}

如果允许的域名较多,可以将允许跨域的域名放到数组当中:

app.all("*",function(req,res,next){    
var orginList=[        
"http://www.zhangpeiyue.com",        
"http://www.alibaba.com",        
"http://www.qq.com",       
 "http://www.baidu.com"
    ]    
    if(orginList.includes(req.headers.origin.toLowerCase())){        
    //设置允许跨域的域名,*代表允许任意域名跨域
        res.header("Access-Control-Allow-Origin",req.headers.origin);
    }    //允许的header类型
    res.header("Access-Control-Allow-Headers", "content-type");   
     //跨域允许的请求方式
    res.header("Access-Control-Allow-Methods", "DELETE,PUT,POST,GET,OPTIONS");   
     if (req.method.toLowerCase() == 'options')
        res.send(200);  //让options尝试请求快速结束
    else
        next();
}


链接: https://www.fly63.com/article/detial/7689

web网站ajax跨域方法总结与解决方案

web前端的同学如果使用ajax,如果请求后端地址和页面访问的地址“URL的首部”不同就会出现访问被拒绝的情况,这就需要跨域来解决前后端的通讯问题,下面将列举一些在实际项目中应用也是比较多的方法。

使用CSS3特性做跨域,跨域还可以这样玩

利用js动态创建一个link插入到文档中, 请求css文件,利用 computedStyle = window.getComputedStyle 获取指定元素的 style 对象,利用 computedStyle .content 获取内容

Js通过Web代理发起跨域请求

XMLHttpRequest对象(IE中为XMLHTTP对象)是AJAX应用的核心。由于现代浏览器对跨域请求的限制,在使用时需多加注意。本教程尽量用简单易懂的话描述(跨域)问题,并提供一个方案:通过Web代理(Web Proxy)

jsonp跨域原理,jsonp和ajax的区别?

Jsonp原理是动态创建一个script标签,利用script标签src属性访问没有限制,实现跨域。Ajax是页面无刷新请求数据操作,Jsonp不是真正的ajax请求。讲解Ajax 和 jsonp的区别,在jquery中使用jsonp

JSONP技术栈_jsonp的使用

JSONP方案:前端提供 API 的方法,其实解耦还没有解的很干净,我们在设置script的src时直接给它传参,后端插入这个参数这就可以了。因为JSONP是通过动态创建Script实现的,动态创建Script只有GET请求没有POST请求

CORS跨域请求

浏览器的同源策略会导致跨域,这里同源策略又分为以下两种:DOM同源策略、XmlHttpRequest同源策略。只要协议、域名、端口有任何一个不同,都被当作是不同的域,之间的请求就是跨域操作。

如何用Nginx解决前端跨域问题?

在开发静态页面时,类似Vue的应用,我们常会调用一些接口,这些接口极可能是跨域,然后浏览器就会报cross-origin问题不给调。最简单的解决方法,就是把浏览器设为忽略安全问题,设置--disable-web-security。

vue-cli3 中跨域解决方案

此方案只能用于开发环境,线上最好设置同源策略(遇到个后端,装你妈批),前后端不在同一服务器的情况下,前端要访问后端API,可通过在vue.config.js中配置代理服务器。

vue项目打包后怎样优雅的解决跨域

在使用vue.js开发前端项目时,再结合webpack搞起各种依赖、各种插件进行开发,无疑给前端开发带来了很多便捷,就在解决跨域这个问题上,相信众多用vue.js的前端同僚们同我一样尝到了甜头

nginx 反向代理处理跨域问题

正向代理是你发出请求的时候先经过代理服务器,所以实际上发出请求的是代理服务器。反向代理是“代理你的目标服务器”,请求目标服务器的代理,做一些处理后再真正请求。在这篇文章里,反向代理用于处理跨域问题。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!