如何在React项目中利用环境变量实现功能?
P粉268284930
P粉268284930 2023-09-16 13:18:15
0
1
909

我正在尝试将我的API密钥保存为环境变量,但我不知道如何访问它... 我使用npm安装了dotenv,在根目录下创建了文件,并将密钥放在那里。我尝试在js文件中通过使用process.env.API_KEY来访问它,但它显示该变量未定义。

我尝试在我需要密钥的文件顶部放置require('dotenv').config(),但它给我一个错误...

ERROR in ./node_modules/dotenv/lib/main.js 2:13-28
Module not found: Error: Can't resolve 'path' in ...

我觉得我可能要么将它放在了错误的文件中,要么是我漏掉了某些东西

P粉268284930
P粉268284930

全部回复(1)
P粉014293738

作为总结:

要在您的React层中读取API_KEY变量,您需要在构建之前导出变量REACT_APP_API_KEY,然后在任何React部分中,您可以通过以下方式获取值:

process.env.REACT_APP_API_KEY

查看链接以了解为什么需要前缀REACT_APP_

此外,如果您的令牌是长期有效或不可过期的令牌,则不应将其暴露给前端(React)。只有可过期的令牌(授权码oauth2授权)应该暴露给前端层。

查看参考资料以了解如何处理前端变量

参考资料

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板