如果在React中，将我的API密钥存储在环境变量中是不安全的，我如何检索该密钥，以便在AWS API网关上访问我的端点

Question

我在AWS API网关上的端点要求在头中传递此密钥，以便客户端成功地我的后端端点。

这是我的axios.js文件，它为GET/POST/PUT/DELETE 设置axios实例

import axios from 'axios'  
require('dotenv').config()
const API_URL = process.env.REACT_APP_AWS_APIGATEWAY_BASE_URL
const API_KEY = process.env.REACT_APP_AWS_APIGATEWAY_API_KEY

const AxiosInstance = axios.create({
baseURL: API_URL,  
headers : {
Accept: 'application/json',
'Content-Type': 'application/json',
'Authorization' : API_KEY,
'X-API-KEY': API_KEY
}
});
const getAPI = (apiUrl,params) => AxiosInstance.get(apiUrl,params);
const postAPI = (apiUrl, data,params) => AxiosInstance.post(apiUrl, data,params);
const putAPI = (apiUrl, data,params) => AxiosInstance.put(apiUrl, data,params);
const deleteAPI = (apiUrl,data,params) => AxiosInstance.delete(apiUrl,data,params);
export { 
postAPI,
getAPI,
putAPI,
deleteAPI,
API_URL
};
export default AxiosInstance;

Answer 1

您的应用程序有用户吗？

如果是这样，您应该实现某种身份验证/授权逻辑。

如果没有，并且你允许开放互联网上的每个人自由调用这些api方法，我想你可以考虑构建一个微服务，根据请求返回API_KEY，并将其存储在客户端的存储中(浏览器上的localStorage等(。该微服务可以通过AWS Lambda函数/Firebase云函数实现，它们运行起来非常便宜，并且显然可以使用它们自己的环境变量来从中检索CCD_ 4。