Vuejs2 膝关节炎后重定向丢失

我有两个Node.js服务器应用程序。第一个在本地主机上运行KOA.JS：8081，而第二个在本地主机上运行Vu.js：808.在两个服务器中，我使用HTTP而不是HTTPS.

KOA.JS服务器使用PasPr.js执行OAuth2登录流，并提供端点以从API获取数据，并将承载令牌传递给授权头。p> Vue.js服务器负责客户端代码。它使用AXIOS库调用膝关节炎端点。 <>如果我打开浏览器，并测试膝关节炎对KOA服务器的登录流，一切都正常，工作正常。以下是步骤：

localhost:8081/api/oauth/authenticate

router.get(
“/authenticate”，
passport.authenticate(
“oauth2”，
{scope:config.scope}
))

用户登录并授予访问权限

完成后，回调被称为localhost:8081/api/oauth/callback

router.get(
  '/callback',
  ctx => {
    return passport.authenticate(
      'oauth2',
      async (err, user) => {
        if (err) ctx.throw(err)
        const tokenSession = new token(ctx.session)
        await ctx.login(user)
        tokenSession.setPublicCredentials(user)
        ctx.redirect(`${config.vuehost}/auth?isUserLoggedIn=true`)
      })(ctx)
  })

会话与用户信息一起保存

用户打开新选项卡以转到localhost:8081/api/User/profile

axios.get('http://localhost:8081/api/user/profile')
    .then (response => {
      console.info(`\nsetUserData response: ${JSON.stringify(response)}\n`)
    })
    .catch (err => {
      console.info(`\nsetUserData error: ${JSON.stringify(err)}\n`)
    })

router.get(
“/user/profile”，
异步（ctx）=>{
如果（ctx.isAuthenticated）{
常量选项={
标题：{Authorization:`Bearer${ctx.session.passport.user.access_token}`，
是的，
方法：“GET”，
uri:'https://developer.mycoolapi.com/userprofile/v1/users/@我的
}
常量响应=等待rp（选项）
ctx.body=JSON.stringify（响应）
}否则{
ctx.投掷（401）
}
}
)

<> LI>膝关节炎服务器调用另一个API来检索用户配置文件数据，vuejs应用程序得到正确的的JSON响应。 但是，如果执行以下操作，ctx.session将丢失：

导航到localhost:8080（Vue.js服务器）

通过重定向到膝关节炎端点本地主机执行登录：8081 /API/OAuth/AudioTudi/

登录并授予访问权限

<>膝关节炎/回调重定向到本地主机：8080 / AUTH？ 在VUE应用程序中，使用.RouTe.Que.IsUrSerLogEdIn检索查询参数，如果是真的，调用Koa端点以获得用户配置文件数据本地主机：8081 /API/用户/配置文件< /P>

axios.get('http://localhost:8081/api/user/profile')
    .then (response => {
      console.info(`\nsetUserData response: ${JSON.stringify(response)}\n`)
    })
    .catch (err => {
      console.info(`\nsetUserData error: ${JSON.stringify(err)}\n`)
    })

最后一步返回未经授权的401

进一步研究表明，具有配置端点的膝关节炎路由在APPROTES中间件中。此中间件位于app.use（requireLogin）中间件之后，用于检查会话是否经过身份验证（ctx.isAuthenticated（））

“严格使用”
const requireLogin=async（ctx，next）=>{
如果（ctx.isAuthenticated（））{
等待下一个
}否则{
ctx.status=401
ctx.body={
错误：[{title:'Login required'，状态：401}]
}
}
}
module.exports=requireLogin

这就是401错误发生的地方，因为此时ctx会话为空

//添加路由
app.use（authrouts.routes（））
app.use（authrouts.allowedMethods（））
应用程序使用（requireLogin）
app.use（appRoutes.routes（））
app.use（appRoutes.allowedMethods（））

我是在处理某种时间问题吗？我试着在我的膝关节炎服务器上评论头盔中间件，但这并没有帮助。p> 请注意，如果我在同一浏览器会话中打开一个新选项卡并转到localhost:8081/api/user/profile，它就可以正常工作。只有在从Vue.js调用此端点时，才会由于ctx.sessession为null而失败

---

你知道是什么将ctx.session重置为null吗？

仔细阅读本文后，我终于解决了这个问题

在server.js中，将{credentials:true}传递给cors选项

app.use（cors（{credentials:true}））

用泛型fetch替换axios.get（）调用会导致相同的401未授权问题和空ctx.session。该问题似乎与axios库无关。