javascript - 如何在javascript中从数组中获取json格式的数据

Question

我遇到了一个问题。当我使用 http://headers.jsontest.com/时，我会得到值(value)。这是我的代码

<div id="ip"></div>


<script type="text/javascript">
    var getJSON = function(url) {
        return new Promise(function(resolve, reject) {
            var xhr = new XMLHttpRequest();
            xhr.open('get', url, true);
            xhr.responseType = 'json';
            xhr.onload = function() {
                var status = xhr.status;
                if (status == 200) {
                    resolve(xhr.response);
                } 
                else {
                    reject(status);
                }
            };
            xhr.send();
        });
    };

    getJSON('http://headers.jsontest.com/').then(function(data) {        

        for(x in data){
           ip.innerText = data.Host;    
        }

    },  function(status) {
            alert('Something went wrong.');
    });

</script>

但是当我使用此链接时，我没有得到任何值 My Link 。为什么它不起作用

getJSON('http://67.225.137.209/index.php/queue_manage_api/queue/doc_id/3536/loc_id/4696/username/9791a47fef07649b1c3e70749e898153/password/2d593e25d0560b19fd84704f0bd24049/format/json').then(function(data) {        

    for(x in data){
       ip.innerText = data.id;    
    }

    },  function(status) {
        alert('Something went wrong.');
});

如果默认数据格式 {data} 那么我会得到默认值但是当数据格式像 [{data}] 时我也不会得到任何值。我的数据格式像 [{data}] 这样。那么如何获取我的数据

Answer 1

浏览器安全性正在启动。您需要通过将此 header 添加到您的回复中来启用 CORS:

Access-Control-Allow-Origin:*

如果您查看“网络”选项卡 (F12)，您将看到 http://headers.jsontest.com/ 已经在执行此操作。

在这里您可以阅读有关 CORS 的更多信息:https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

如果服务器不是您的，并且您无法添加 CORS，那么他们将有理由不这样做(称为安全性，因为有一个原因 xD)。也许他们没有注意到，您可以要求他们启用它。

专业提示:检查前端代码时，请始终在开发人员工具 (F12) 打开(控制台选项卡)的情况下进行。