Question

我在尝试使用Google策略OAuth2将Vue + Axios应用与Passport快速后端相结合时遇到问题。

我的快递服务器位于localhost:5000，我的vue-cli webpack dev服务器位于localhost:3000。我正在使用webpack proxyTable选项来代理从/api到localhost:5000/api的请求。据说它还涉及角色。如果我在我的vue应用程序<a href="/api/auth/google">Auth with Google</a>中使用普通超链接，它会按预期工作，但是如果我尝试使用axios：

async authGoogle() {
  const response = await axios.get('/api/auth/google')
  console.log(response)
}

我从google api回调中收到此错误：

Failed to load https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A5000%2Fapi%2Fauth%2Fgoogle%2Fcallback&scope=profile%20email&client_id={client_id}: 
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://localhost:3000' is therefore not allowed access.

这些是api路线：

app.get(
  '/api/auth/google',
  passport.authenticate('google', { scope: ['profile', 'email'] })
)

app.get(
  '/api/auth/google/callback',
  passport.authenticate('google'),
  function(req, res) {
    res.json({ success: true })
  }
)

在这种情况下，如何让axios正常工作？

Vue / Axios + Passport JS + Google导致Cors（？）Access-Control-Allow-Origin

0 个答案: