使用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

运行时对象 并在

nuxt.config.js

文件中传递您的秘密

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

如果您阅读了nuxtServerInit

的文档，您可以看到

仅在服务器端调用以预填充商店的 Vuex 操作

由于此方法仅在服务器端，因此您可以使用

apiSecret

（在我的示例中），并且它在安全方面应该完全没问题。

PS：请记住，除了服务器上生成的内容（因此，使用 NodeJS 或

nuxtServerInit

）之外的所有内容都是“公共的”。因此，您的 VueJS 的客户端代码生命周期挂钩是公共的：

mounted()

、

fetch()

、

asyncData()

，因为它们在您的浏览器的开发工具上可见。

---

此外，您的端点应该那么重要吗？如果是这样，

nuxtServerInit

是最好的选择。如果您需要以“私有方式”获取更多数据，则需要通过某些后端代理它以隐藏敏感信息并仅检索有用的公共数据。