如何创建一个后端来隐藏 Reactjs 应用程序中的 API 密钥？答案

【问题标题】：How to create a backend to hide API keys in Reactjs app?如何创建一个后端来隐藏 Reactjs 应用程序中的 API 密钥？
【发布时间】：2019-07-23 16:10:31
【问题描述】：

我目前正在使用 Reactjs 开发一个应用程序。我在 dotenv 文件中隐藏了我的 API 密钥和 AWS 密钥。但我刚刚意识到这绝对不安全。我当前的设置是我的应用程序在 AWS 上的 S3 存储桶中运行，我想知道是否可以使用我的 EC2 实例向用户隐藏我的密钥，但仍然能够在应用程序中获取它们。

这是我第一次在 Reactjs 中开发应用程序，我真的不知道从哪里开始。

【问题讨论】：

使用后端作为代理访问远程api。然后密钥留在服务器上，远离窥探
感谢您的回复。我将尝试找出如何做到这一点...您知道有关该主题的任何示例/教程/文档吗？
应该很容易研究..“ajax代理”或添加“javascript”。概念很简单......您的客户端应用程序从您自己的端点发出请求，然后使用密钥发出服务器到服务器的请求并将响应返回给客户端应用程序
好的，非常感谢！不过，这是我第一次在这里提出问题，我还应该做些什么来关闭线程，并感谢您（比如投票/积分？）或其他什么？
没有。总体问题通常过于宽泛，无法发布实际答案，因此对其他人未来没有太多长期价值

标签： javascript reactjs amazon-web-services amazon-s3 amazon-ec2

【解决方案1】：

看看 AWS Amplify，它让这个过程变得超级简单。

使用 React 和 AWS Amplify，您可以为这种类型的设置创建一个无服务器架构，并且只需最少的工作量。您可以按照https://aws-amplify.github.io/docs/的说明开始使用

简而言之：

安装方式：

npm install -g @aws-amplify/cli
$ amplify configure

然后在你的项目中：

amplify init 
amplify add api #this will create your API as AWS Lambda functions exposed through Amazon API Gateway)
amplify push #to create all this on your AWS account for you

如果您搜索“aws amplify react”，您会很容易找到十几篇博文，向您展示如何开始。实在太多了，不推荐一个。

【讨论】：

好的，非常感谢，我会调查的。这似乎是一种“更简单”的方式。