Reactjs 使用Firebase远程配置而不是.env文件

Reactjs 使用Firebase远程配置而不是.env文件,reactjs,firebase,environment-variables,Reactjs,Firebase,Environment Variables,我正在构建一个带有firebase集成的react应用程序,我们使用的环境变量可以通过在部署的网站中获取页面的页面源来检查 我很想知道一些让它更安全的方法。我能想到的唯一方法是从API中获取值,这样它就不会在任何时候与代码一起显示 要连接到firebase,我可以使用。允许您存储键值对。我想把我所有的环境变量都移出,以删除配置设置并从那里使用它。因此,我可以完全删除.env文件,避免暴露任何硬编码的值 有人试过这个吗?建议用什么方法使.env值更安全?绝对不要加载任何不希望用户能够访问到浏览器的

我正在构建一个带有firebase集成的react应用程序,我们使用的环境变量可以通过在部署的网站中获取页面的页面源来检查

我很想知道一些让它更安全的方法。我能想到的唯一方法是从API中获取值,这样它就不会在任何时候与代码一起显示

要连接到firebase,我可以使用。允许您存储键值对。我想把我所有的环境变量都移出,以删除配置设置并从那里使用它。因此,我可以完全删除.env文件,避免暴露任何硬编码的值


有人试过这个吗?建议用什么方法使.env值更安全?

绝对不要加载任何不希望用户能够访问到浏览器的值,句号。浏览器是一本打开的书,虽然您可以通过更改值的加载位置和方式来隐藏这些值,但您无法阻止有动机的攻击者阅读您在客户端上所做的任何事情

这就是为什么Firebase的API密钥和配置可以安全地公开可读的原因——当您编写安全规则时,您实际上是在围绕客户机的功能划分界限


Firebase Remote Config可以而且应该用于客户端可以安全使用的值,比如API的功能标志或特定于环境的URL。它不应该用于敏感的东西,如私有API密钥和机密。

谢谢您的建议。我们将如何处理你应用程序中的密钥。为了安全,我们将把它保存在哪里?在firebase中创建一个集合并将其存储在那里意味着每个登录者都需要访问该集合。那么实时数据库呢?因为它将取决于很多事情——什么是秘密密钥?他们提供了什么访问权限?谁需要利用它们以及何时利用它们?您应该设计您的安全模型,以便任何不应该看到某个值的人都不会在其客户机中看到该值。这可以通过许多不同的方式实现。这些是连接到辅助firestore db的配置值。具有足够权限的用户可以访问。访问由规则控制。但是连接的配置现在保留在我的.env文件中。通常我让后端处理所有敏感的API调用。例如,如果我想使用API密钥连接到一些安全服务,我会让后端进行调用,然后将响应返回给前端。由于您没有后端,因此可以设置。这意味着即使他们通过调试获得了您的firebase API密钥,他们也无法做很多事情