在前端开发中，经常需要使用敏感信息（如 API key、密码等），但将它们硬编码到代码中是不安全的。因此，需要将这些敏感信息存储在环境变量中，然后从代码中引用它们。而 npm 包 envsign 就为我们提供了一种有效的环境变量安全解决方案。
什么是 envsign
envsign 是一个 npm 包，它可以帮助我们将敏感信息转换成加密信息并存储在环境变量中。它使用了一个秘钥来加密敏感信息，而这个秘钥本身也存储在环境变量中，因此保证了所有的敏感信息都可以被安全地存储。
同时，envsign 还提供了简单易用的 API，可以通过调用方法来解密环境变量中存储的信息。
如何使用 envsign
安装和配置
首先，需要在项目中安装 envsign：
npm install envsign --save
接着，在项目的根目录下创建一个名为 .envsign 的文件，用来存储秘钥。在这个文件中，需要定义一个环境变量 ENVSIGN_KEY，用来存储秘钥：
ENVSIGN_KEY=your-encryption-key
需要注意的是，这个秘钥需要保密，所以不能将它存储在源代码库中。可以通过使用 Git 的 gitignore 功能来防止意外地提交秘钥。
存储加密信息
现在，就可以使用 envsign 工具将敏感信息转换成加密信息，然后存储在环境变量中了。在命令行中输入以下命令：
envsign set [name] [value]
其中，name 表示需要存储的环境变量名称，而 value 则表示需要加密的敏感信息。例如：
envsign set API_KEY my-api-key
这个命令会将 my-api-key 转换成加密信息，并存储在环境变量 API_KEY 中。如果需要存储多个加密信息，可以多次调用 envsign set 命令。
需要注意的是，由于秘钥与加密信息是一一对应的，所以换用不同的秘钥会导致原来的加密信息无法解密，因此必须使用同一个秘钥来解密存储在环境变量中的加密信息。
解密环境变量
当需要使用加密信息时，可以通过 envsign 提供的 API 来解密环境变量。在代码中，使用以下方法即可：
const envsign = require('envsign');
const apiKey = envsign.get('API_KEY');这个代码会从环境变量 API_KEY 中获取已存储的加密信息，并调用 envsign API 来解密它。最后，将得到的敏感信息保存在 apiKey 变量中。
示例代码
以下是一个使用 envsign 的示例代码，其中引入了 axios 模块，使用 envsign 来解密环境变量中存储的 API key，并向后端服务器发起了请求：
-- -------------------- ---- -------
----- ----- - -----------------
----- ------- - -------------------
----- ------ - -----------------------
--------------------------------------------- -
------- -
-------- ------
-
--
-------------- ---------- -
---------------------------
--
--------------- ------- -
-------------------
---总结
envsign 是一个有效的环境变量加密解决方案，它可以帮助前端开发者保证敏感信息的安全性。通过本文的介绍，你已经了解到了如何使用 envsign 存储和解密环境变量，希望本文对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60065f84238a385564ab6c68