在Wordpress中隐藏Google Maps API Key from Frontend

Question

我需要为我的前端使用Google Maps JS库密钥，目前我一直在通过wp_enqueue_script函数将API排队，但问题是我的API密钥在脚本标记的页面上可见。

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=places&amp;key={MYKEY}"></script>

我一直在寻找一种解决方案，以解决我如何使用此API密钥，而无需将其实际显示为脚本。是否有某种涉及服务器的方式可以允许在不可见的情况下使用API密钥？

Answer 1

保护 API 密钥的正确方法是通过反向代理。基本上，您在服务器上设置一个端点，该端点只需附加 API 密钥并将请求转发到第三方 API，然后将响应转发回原始调用方。我使用Nginx作为我的反向代理。反向代理的服务器块可能类似于server {    server_name example.com;    add_header Access-Control-Allow-Origin *;    location / {        proxy_pass https://maps.googleapis.com/maps/api/js?libraries=places&key={MYKEY};    }}如果不打算保护反向代理终结点，则可能需要重新考虑执行隐藏密钥的工作。如果任何人都可以不受限制地调用您的终端节点，那么他们也可能拥有您的API密钥;无论哪种方式，他们都可以不受限制地使用您的密钥。