Question

我需要从其他网站获取数据。该网站返回json。我试过这个：

function get_data() {
    $.getJSON("https://kde.link/test/get_field_size.php",
        function(data){
            var get_width = data.width;
            var get_height = data.height;
            /* some code here */
    });
};

但这不起作用。而且，我遇到了这个错误：XMLHttpRequest无法加载https://kde.link/test/get_field_size.php。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此不允许原点'localhost：8080'访问。如何从其他网站获取数据？

Answer 1

由于浏览器中内置了same origin policy restriction，您无法进行跨域AJAX请求。如果您需要这样做，则需要访问服务器端脚本（get_field_size.php）并启用CORS或JSONP。

使用CORS，服务器必须支持OPTIONS HTTP谓词并发送一个特殊的Access-Control-Allow-Origin，其中明确列出了可以调用它的域。

如果您无法控制此远程脚本，则必须在域上编写服务器端脚本，该脚本将充当本地和远程域之间的桥梁。然后，您将向本地脚本发出AJAX请求：

$.getJSON("/get_field_size_bridge.php",
    function(data){
        var get_width = data.width;
        var get_height = data.height;
        /* some code here */
});

然后这座桥将充当代理人。

Answer 2

这通常发生在我们从我们自己的另一个网站请求某些内容时。请将它添加到php文件的顶部以处理请求。

 header('Access-Control-Allow-Origin: *');

希望有所帮助，祝你好运。

Answer 3

试试这个更新的代码

    <!DOCTYPE html>
    <html>
        <head>
            <title>JQUERY AJAX POST JSON CAPTURE NAME:VALUE Pair</title>
        <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
        </head>
        <body>
            <div id="content"></div>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js" /></script>
            <script type="text/javascript">
                $.ajax({
            url: 'https://kde.link/test/get_field_size.php',
            dataType: "json",
            data: { },
            success: function(response) {
              alert(response.width);
              alert(response.height);
            }
          });
            </script>
        </body>
    </html>

javascript从另一个网站获取json

3 个答案: