node(koa2)跨域与获取cookie

欲做一个node 的网关服务,通过 cookie 做信息传递,选择框架 koa2,这里简单记录跨域处理以及 cookie 获取。

 

首先:解决跨域问题,使用 koa2-cros 来处理,跨域问题后端处理就好,与前端无瓜。

const cors = require('koa2-cros')

app.use(cors({
  origin: '*'
}))

 

其次:解决跨域是传递 cookie 问题,现在的浏览器请求默认都不带 cookie 的,要带上cookie 则需要添加配置参数,原生 fetch 方法需要添加 credentials: 'include' 参数,使用如下:

fetch('htp://192.168.210.151:3002/proxy', {
    credentials: 'include',
})
// 如果你用的 axios,请在配置参数中添加 withCredentials: true 参数即可

后端添加  credentails: true 

const cors = require('koa2-cros')

app.use(cors({
  origin: '*',
  credentails: true,
}))

然后新问题就出现了,浏览器发请求出现如下问题

意思就是 Access-Control-Allow-Origin: '*' 与 credentials: 'include' 不能共存,这里需要后端的请求头将 Access-Control-Allow-Origin: '*' 中的 '*' 改成发送请求的 origin 就好了,如果粗暴点的话直接改成如下

const cors = require('koa2-cros')

app.use(cors({
  origin: (ctx) => {
     const origin = ctx.headers.origin  // 实际生产请根据具体情况来进行规则配置
     return origin
  }
}))

 

然后的话客户端拿到的 Response Headers 对比如下

node(koa2)跨域与获取cookie_第1张图片 node(koa2)跨域与获取cookie_第2张图片

最终,虽然还是会出现 Provisional headers are shown 这个警告,但是前端也可以拿到数据了,后端也可以拿到 cookie 了。

 其他浏览器并没有出现这个 Provisional headers are shown 警告,所以这个应该仅是 chrome 的一个警告。

转载于:https://www.cnblogs.com/YMaster/p/11315565.html

你可能感兴趣的:(node(koa2)跨域与获取cookie)