小编Jon*_*ton的帖子

我想首先说我遵循了这里的所有建议如何在create-react-app中隐藏API密钥？但他们都没有工作.我搜索了一个多小时试图找到答案,但没有.以下是我的解释.

1. 我曾经create-react-app支持我的项目
2. 我正在使用谷歌地图,尚未使用任何其他API
3. 我在.env项目的根目录中创建了一个文件
4. 在那个文件中我添加了 REACT_APP_GOOGLE_MAPS_API_KEY = api key
5. 在我Map.js添加的组件文件中const GM_API_KEY = ${process.env.REACT_APP_GOOGLE_MAPS_API_KEY};(刻度标记在我的文件中的这个变量周围,但它们不会显示在这里)
6. 在我的地图网址中,我添加了这样的密钥 "https://maps.googleapis.com/maps/api/js?key=GM_API_KEY&callback=initMap"
7. 此外,在我的Map.js文件的顶部,我添加了一个console.log(GM_API_KEY); 以确保它正常工作.
8. 我导出了我的Map组件,然后将其导入我的 App.js
9. 我重新启动了我的服务器

当页面加载时,我的密钥会在控制台中输出,但我仍然收到Google的错误,说我的API密钥无效.此外,如果我console.log(GM_API_KEY)在页面加载后手动我得到一个引用错误说GM_API_KEY is undefined

如果有人有任何建议或可以提供任何帮助,我将不胜感激!感谢您花时间查看我的问题.