上传到 Zeit/Now 时客户端中暴露的 Nuxt 环境变量

Question

我正在使用 Zeit/Now 部署 Nuxt 应用程序。在开发阶段，我使用一个.env文件将机密存储到我的 Contentful CMS，process.env并使用 nuxt-dotenv 包公开机密。为此，我在 nuxt.config 的顶部调用了require('dotenv').config().

然后我用 Zeit/Now 存储了这些机密，并创建了一个 now.json 来为构建和运行时设置它们，如下所示：

{
    "env": {
        "DEMO_ID": "@demo_id"
    },
    "build": {
        "env": {
          "DEMO_ID": "@demo_id"
        }
    }
}

使用该设置，构建仅适用于索引页面，所有 Javascript 都不起作用。只有当我将 env-property 添加到nuxt.config.js文件时，该应用程序才开始在 Zeit-server 上正常工作。

require('dotenv').config()

export default {
...
env: {
   DEMO_ID: process.env.DEMO_ID
  },
...
  modules: [
    '@nuxtjs/dotenv'
  ],
...
}

但是：当我检查上传的 Javascript 文件时，我的秘密被暴露了，这显然是我不想要的。

我在这里做错了什么？谢谢你的帮助。

Answer 1

你不一定在这里做错了什么，这就是 Nuxtjs 的工作原理。

属性中声明的变量env用于替换 的实例process.env.MY_ENV，但由于 Nuxt 是同构的，因此这可以同时在服务器和客户端上。

如果您希望这些机密只能在服务器上访问，那么解决此问题的最简单方法是使用serverMiddleware.

由于 serverMiddleware 与主 Nuxt 构建分离，因此 nuxt.config.js 中定义的 env 变量在那里不可用。

这意味着您的正常 ENV 变量应该是可访问的，因为服务器中间件在 Node 上运行。

显然，这意味着这些秘密在客户端不可用，但如果您有类似 Stripe 秘密密钥之类的东西需要用来发出后端请求，那么这种方法就有效。