我对 Auth0 和 Nuxt.js 进行了以下设置。不知何故之后 loginWith
,页面在重定向到 Auth0 的登录页面之前仍会继续呈现一小段时间。 loginWith 返回的 promise 是 undefined
,这使得阻止它成为不可能。有没有办法在不先渲染页面的情况下立即进行 Auth0 登录?
if (!this.$auth.loggedIn) {
await this.$auth.loginWith("auth0");
}
const user = this.$auth.user;
// Operations using user information below //
最佳答案
首先你不应该阻塞渲染 直到一些异步操作完成。基本上,需要异步调用用“await”修饰的函数才能让 UI 线程完成其工作。
您应该为用户显示一些有用的信息,而不是阻止渲染,至少是一些描述正在执行的过程的消息:“授权...”或类似的东西。
要解决您的问题,您可以在您的组件(或您的 vuex 商店)中声明一些 bool 变量,该变量在用户获得授权之前设置为 false。通过在您的 html 模板中检查此值,您可以防止在浏览器重定向到身份验证页面之前显示页面内容。
data() {
return {
isAuthorized: false;
}
}
// your code
if (!this.$auth.loggedIn) {
await this.$auth.loginWith("auth0");
} else {
this.isAuthorized = true;
}
// process user information
关于vue.js - Nuxt.js loginWith Auth0 延迟重定向,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69154725/