JSONP如何解决jQuery的跨域AJAX问题？

jQuery AJAX 跨域困境：使用 JSONP 绕过 CORS

由于跨域资源共享，跨域数据交互带来了挑战(CORS) 限制。当尝试从一个域到另一个域（例如本地主机上的 test.php 和远程服务器上的 testserver.php）执行 AJAX 请求时，浏览器会强制执行这些限制，从而导致“错误”警报。

要克服此问题障碍，JSONP（带填充的 JSON）作为一种可行的解决方法出现。它利用脚本元素的灵活性来跨域检索数据。

jQuery 修改：
修改 test.php，通过将 dataType 参数更改为“jsonp”来利用 JSONP。

PHP 修改：
调整 testserver.php 以回显 JSONP使用 jQuery 提供的回调进行响应。

实现：

jQuery (test.php):

$.ajax({
    url: "testserver.php",
    dataType: 'jsonp', // Notice! JSONP <-- P (lowercase)
    success: function(json){
        // do stuff with json (in this case an array)
        alert("Success");
    },
    error: function(){
        alert("Error");
    }       
});

PHP (testserver.php):

<?php
$arr = array("element1", "element2", array("element31", "element32"));
$arr['name'] = "response";
echo $_GET['callback'] . "(" . json_encode($arr) . ");";
?>

使用 $.getJSON() 的简化方法:
或者，使用 $.getJSON() 简写方法，该方法会自动附加“回调=？”将 URL 作为 GET 参数。

$.getJSON("testserver.php", function(json){
    // do stuff with json (in this case an array)
    alert("Success");
});

以上是JSONP如何解决jQuery的跨域AJAX问题？的详细内容。更多信息请关注PHP中文网其他相关文章！