使用 EAS 反应原生 Expo 环境变量

Posted 2023-03-14

【中文标题】使用 EAS 反应原生 Expo 环境变量

【英文标题】：React Native Expo Environment Variables with EAS

【发布时间】：2021-12-29 00:08:52

【问题描述】：

我有一个需要在我的应用程序中使用的密钥。在网络上，我会使用 .env 文件，但使用 React Native 和 Expo。

我想使用EAS Build，找到了以下文档EAS variables docs

这提供了有关将“秘密”添加到您的 eas.json 文件的信息，但我找不到 2 个重要的东西：

使用什么代码来访问 dev 和 prod 环境中的秘密变量。

我认为在生产中代码将是“process.env.SECRET_KEY”并希望相同的代码适用于开发环境，但我不确定如何在开发中填充 process.env SECRET_KEY。

当我在我的应用程序中使用 console.log(process.env) 时，我只会得到 NODE_ENV: "development"。

我的想法是，许多应用程序都需要某种秘密信息，因此任何关于最佳实践的想法或在这一点上的任何方法都可以让它发挥作用！

【参考方案1】：

我能够让环境（秘密）变量与 eas 构建过程一起使用。

我确信还有其他方法可以做到这一点，但这是我采取的方法：

我选择将.env 文件用于dev 环境，将eas secret:create 命令用于eas 构建。

首先，您需要使用 eas cli 为您的项目创建一个 secret。 eas secret command

然后，使用您的密钥创建 .env 文件。确保它与为 eas 创建的密钥具有相同的拼写。

然后，您将使用 app.config.js 文件注入密钥，以便您的代码可以访问它。注意：我发现我需要删除 app.json 文件。我将所有配置从app.json 移动到app.config.js。

还记得在终端上运行 npm install dotenv 以将 dotenv 添加到您的项目中。

// the dotenv/config will read your .env file 
// and merge it with process.env data
// This is just for the builds that happen outside of eas
import "dotenv/config";

// the secrets created with eas secret:create will
// be merged with process.env during eas builds
const secretKey = process.env.SECRET_KEY;

export default 
  name: "TV Tracker",
  slug: "tv-tracker",
  scheme: "tvtracker",
...
  // THIS IS WHAT WE READ IN THE CODE
  // uses the expo constants package
  extra: 
    secretKey: secretKey,
  ,
;

现在我们可以使用 expo-constants 模块读取 secretKey。

import Constants from "expo-constants";
...

let secretKey = Constants.manifest.extra.secretKey;

【讨论】：

另外记得在你的终端上运行 npm install dotenv 来将 dotenv 添加到你的项目中。