javascript 我正在使用breezometer API和传单和openstreetmap来显示世界的热图,但api需要密钥,我不想向最终用户显示密钥

mzmfm0qo  于 2023-05-21  发布在  Java
关注(0)|答案(1)|浏览(233)

我在laravel中创建了一个项目,通过使用breezometer heatmap layer API和openstreet map的leaflet来显示一个国家的热图。但是Idk我怎么能隐藏API密钥从最终用户提供的API URL不返回任何响应,但直接在传单的tilelayer功能工作。请告诉我有没有什么方法可以在不暴露密钥的情况下做同样的事情?
下面是在前端运行良好的代码:your text let map = L.map('map ').setView([28.7041,77.1025],13);
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}. png',{ maxZoom:19、归属:"}).addTo(map);
L.tileLayer(https://tiles.breezometer.com/v1/air-quality/breezometer-aqi/current-conditions/{z}/{x}/{y}.png?key=${API_KEY},{ tms:false,不透明度:0.65,maxNativeZoom:}).addTo(map);
我试着在活页的tilelayer方法中使用route调用函数。
这是我在laravel控制器中创建的函数,但它不起作用。your text
public function getString(){

$path = 'https://tiles.breezometer.com/v1/air-quality/breezometer-aqi/current-conditions/{z}/{x}/{y}.png?key=685ce23260d0444c90871220f3a8cae6';
    
    $file = Http::withHeaders(['Content-Type' => 'image/png'])->get($path);

    echo $file;
}
eufgjt7s

eufgjt7s1#

我不知道Laravel,所以这将是一个一般的想法:
假设你有一个PHP服务器。
您需要创建一个“代理”控制器。这个控制器将在服务器端转发添加密钥到url的请求。在此之后,URL将变成如下内容:

L.tileLayer("https://my_laravel_host.com/proxy.php?r=https://tiles.breezometer.com/v1/air-quality/breezometer-aqi/current-conditions/{z}/{x}/{y}.png")

这个代理控制器/类将读取$_GET参数并请求.png本身,添加密钥。获取图像后,只需将其返回给用户。
看看这段老的代理代码就明白我的意思了:https://github.com/Esri/resource-proxy/tree/master/PHP
你甚至不需要包括完整的breezometer网址。您可以让控制器来执行此操作。类似于:

L.tileLayer("https://my_laravel_host.com/proxy.php?tile=breezometer&style=current-conditions/{z}/{x}/{y}.png")

下一步将是只允许您的应用/站点的用户访问此URL。
这种方法的缺点是每次需要加载瓷砖时请求服务器的开销/成本。

相关问题