隐藏Github页面的api密钥

Question

我有一个组织的github页面,我想从第三方api调用数据,我需要一个身份验证令牌.我是否可以在公共回购中没有显示身份验证令牌的情况下发布此github页面？

Answer 1

简而言之,没有.如果您的GitHub回购是公开的,那么它的所有资产都是公开的.您可以将repo设为私有,如果使用username.github.io约定命名,或者如果它具有gh-pages分支,它仍将在GitHub页面上发布.虽然这是一个选择,但这不一定是正确的做法.

如果你的密钥在你的GitHub页面回购中,它听起来像是用于JavaScript中的客户端API调用.如果是这样,您的身份验证令牌是公开可见的,无论它是在您的公共存储库中还是在客户端文件中发送到浏览器.这通常很好.第三方API可能已根据您网站的域生成了身份验证令牌,并将使用该令牌的呼叫限制为源自您域的网页.否则,他们可能只需要auth令牌来记录请求和监视使用情况.

如果auth令牌真的是私有的,那么您可能需要编写私有服务器端代码来调用第三方API.然后,您的GitHub Pages站点可以为您的服务提供所需的数据.在Web API存在安全问题之前,我必须这样做,但我仍然需要从客户端检索非敏感数据.

Answer 2

简而言之，是的，您可以将身份验证令牌存储在环境变量中，并在.env文件中使用gitignore来隐藏公共存储库中的身份验证令牌。在客户端 API 上刷新身份验证令牌，然后将更改推送到公共存储库并将更新重新部署到gh-pages分支。我在下面提供了此过程的示例。

笔记

如果您提交了密码或 API 密钥，请更改它！如果您提交了一个密钥，则生成一个新的。参考GitHub 上的一般最佳实践。

如果在您的应用程序中使用React，请跳过步骤 1 和 2，因为React已经预先安装了自定义环境变量。参考创建 React 应用程序。

完整的解释可以在下面找到：

1.在应用根目录安装dotenv依赖（本例将使用Node.js）参考npm，运行命令：

npm install dotenv

2.在index.js文件中添加以下代码以导入语句。

require('dotenv').config();

3.在app的根目录下创建.env文件并添加auth token作为变量。请注意，在使用React 时，您必须在变量名前加上REACT_APP_

AUTH_TOKEN=987asc8iks0lenv7

4.在process.env上使用console.log()检查变量是否正确存储。

console.log(process.env.AUTH_TOKEN);

5.更新应用程序代码中对身份验证令牌的所有引用。

OLD VARIABLE: const auth_token = '987asc8iks0lenv7';

NEW VARIABLE: const auth_token = process.env.AUTH_TOKEN;

6.创建并添加.gitignore文件到应用程序的根目录，并在下面添加代码让git忽略存储auth令牌的.env文件。

.env

7.添加、提交和推送更新到GitHub 上的应用程序主分支。

8.将更新部署或重新部署到gh-pages分支。使用下面的命令。

npm run deploy

Answer 3

Ashen 的答案不适用于此用例。通过 Github 配置的机密仅适用于 Github Actions（请参阅文档），因此，在实践中，主要适用于类似 CI/CD 的应用程序。不适用于客户端 API 调用等。