时间戳

首页 > 解决方案 > Nuxt auth getToken witnin async 未定义

javascript - Nuxt auth getToken witnin async 未定义

问题描述

我正在尝试从用户那里获取一些数据，我需要在调用中传递不记名令牌。

async asyncData () {
    let response = await axios.get('dataURL', {}, { headers: {"Authorization" : `Bearer ${this.$auth.getToken('local')}`} })
  },

但这不起作用，它总是说 $auth 未定义，而在模板中我可以轻松输出任何 $auth 属性...

如何在异步中获取不记名令牌？

标签： javascriptvue.jsnuxt.js

解决方案

@Titus 是正确的，“这个”就是问题所在。您在 asyncData 中没有可用的“this”，因为：

您无法通过 asyncData 中的 this 访问组件实例，因为它是在启动组件之前调用的。

但是，您确实可以访问“上下文”，因此您可以使用以下方法调用 auth 模块：

async asyncData (context) {
    let response = await axios.get('dataURL', {}, { headers: {"Authorization" : `Bearer ${context.app.$auth.getToken('local')}`} })
  },

nuxtjs/Auth文档

但是，您仍然没有按照应有的方式使用 asyncData，因为您没有返回任何可以与数据合并的内容，因此您可能想像这样尝试：

async asyncData (context) {
    let { response } = await axios.get('dataURL', {}, { headers: {"Authorization" : `Bearer ${context.app.$auth.getToken('local')}`} })
    return { token: response }
  },

话虽如此，我真的不明白为什么要在组件中获取令牌。当然，您最好通过商店中的 nuxtServerInit 在全球范围内获取它。

推荐阅读