关注web技术发展
用心做好每一件事

nodejs(koa2)+vue2前后端分离项目解决session跨域丢失问题

博主前端攻城狮一枚,熟悉nodejs,平时喜欢自己写一个简单的全栈项目,后端框架(koa2),此方法适用所有前后端分离项目session失效问题。
koa2用的session组件是koa-session-minimal&&koa-mysql-session,存入了mysql,跨域问题用的是koa-cors
在前后端项目分离项目中,session会丢失,原因是,服务端无法跨域写入cookie,之前的解决办法是,在登录的时候,把seesionid在接口处理中以参数的形式返回给前端,前端在请求的时候再带回来。这么做,虽然解决了问题,但是需要改源码包,而且操作不方便,容易出现问题。查找资料,也没找到一个比较合理的解决方法。
后来发现跨域写cookie是可以解决的,结合项目,处理了一下,果然可以解决,网上说这么处理不安全,暂时没发现好的方法,先这么处理吧,记录一下:

koa处理:

app.use(cors({
    origin: function (ctx) {
        return ctx.header.origin 
    },
    credentials:true
}))

要点:
1. origin:一定要设置具体的域名,不能设置为'*'
2. credentials:true

前端处理:在ajax里面加上withCredentials:true,

eg:我二次封装vue的axios

post(url, data) {
    return axios({
        method: 'post',
        url: base_url + url,
        data: JSON.stringify(data),
        timeout: 30000,
        headers: {
        'X-Requested-With': 'XMLHttpRequest',
        'Content-Type': 'application/json; charset=UTF-8'
        },
        withCredentials:true
    }).then(checkStatus).then(checkCode)
},

要点: withCredentials:true

至此,应该已经解决前后端分离项目session跨域的问题了

分享到: 更多 (0)

我要点评 抢沙发

评论前必须登录!