使用SSR Nuxt如何进行私聊？

Question

我正在为 WordPress 网站编写无头解决方案，并注意到对于一个特定端点，我需要进行身份验证才能提取一些将公开使用的数据。但是，我担心我使用它的地方会将它暴露给网络。

在我的 store/index.js 中，我使用 nuxtServerInit 操作方法来执行一些操作，并向它们传递一些它们完成任务所需的对象：

async nuxtServerInit ({ dispatch }, { $axios, app }) {
  await dispatch('initialize', { $axios, app })
},

传递

$axios 是因为它将用于查询 API，传递 app 是为了帮助构建验证请求的选项。

这是 Nuxt SSR 中的安全漏洞吗？我觉得是这样的。如果是这样，您可以使用秘密的唯一有效区域在哪里？ asyncData ()?

Answer 1

如果您使用的是 SSR，则可以使用 privateRuntimeConfig runtime object 并在 nuxt.config.js 文件中传递您的秘密

export default {
  privateRuntimeConfig: {
    apiSecret: process.env.API_SECRET
  }
}

如果你阅读 documentation of nuxtServerInit，你可以看到

Vuex action that is called only on server-side to pre-populate the store

由于此方法仅适用于服务器端，您可以使用 apiSecret（在我的示例中）并且在安全方面应该完全没问题。

PS：请记住，除了在服务器上生成的内容（因此，使用 NodeJS 或 nuxtServerInit）之外的所有内容都是“public”。所以你的 VueJS 的客户端代码生命周期钩子是 public: mounted(), fetch(), asyncData() 因为它们将在你的浏览器的 devtools 上可见。

此外，您的端点应该那么重要吗？如果是这样，nuxtServerInit 是个不错的选择。如果您需要以“私有方式”获取更多数据，则需要通过某些后端对其进行代理以隐藏敏感信息并仅检索有用的 public 数据。

使用SSR Nuxt如何进行私聊？

How to make a private call when using SSR Nuxt?

security

nuxt.js