Ajax (jQuery) 跨域输出 -答案

【问题标题】：Ajax (jQuery) cross domain output -Ajax (jQuery) 跨域输出 -
【发布时间】：2011-07-10 19:59:35
【问题描述】：

因为这样的功能不支持跨域请求

    function makeRequest(url) {

    var http_request = false;

    if (window.XMLHttpRequest) { // Mozilla, Safari,...
        http_request = new XMLHttpRequest();
        if (http_request.overrideMimeType) {
                http_request.overrideMimeType('text/xml');
        }
    } else if (window.ActiveXObject) { // IE
        try {
            http_request = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
            http_request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
        }
    }

    if (!http_request) {
        alert('Cannot create an XMLHTTP instance');
        return false;
    }

    http_request.onreadystatechange = function() { alertContents(http_request); };
    http_request.open('GET', url, true);
    http_request.send(null);
}

function alertContents(http_request) {
    if (http_request.readyState == 4) {
        if (http_request.status == 200) {
            receiveData(http_request.responseText);
        } else {
            alert("error");
        }         
    } 
}

所以决定使用jQuery（带有this plugin）但是函数

    $.ajax({
  url: suchurl,
  type: "GET",
  //dataType: "text",
  dataType: "text",
  //global: false,
  //async:false,
  cache: false,
  success: function(data) {

//alert(data);
alert(data.responseText);

}
});

输出喜欢

<html>
<head>
<meta content="HTML Tidy for Java (vers. 26 Sep 2004), see www.w3.org" name="generator"/>
<title/>
</head>
<body>
<p>new_towns = [ {id:"0", name:" "},
{id:"205",
name:"City205"},
{id:"17",
name:"City17"}
];</p>
</body>
</html>

为什么？.. 只是期待

new_towns = [ {id:"0", name:" "}, {id:"205", name:"City205"}, {id:"17", name:"City17"} ];

你有什么建议？提前感谢您。

这样的示例代码 - 不起作用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="http://www.google.com/jsapi"></script>  
<script type="text/javascript">  
    google.load("jquery", "1.6.2");  

google.setOnLoadCallback(function() {

$.ajax({
  url: suchurl,
  type: "GET",
  dataType: "text",
  crossDomain:true,
  async:true,
  cache: false,
  success: function(data) {
  alert("all right");
  }
  });

});
</script>
</head>

<body>
</body>
</html>

好的，伙计们，它更简单，更快速和易于理解的决策使用脚本获取.php

<?php

if(isset($_POST['geturl']) and !empty($_POST['geturl'])) {
$data = file_get_contents($_POST['geturl']);
print $data;
}

?>

然后只是

$.ajax({ url: 'get.php',
         data: {geturl: suchurl},
         type: 'POST',
         dataType: "text",
         cache: false,
        success: function(data){
        alert(data);
        //do something else

   }
 });

TNX 非常感谢您的帮助和提示！

【问题讨论】：

如果您期待 json 数据，请执行 dataType: 'json'

标签： ajax jquery cross-domain

【解决方案1】：

我猜你不需要依赖插件来获取跨域 JSON。您可以使用 jquery 的 'jsonp' 数据类型。

您可以关注以下 URL 中的“JSONP”部分： http://api.jquery.com/jQuery.getJSON/

你得到的输出可能是 URL 返回的东西。确保请求的 URL 仅返回预期的输出。谢谢

【讨论】：

tnx，顺便说一句，我会尝试 - 如果通过 url 在浏览器中获取结果并查看代码 - 没有像 ".... HTML Tidy for Java ...." 这样的东西，只有正确“new_towns = [ ...”

【解决方案2】：

看起来在您的第一个示例中，您正在请求 text/xml，但在第二个示例中，您的类型只是“文本”，这可能会导致 url 发送回不同格式的响应。对于 JSON 数据，您还可以尝试“application/json”类型。

【讨论】：

如果将 $.ajax 与 dataType - json 或 jsonp 一起使用 - 没有任何反应（（
听起来像是服务器问题，如果它没有响应对那些有效数据类型的请求...尝试其他一些浏览器，有些浏览器比其他浏览器更好地处理 ajax，如果有些工作，那将消除服务器是问题。
如果除了 HTML 版本之外什么都没有，您实际上可以在成功函数中解析该 HTML 并提取您想要的部分。像这样的东西： $(data).find("p:first").text();

【解决方案3】：

JQuery $.ajax() 函数包括原生 JSONP 支持。必须添加参数crossDomain:true

你可以在这里阅读：http://api.jquery.com/jQuery.ajax/

【讨论】：

为什么要设置 async:false？你的网址字符串后面还有一个分号。
对不起，看不懂代码，即使是 async:false - 没什么，抱歉在问题正文中添加代码，谢谢您的关注
否 :( 真的需要吗？示例代码中需要改变什么（有问题） - 才能正常工作？