javascript - 如何解决 Google API 中的 CORS 问题？

Question

我正在开发一个应用程序，在该应用程序中，我必须使用 Google 的海拔 API 获取某些点的海拔高度，但我陷入了臭名昭著的 CORS 问题。

var elevationUrl = 'https://maps.googleapis.com/maps/api/elevation/json?locations=39.7391536,-104.9847034&key=AIzaSyAgXFgUVR4Nia7pegX_0hcz0aNevCKAa58';

$.ajax({
    url: elevationUrl,
    type: 'GET',
    // dataType: 'JSONP',
    success: function(){
    }
});

对于初学者，我只是尝试查询一个不动点。执行此操作时，我会在浏览器的控制台中收到 CORS 警报。

当我尝试 dataType: 'JSONP' 时，它起作用了，我从 API 得到了响应，但我的浏览器提示响应中有错误，而实际上没有。基本上，我试图将 JSON 解析为 JSONP，这就是我在响应中收到语法错误的原因。

解决这个问题的方法是什么？如何通过 AJAX 调用查询 Elevation API？

Answer 1

如果您的网站有后端 api，您可以创建简单的端点以传递到 google api 并在服务器上执行 google 结果，其中 CORS header 无关紧要。还让您受益于拥有更好的缓存系统。