web-dev-qa-db-ja.com

PhoneGapとjQueryを使用したクロスドメインリクエストが機能しない

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

クロスドメインリクエストの実行と関係があることはわかっていますが、問題の解決方法がわかりません。私はそれを修正するためにいくつかのことを試みましたが、結果はありませんでした:

この問題は同じOriginポリシーにも関係していますが、これはPhoneGapがローカルhtmlファイルのロードに使用しているfile://プロトコルには当てはまりません。

私のAndroidManifest.xmlファイルで、オプション

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

設定されています。

これを2日間修正しようとしていますが、今のところ結果はありません。これは可能ですか?次に進むことができるように、私に何かアドバイスはありますか?

前もって感謝します!

19
weerd2

私は自分で問題を解決しました。問題は、ドメインを追加する必要があるURLにあります。私が変更され

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

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

そしてそれはうまくいきます!

最初のURLはiphoneアプリでまったく同じURLと設定で機能するため、機能するはずです。また、Windowsファイアウォールをシャットダウンする二重ファイアウォール(WindowsおよびESETファイアウォール)と関係があります。

とにかく、あなたの答えをありがとう!

8
weerd2

外部ドメインをホワイトリストに登録する必要があります。 xcodeのphonegap/cordova plistファイルに移動して新しいエントリを追加し、その値を*にしてください。そこから任意のWebサイトにアクセスできます。

これはブラウザでは機能しないことも知っています。ブラウザにはクロスドメインの問題があり、電話ギャップやモバイルデバイスではありません。

10
Drew Dahlman

これをconfig.xmlに追加すると私が救われました

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

外部のリソースが、Googleマップやリモートデバッグツールでさえ読み込まれなかった理由に困惑しました。これは私を救った!

3
Gokigooooks

JQuery設定:$。support.cors = true;

1
kingnight

設定してみてくださいdataType:jsonpおよびセットcrossDomain:trueクロスドメインのajaxリクエストの場合、jsonpを使用できます。 http://api.jquery.com/jQuery.ajax/

または、callback =?を追加できます。あなたのURLに。

0
Selvaraj M A