Nuxt Auth +社会名流手动登录

Question

我正在尝试使用Nuxt Auth模块和社交名流进行社交登录。我在Laravel 8中有一个API，在NuxtJS中有一个客户端。

我想知道是否有人能告诉我：

• ，如果我的逻辑是好的？
• ，如何使用nuxt (手动设置令牌和用户)？

手动登录用户

因此，目前我的社交登录流程如下：

1. Click on login with google对我的后端进行API调用，从社交网站获得重定向URL到google。
2. 将我的前端重定向到google登录页面，然后在我选择帐户后返回到我的前端应用程序。
3. 将谷歌代码发送到后端，用于社交网站的回调端点，然后将google用户抓取给我。在与应用程序中的用户打交道之后，我返回通过执行return $this->okResponse(['token' => $nativeUser->createToken('social-login')->accessToken]);
4. At创建的令牌--这一点--我回到了标记的前端，然后我尝试设置this.$auth.setUserToken(response.data.token)，这显然不等于登录用户。看起来是这样的：

mounted() {
    this.$axios.get(`login/social/google/callback`, {params: {code: this.$route.query.code}}).then(response => {
      console.log(response)

      // this.$auth.strategy.token.set(response.data.token)
      this.$auth.setUserToken(response.data.token)

      if (this.$auth.loggedIn) {
        console.log('I am logged in!')
      } else {
        console.log('I am NOT logged in!', this.$auth)
      }
    })
  }

我没有登录。我必须手动设置loggedIn、'User‘和token吗？还是这就是疯狂？我在这里看到的唯一解决方案是我自己的自定义策略，但这似乎完全过火了。

Answer 1

不知道这是不是最好的方法，但我最后做了这样的事情。

  mounted() {
    this.$axios.get(`login/social/google/callback`, {params: {code: this.$route.query.code}}).then(response => {
      this.$auth.setUserToken(response.data.token)
      this.$auth.setUser(response.data.user)

      if (this.$auth.loggedIn) {
        console.log('I am logged in!')
      } else {
        console.log('I am NOT logged in!', this.$auth)
      }
    })
  }

这件事似乎还好。