我正在尝试将登录到我用户数据库的 GitHub OAuth 用户保存。我正在使用 Nuxt.js 身份验证模块来实现该功能。
`Nuxt.config.js 中的身份验证设置
auth: {
strategies: {
local: {
token: {
property: 'data.token',
},
user: {
property: 'data',
},
endpoints: {
login: { url: 'login', method: 'post' },
user: { url: 'byToken', method: 'get' },
logout: { url: 'logout', method: 'get' },
},
},
github: {
clientId: process.env.GITHUB_CLIENT_ID,
clientSecret: process.env.GITHUB_CLIENT_SECRET,
},
},
},
Login.vue 页面
<template>
<button class="social-icons" @click="githubLogin()">
Login with Github
</button>
</template>
<script>
export default {
methods: {
async githubLogin() {
try {
const response = await this.$authApi.loginWithGithub()
} catch (err) {
console.log(err)
}
},
},
}
</script>
验证插件文件
export default function (context, inject) {
inject('authApi', {
loginWithGithub,
})
async function loginWithGithub() {
try {
await context.$auth.loginWith('github')
// Get the required info from the user object set in vuex
const user = context.$auth.user //This is undefined
const userInfo = {
oAuthId: user.id,
username: user.login,
name: user.name,
bio: user.bio,
email: user.email,
profilePhoto: user.avatar_url,
isOAuthUser: true,
}
// My api server to store the passed userinfo to db
const response = await context.$axios.post('/socialRegister', userInfo)
return response
} catch (err) {
setErrorMessage(err)
}
}
}
现在,当我单击按钮使用 GitHub 登录(Login.vue)时,该模块成功将从 GitHub 接收到的访问令牌设置为本地存储,并将用户设置为状态。但是正如您在 loginWith('github')context.$auth.user
未定义后的代码(auth.js 插件文件)中看到的那样。现在我的问题是我如何访问用户信息,以便我可以将该信息转发到我的 api 服务器以将用户存储在数据库中。