NuxtJS：如何在服务器端访问Vuex状态

Question

我正在使用NuxtJS fetch()挂钩从REST服务获取异步数据。以下是请求

async fetch() {
  let response = await this.$axios.$get(`http://localhost:8080/app-server/v1/post/id/${this.$route.params.id}`);
}

我还需要发送一个可选的查询参数uid，这是用户登录时的用户ID。用户ID以Vuex状态存储，可以像下面这样在客户端进行访问

this。$ store.state.user.userDetails.id

但是，当重新加载页面并在服务器端执行 fetch（）时，将返回 null 。我也在寻找一种在服务器端访问此状态的方法。我尝试像下面那样使用Nuxt上下文this.$nuxt.context，但在服务器端运行时它也会返回 null 。

this。$ nuxt.context.store.state.user.userDetails.id

任何建议如何在服务器端访问Vuex状态。谢谢

Answer 1

有一个预定义的方法nuxtServerInit，您可以在商店中使用它来在获取数据之前将用户ID获取到服务器端的vuex。 https://hashinteractive.com/blog/using-nuxtserverinit-in-vuex-to-fetch-component-data/

然后，您可以使用fetch方法从商店中检索它。 Nuxt 2.12.2: Filling the store with the new fetch method