1

次のhtmlコードがあります：

<!DOCTYPE html> 
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <meta name="viewport" content="width=device-width, initial-scale=1"> 
        <script src="js/jq.js"></script>
        <script src="js/jqm.js"></script>
        <script src="js/jstore.js"></script>
        <script src="js/progressbar.js"></script>
        <script src="js/sql.js"></script>
        <script src="js/phonegap-1.4.1.js"></script>
        <script src="js/sha512.js"></script>
    </head>
    <body>
        <!-- Start of first page: #one -->
        <div data-role="page">
            <!-- header -->
            <div data-role="header">
                <table width="100%" border="0" cellpadding="0" cellspacing="0">
                    <tr>
                        <td>

                        </td>
                        <td>
                        </td>
                    </tr>
                </table>
            </div>
            <!-- /header -->
            <div data-role="content" data-theme="a">
                <center>
                    <span class="progressBar" id="pb1"></span>
                    <br />
                    Initial Syncronisation in progress!
                </center>
            </div>  
            <!-- footer -->
            <div data-role="footer">

            </div>
            <!-- /footer -->
            <script lang="text/javascript">
                document.addEventListener("deviceready", onDeviceReady, false);
                function onDeviceReady() {
                   $("#pb1").progressBar();
                   $("#pb1").progressBar(5);
                   $.ajax({
                        url: 'https://url/user/'+$.jStorage.get("username","false")+'/modeSet/'+$.jStorage.get("password","false")+'/subSequence/'+hex_md5(new Date().getTime())+'.html',
                        dataType:'jsonp',
                        jsonp:'jsonp_callback',
                        jsonpCallback:'infoData',
                         success: function (data) {
                                alert('success');
                       },
                       error:function (xhr, ajaxOptions, thrownError){
                            alert(xhr.status);
                            alert(thrownError);
                        } 
                   });
                }
            </script>
        </div>
    </body>
</html>

このページを呼び出すと、コード 200 のエラーと、次の内容の追加のアラート ボックスが表示されます。

Error: infoData was not called!

Android 4.0.4 を搭載した実際の Samsung Galaxy S2 で実行されています。インターネットに接続していますが、どこが間違っているのかわかりません。

サーバーから返されたドキュメント:

infoData({"validJsonDocument":"yes"});

jQuery 1.7.1およびjQuery mobile up2dateでPhonegap 1.4.1を使用しています

他のライブラリは実際には使用されていません。

4

2 に答える 2

1

JSONP は、JSON with Padding の略です。パディングは、JSON 応答がクライアント側に送り返されるときにラップする関数名を表します。

結果が受信されると、それは実際にはプレーンな JavaScript であるかのように扱われ、そのように処理されます。したがって、JSON をラップした関数が呼び出されます。

これは、JSONP が正しく機能するためには、JSON 応答をラップする関数の名前と一致する関数が DOM にロードされている必要があることを意味します。

また、 「jsonCallback」jQuery AJAX プロパティを使用して、コールバック関数の名前として「infoData」を指定しました。

jsonpCallback    String, Function

JSONP リクエストのコールバック関数名を指定します。この値は、j​​Query によって自動的に生成されるランダムな名前の代わりに使用されます。リクエストの管理とコールバックとエラー処理の提供が容易になるため、jQuery に一意の名前を生成させることをお勧めします。GET 要求のブラウザ キャッシュを有効にしたい場合は、コールバックを指定することをお勧めします。jQuery 1.5 では、この設定に関数を使用することもできます。その場合、jsonpCallback の値はその関数の戻り値に設定されます。

1 つのパラメーターを受け取る「infoData」というページで関数を定義してみてください。これにより、このエラーを回避できます。

function infoData(jsonObj) {
    alert(JSON.stringify(jsonObj));  // print the raw JSON object
    alert(jsonObj.validJsonDocument); // access the property in your JSON object.
}

または、jQuery のドキュメントの提案に従って jsonpCallback オプションを完全に削除し、既に定義した成功のコールバックに依存することもできます。

于 2012-04-09T00:51:04.173 に答える
0

コードを次のように変更しました。

<script lang="text/javascript">
            document.addEventListener("deviceready", onDeviceReady, false);
            function onDeviceReady() {
               $("#pb1").progressBar(5);
               $.ajax({           
                    url: 'http:url/jsonp.html', 
                    dataType: 'jsonp',
                    jsonp: 'callback',
                    jsonpCallback: 'jsonpCallback',
                    success: function (data) {
                            $("#pb1").progressBar(25);
                            alert(data.version);
                    },
                    error:function (xhr, ajaxOptions, thrownError){
                        alert(xhr.status);
                        alert(thrownError);
                    }                       
                }); 

            }
            function jsonpCallback(data){
                alert(data.message);
            }
        </script>

Google Chrome でページを開くと、問題なく動作します。Androidブラウザで開くと、同じことが起こります。エラー 200 が表示され、jsonpCallback が呼び出されなかったと表示されます。なぜスクリプトが私にそんなに苦労を与えるのか、私にはよくわかりません。クリス

于 2012-04-09T10:49:47.237 に答える