jQuery跨域AJAX

这里有两个页面，test.php和testserver.php。

test.php

<script src="scripts/jq.js" type="text/javascript"></script>
<script>
    $(function() {
        $.ajax({url:"testserver.php",
            success:function() {
                alert("Success");
            },
            error:function() {
                alert("Error");
            },
            dataType:"json",
            type:"get"
        }
    )})
</script>

testserver.php

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

现在我的问题是:当这两个文件都在同一服务器(本地主机或web服务器)，它的工作和警报(“成功”)被调用;如果它在不同的服务器上，即web服务器上的testserver.php和localhost上的test.php，则它不工作，并且alert(“错误”)正在执行。即使AJAX内部的URL更改为http://domain.example/path/to/file/testserver.php

当前回答

对于微软Azure来说，情况略有不同。

Azure有一个需要设置的特殊CORS设置。这在幕后本质上是相同的事情，但简单地设置joshua提到的头文件将不起作用。Azure支持跨域的文档可以在这里找到:

https://learn.microsoft.com/en-us/azure/app-service-api/app-service-api-cors-consume-javascript

我摆弄了几个小时，才意识到我的主机平台有这个特殊的设置。

2017-07-24 15:02:53

其他回答

你可以通过添加Access-Control-Allow-Origin来控制HTTP头。将其设置为*将接受来自任何域的跨域AJAX请求。

使用PHP真的很简单，只需在脚本中添加以下一行，你想要从你的域访问外部:

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

不要忘记在httpd.conf中启用mod_headers模块。

2014-11-29 10:43:53

我不得不从本地磁盘加载网页“file:///C:/test/htmlpage.html”，调用“http://localhost/getxml.php”url，并在IE8+和Firefox12+浏览器中做到这一点，使用jQuery v1.7.2 lib来最小化样板代码。在阅读了几十篇文章之后，我终于明白了。以下是我的总结。

服务器脚本(.php， .jsp，…)必须返回http响应头Access-Control-Allow-Origin: * 在使用jQuery ajax之前，在javascript中设置这个标志:jQuery.support.cors = true; 你可以设置标志一次或每次使用jQuery ajax函数现在我可以在IE和Firefox中阅读。xml文档。其他浏览器我没有测试。响应文档可以是纯/文本，xml, json或其他任何东西

下面是一个jQuery ajax调用的例子，其中包含一些调试系统。

jQuery.support.cors = true;
$.ajax({
    url: "http://localhost/getxml.php",
    data: { "id":"doc1", "rows":"100" },
    type: "GET",
    timeout: 30000,
    dataType: "text", // "xml", "json"
    success: function(data) {
        // show text reply as-is (debug)
        alert(data);

        // show xml field values (debug)
        //alert( $(data).find("title").text() );

        // loop JSON array (debug)
        //var str="";
        //$.each(data.items, function(i,item) {
        //  str += item.title + "\n";
        //});
        //alert(str);
    },
    error: function(jqXHR, textStatus, ex) {
        alert(textStatus + "," + ex + "," + jqXHR.responseText);
    }
});

2012-05-16 12:34:37

Jquery文档(链接):

由于浏览器的安全限制，大多数“Ajax”请求都遵循同源策略;请求无法成功地从不同的域、子域或协议检索数据。脚本和JSONP请求不受同源策略限制。

因此，我认为您需要使用jsonp来处理请求。但我自己还没试过。

2010-08-17 19:43:33

对于微软Azure来说，情况略有不同。

Azure有一个需要设置的特殊CORS设置。这在幕后本质上是相同的事情，但简单地设置joshua提到的头文件将不起作用。Azure支持跨域的文档可以在这里找到:

https://learn.microsoft.com/en-us/azure/app-service-api/app-service-api-cors-consume-javascript

我摆弄了几个小时，才意识到我的主机平台有这个特殊的设置。

2017-07-24 15:02:53

JSONP是一个不错的选择，但是还有一种更简单的方法。您可以简单地在服务器上设置Access-Control-Allow-Origin标头。将其设置为*将接受来自任何域的跨域AJAX请求。(https://developer.mozilla.org/en/http_access_control)

当然，这样做的方法因语言而异。下面是Rails版本:

class HelloController < ApplicationController
  def say_hello
    headers['Access-Control-Allow-Origin'] = "*"
    render text: "hello!"
  end
end

在本例中，say_hello动作将接受来自任何域的AJAX请求，并返回“hello!”响应。

下面是它可能返回的头的一个例子:

HTTP/1.1 200 OK 
Access-Control-Allow-Origin: *
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Content-Type: text/html; charset=utf-8
X-Ua-Compatible: IE=Edge
Etag: "c4ca4238a0b923820dcc509a6f75849b"
X-Runtime: 0.913606
Content-Length: 6
Server: WEBrick/1.3.1 (Ruby/1.9.2/2011-07-09)
Date: Thu, 01 Mar 2012 20:44:28 GMT
Connection: Keep-Alive

尽管它很简单，但它确实有一些浏览器限制。看到http://caniuse.com/壮举=歌珥。

2012-03-01 20:51:37

jQuery跨域AJAX

推荐文章

最新文章

标签