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

Question

我正在为Android创建一个PhoneGap应用程序。为了从（远程）服务器获取数据，我使用 jQuery 的 $.ajax（） 函数进行 REST 调用。您必须了解以下几点：

• 呼叫类型必须为开机自检
• 服务器需要 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

我知道这与执行跨域请求有关，但我不知道如何解决问题。我尝试了一些方法来修复它，但没有结果：

• 使用"jsonp"代替"json"
• 尝试使用跨域资源共享 （CORS）

该问题也与同源策略有关，但这不适用于 PhoneGap 用于加载本地 html 文件的 file://协议。

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

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

已设置。

我现在正在尝试解决此问题 2 天，但到目前为止没有结果。这甚至可能做到吗？你有什么建议给我吗，让我继续前进？

提前感谢！

Answer 1

您需要

将外部域列入白名单。 只需在Xcode中转到PhoneGap/Cordova plist文件并添加一个新条目，使其值为*，您就可以访问那里的任何网站。

还要知道这在浏览器中不起作用。浏览器存在跨域问题，而不是 phonegap 或移动设备。

Answer 2

我自己解决了这个问题。问题出在网址中，我必须在其中添加一个域。我变了

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

自

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

它有效！

我认为第一个网址应该有效，因为它适用于具有完全相同网址和设置的 iPhone 应用程序。它也与我关闭Windows防火墙的双重防火墙（Windows和ESET防火墙）有关。

无论如何，感谢您的回答！

Answer 3

将其

添加到配置中.xml拯救了我

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

我很困惑为什么任何外部资源都没有加载，甚至谷歌地图和我的远程调试工具。这救了我！

Answer 4

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

或者你可以将 callback=？ 附加到你的 url。

Answer 5

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