Javascript：跨域 JSON 请求问题

Question

我正在尝试从 Google Places API 请求 JSON，但在首先包含以下内容后我仍然收到跨域请求错误：

<?php 
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Methods: POST, GET");
header("Access-Control-Allow-Headers: x-requested-with");
?>

我使用的 JSON 请求是标准的 JQuery：

function load() {
    var url = 'https://maps.googleapis.com/maps/api/place/details/json?reference=CnRhAAAARMUGgu2CeASdhvnbS40Y5y5wwMIqXKfL-n90TSsPvtkdYinuMQfA2gZTjFGuQ85AMx8HTV7axABS7XQgFKyzudGd7JgAeY0iFAUsG5Up64R5LviFkKMMAc2yhrZ1lTh9GqcYCOhfk2b7k8RPGAaPxBIQDRhqoKjsWjPJhSb_6u2tIxoUsGJsEjYhdRiKIo6eow2CQFw5W58&sensor=true&key=xxxxxxxxxxxxxx';
    $.ajax(url, {
       async:   true,
       success: function(data, textStatus, jqXHR) {
           dump(data);
       }
    });
}

我会改用 JSONP 查询，但 Google Places API 不支持 JSONP...我该如何解决这个问题？使用代理服务器？我不知道该怎么做或我做错了什么。

Answer 1

您从请求数据的 URL 必须授予带有访问控制标头的权限。它会击败同源策略的对象是远程源可以授予自己权限！

如果您使用的 API 没有提供 JSON-P API，并且本身没有设置访问控制标头，那么您需要使用代理。要么是您自己运行的，要么是将转换为 JSON-P 的第三方（例如 YQL）。