koa——跨域CORS问题解决、跨域调试
在使用koa开发nodejs应用时,碰到跨域问题,即本地进行前端开发时,不能请求已经部署在某个域名下的接口。使用koa-cors 和 koa2-cors 发现并没有效果。
也许是我用koa不多,感觉koa不是很好用很完备。比如没发指定当前的基础路径,需要文件结构配合,比如使用koa-cors或koa2-cors 发现并没有解决跨域问题——没有设置上允许跨域的源,只能自己手写一个cors解决跨域的问题。
这里写一下cors函数的代码
const REG_WHITE_LIST = /^https?:\/\/(?:[0-9a-zA-Z-]+\.)*\.(?:ws|biz|com)(?::\d+)?$/;
// 这里写上想要匹配的域名
module.exports = async function cors (ctx, next) {
const origin = ctx.get('Origin');
if (origin && REG_WHITE_LIST.test(origin)) {
ctx.set('Access-Control-Allow-Origin', origin); // 允许跨域
ctx.set('Access-Control-Allow-Methods', 'POST,GET,OPTIONS,HEAD,PUT,DELETE'); // 支持的方法
ctx.set('Access-Control-Allow-Credentials', 'true'); // 允许传入Cookie
ctx.set('Access-Control-Max-Age', 2592000); // 过期时间一个月
// 如果有特殊的请求头,直接响应
if (ctx.get('Access-Control-Request-Headers')) {
ctx.set('Access-Control-Allow-Headers', ctx.get('Access-Control-Request-Headers'));
}
// FIX:浏览器某些情况下没有带Origin头
ctx.set('Vary', 'Origin');
// 如果是 OPTIONS 请求,则直接返回
if (ctx.method === 'OPTIONS') {
ctx.status = 204;
return;
}
}
await next();
};
将上述cors函数直接在 koa的实例里面使用。就可以跨域了。
const app = new Koa();
app.use(require("./cors.js"));
ps:受伤没有前端项目,想试一试自己写的跨域对不对怎么办?
这里给大家放上一段代码,直接在工作台的console的使用XMLHttpRequest。
var httpRequest = new XMLHttpRequest();
httpRequest.open('GET', 'https://xxxx.com/api', true);
httpRequest.withCredentials =true; // 携带cookie信息
httpRequest.send();
执行之后,httpRequest.response
即可查看返回的信息。
详细内容看https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest
从上面的代码可以看出,不论是否跨域,服务都会接收到请求,并且能够访问请求的所有信息,而且服务器会去处理该请求,并返回相关信息。
标题:koa——跨域CORS问题解决、跨域调试
作者:limanting
地址:https://blog.manxiaozhi.com/articles/2021/08/14/1628912918963.html