麻烦让Heroku在反应应用程序中识别gitignored api键

Question

我无法让Heroku识别出我在我的React应用程序上发出的api密钥。

我用api键创建了credentials.js并将其导出。

export const API_KEY = 'redacted';

然后我在gitignore中列出了credentials.js。

credentials.js

然后我将API_KEY导入到我的项目文件中。

import { API_KEY } from '../credentials.js';

这在开发中运行良好，但是当我推送到Heroku时，它无法解析凭证的路径，并且编译失败，因为它位于gitignored文件中。我也尝试过使用.env文件，但这也不起作用。

我尝试不导入它，只是在终端中运行Heroku“config set”命令，但无济于事。

$heroku config:set API_KEY=<key>

此外，问题是在index.html文件中导入API_KEY gitignored变量。你如何在React应用程序中执行此操作，就像在rails中使用application.yml文件并使用＃{ENV [API_KEY]}引用它一样？

有没有人有经过验证的解决方案？

Answer 1

由于您已经使用您提到的命令在Heroku env上设置了API_KEY，因此为了使用它，您需要执行以下操作：

const API_KEY = process.env.API_KEY;

通过这种方式，您将能够阅读Heroku环境。您可以看到更多信息here。