koa2-cors设置允许指定单个域名、多个域名、所有域名跨域

本文涉及的产品
.cn 域名,1个 12个月
简介: 在你koa项目入口文件中引入一个中间件koa2-cors,然后执行下它的cors()方法就完了,但考虑到安全性问题,我们上线后并不希望所有人可以去跨域访问接口,那么如何做?

允许所有域名跨域访问


const cors = require('koa2-cors');// CORS是一个W3C标准,全称是"跨域资源共享"
app.use(cors()); //全部允许跨域


你没有看错,就这么简单,在你koa项目入口文件中引入一个中间件koa2-cors,然后执行下它的cors()方法就完了,但考虑到安全性问题,我们上线后并不希望所有人可以去跨域访问接口,那么如何做?


指定单个域名跨域


app.use(
    cors({
        origin: function(ctx) { //设置允许来自指定域名请求
            return 'http://localhost:8080'; //只允许http://localhost:8080这个域名的请求
        },
        maxAge: 5, //指定本次预检请求的有效期,单位为秒。
        credentials: true, //是否允许发送Cookie
        allowMethods: ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS'], //设置所允许的HTTP请求方法
        allowHeaders: ['Content-Type', 'Authorization', 'Accept'], //设置服务器支持的所有头信息字段
        exposeHeaders: ['WWW-Authenticate', 'Server-Authorization'] //设置获取其他自定义字段
    })
);


设置多个域名可跨域


app.use(
    cors({
        origin: function(ctx) { //设置允许来自指定域名请求
            const whiteList = ['http://weipxiu.com','http://localhost:8081']; //可跨域白名单
            let url = ctx.header.referer.substr(0,ctx.header.referer.length - 1);
            if(whiteList.includes(url)){
                return url //注意,这里域名末尾不能带/,否则不成功,所以在之前我把/通过substr干掉了
            }
            return 'http://localhost::3000' //默认允许本地请求3000端口可跨域
        },
        maxAge: 5, //指定本次预检请求的有效期,单位为秒。
        credentials: true, //是否允许发送Cookie
        allowMethods: ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS'], //设置所允许的HTTP请求方法
        allowHeaders: ['Content-Type', 'Authorization', 'Accept'], //设置服务器支持的所有头信息字段
        exposeHeaders: ['WWW-Authenticate', 'Server-Authorization'] //设置获取其他自定义字段
    })
);


相关文章
|
3月前
|
JSON 安全 前端开发
浅析CORS跨域漏洞与JSONP劫持
浅析CORS跨域漏洞与JSONP劫持
109 3
|
27天前
|
开发框架 中间件 Java
如何处理跨域资源共享(CORS)的 OPTIONS 请求?
处理 CORS 的 OPTIONS 请求的关键是正确设置响应头,以告知浏览器是否允许跨域请求以及允许的具体条件。根据所使用的服务器端技术和框架,可以选择相应的方法来实现对 OPTIONS 请求的处理,从而确保跨域资源共享的正常进行。
|
27天前
|
JavaScript 前端开发 API
跨域资源共享(CORS)的工作原理是什么?
跨域资源共享(CORS)通过浏览器和服务器之间的这种交互机制,在保证安全性的前提下,实现了跨域资源的访问,使得不同源的网页能够合法地获取和共享服务器端的资源,为现代Web应用的开发提供了更大的灵活性和扩展性。
|
2月前
|
JSON 前端开发 安全
CORS 是什么?它是如何解决跨域问题的?
【10月更文挑战第20天】CORS 是一种通过服务器端配置和浏览器端协商来解决跨域问题的机制。它为跨域资源共享提供了一种规范和有效的方法,使得前端开发人员能够更加方便地进行跨域数据交互。
|
2月前
|
缓存 前端开发 应用服务中间件
CORS跨域+Nginx配置、Apache配置
CORS跨域+Nginx配置、Apache配置
192 7
|
2月前
|
域名解析 网络协议
非阿里云注册域名如何在云解析DNS设置解析?
非阿里云注册域名如何在云解析DNS设置解析?
|
2月前
|
弹性计算 网络协议 安全
如何使用阿里云虚拟主机和域名设置网站?
如何使用阿里云虚拟主机和域名设置网站?
|
2月前
|
监控 数据安全/隐私保护 CDN
防止域名被攻击或盗刷产生突发高带宽,阿里云国际如何设置带宽上限值?
防止域名被攻击或盗刷产生突发高带宽,阿里云国际如何设置带宽上限值?
|
3月前
|
安全
CORS 跨域资源共享的实现原理
CORS 跨域资源共享的实现原理
|
4月前
|
Web App开发 JSON 数据格式
【Azure Developer】浏览器查看本地数据文件时遇见跨域问题(CORS)
【Azure Developer】浏览器查看本地数据文件时遇见跨域问题(CORS)
【Azure Developer】浏览器查看本地数据文件时遇见跨域问题(CORS)