NuxtJS Auth在第二次API调用之前重定向

Question

当我在登录页面上运行以下方法时，我得到了一些奇怪的行为。在调用login()方法之后，我想要运行一个单独的调用来获取配置文件详细信息&权限，然后重定向到/home，但它直接重定向到/，在第二个api调用返回之前:

attempt() {
try {
let data = {
email: this.creds.email,
password: this.creds.password
}
this.$auth.login({data: data}).then(() => {
//I want this API call to run BEFORE redirecting
this.axios.get(this.makeAuthUrl('user/'+process.env.NUXT_ENV_COMMUNITY_ID), this.getHeaders(false)).then(user => {
console.log(user.data)
this.$store.commit("SET_PROFILE", user.data.profile)
this.$store.commit("SET_ABILITIES", user.data.abilities)
this.actionLoading = false;
this.$router.push({path: "/home"})
})
})
} catch (e) {
console.log(e)
this.actionLoading = false;
this.$toast.error("Invalid Credentials!");
}
}

那么我如何修改代码以延迟重定向，直到我显式重定向用户?使用nuxtjs/auth模块

谢谢!编辑-添加async await等待解释

async attempt() {
try {
let response = await this.$auth.loginWith('local', {
data: {
email: this.creds.email,
password: this.creds.password
}
})
this.axios.get(this.makeAuthUrl('user/'+process.env.NUXT_ENV_COMMUNITY_ID), this.getHeaders(false)).then(user => {
console.log(user)
this.$store.commit("SET_PROFILE", user.data.profile)
this.$store.commit("SET_ABILITIES", user.data.abilities)
this.actionLoading = false;
this.$router.push({path: "/"});
})
} catch (e) {
console.log(e)
this.actionLoading = false;
this.$toast.error("Invalid Credentials!");
}
}

编辑2

try {
let response = await this.$auth.loginWith('local', {
data: {
email: this.creds.email,
password: this.creds.password
}
})
let response2 = await this.axios.get(this.makeAuthUrl('user/'+process.env.NUXT_ENV_COMMUNITY_ID), this.getHeaders(false))
if(response2.status === 200) {
console.log(response2.data)
this.$store.commit("SET_PROFILE", response2.data.profile)
this.$store.commit("SET_ABILITIES", response2.data.abilities)
await this.$router.push({path: "/"});
}
} catch (e) {
console.log(e)
this.actionLoading = false;
this.$toast.error("Invalid Credentials!");
}

Answer 1

修改如下:

async attempt() {
try {
let data = {
email: this.creds.email,
password: this.creds.password
}
let response = await this.axios.post(this.makeAuthUrl('login'), data, this.getHeaders(false))
if(response.status === 200) {
this.$auth.strategy.token.set(response.data.token)
}
let getUser = await this.axios.get(this.makeAuthUrl('user/'+process.env.NUXT_ENV_COMMUNITY_ID), this.getHeaders(false))
if(getUser.status === 200) {
this.$auth.setUser(getUser.data.user)
this.$store.commit("SET_PROFILE", getUser.data.profile)
this.$store.commit("SET_ABILITIES", getUser.data.abilities)
return this.$router.push({path: "/"});
}
} catch (e) {
this.actionLoading = false;
this.$toast.error("Invalid Credentials!");
}
}