使用PhoneGap和jQuery的跨域请求不起作用

时间:2012-04-16 11:42:43

标签: jquery ajax cordova cross-domain

我正在为Android创建一个PhoneGap应用。为了从(远程)服务器获取数据,我使用jQuery的$ .ajax()函数进行REST调用。你必须知道一些事情:

  • 通话类型必须为POST
  • 服务器需要JSON数据(至少是用户名和密码)
  • 服务器发送回JSON数据

代码:

function makeCall(){
    var url = "http://remote/server/rest/call";

    var jsonData ='{"username":"'+$('#username').val()+'","password":"'+$('#password').val()+'"}';

    $.ajax({
            headers: {"Content-Type":"application/json; charset=UTF-8"},
            type: "POST",
            url: url,
            data: jsonData,
            dataType: "json",
            success: succesFunction,
            error: errorFunction
    });
}

但是,这不起作用。当我使用Firebug查看服务器响应时,什么都没有。使用TcpTrace,我可以看到请求的标头。而不是预期的POST方法,有一个OPTIONS方法,添加了一些奇怪的标题。

OPTIONS /remote/server/rest/call HTTP/1.1
Host: localhost:8081
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:11.0) Gecko/20100101 Firefox/11.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: nl,en-us;q=0.7,en;q=0.3
Accept-Encoding: gzip, deflate
Connection: keep-alive
Origin: null
Access-Control-Request-Method: POST
Access-Control-Request-Headers: content-type
Pragma: no-cache
Cache-Control: no-cache

我知道它与跨域请求有关,但我不知道如何解决问题。我尝试了一些方法来解决它,但没有结果:

该问题还与相同的原始策略有关,但这不适用于file://协议PhoneGap用于加载本地html文件。

在我的AndroidManifest.xml文件中,选项

<uses-permission android:name="android.permission.INTERNET" />

已设定。

我正在尝试解决这个问题2天,但到目前为止还没有结果。这甚至可能吗?你有什么提示给我,所以我可以继续前进吗?

提前致谢!

5 个答案:

答案 0 :(得分:10)

您需要将外部域列入白名单。只需转到xcode中的phonegap / cordova plist文件并添加一个新条目,将其值设为*即可访问任何网站。

也知道这不会在浏览器中工作。浏览器存在跨域问题,而不是手机短信或移动设备。

答案 1 :(得分:8)

我自己解决了这个问题。问题位于网址中,我必须在其中添加域名。我改变了

var url = "http://remote/server/rest/call";

var url = "http://remote.mydomain.com/server/rest/call";

它有效!

我认为第一个网址应该可以工作,因为它适用于具有完全相同网址和设置的iphone应用。它还与双防火墙(Windows和ESET防火墙)有关,我关闭了Windows防火墙。

无论如何,谢谢你的回答!

答案 2 :(得分:3)

将此添加到config.xml保存了我

<gap:plugin name="com.indigoway.cordova.whitelist.whitelistplugin" version="1.1.1" />
<access origin="*" />
<allow-navigation href="*" />
<allow-intent href="*" />

令我感到困惑的是,为什么任何外部资源都没有加载,甚至谷歌地图和我的远程调试工具。这救了我!

答案 3 :(得分:1)

JQuery设置:$ .support.cors = true;

答案 4 :(得分:0)

尝试设置dataType:jsonp并设置crossDomain:true 对于跨域ajax请求,您可以使用jsonp。 http://api.jquery.com/jQuery.ajax/

或者你可以追加回调=?到你的网址。