1

Webサービス要求に反応する単純なJavaアプリケーションがあります。

ユーザーがボタンを押すと、メッセージがJavaアプリケーションに送信されます。

メッセージが「ping」の場合、アプリケーションは「pong」で応答します。それ以外の場合は、「不明なメッセージ」です。

Javaアプリケーションのコード:

@Path("/ping-pong")
public class PingPongService {

    @POST
    @Produces("text/plain")
    public String test(@FormParam("message") final String aMessage) {
        System.out.println("message from client: " + aMessage);
        if ("ping".equalsIgnoreCase(aMessage)) {
            System.out.println("ping.equalsIgnoreCase(aMessage)");
            return "pong";
        } else {
            System.out.println("Unknown message");
            return "unknown message " + aMessage;
        }
    }

}

WARファイル内には、次のHTMLコードがあります。これは機能します(ボタンの1つを押すと、Javaアプリケーションから応答が返され、メッセージボックスに表示されます)。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>JavaScript Ping-Pong Client</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript">

        //This function send post request to the server using jQuery
        function testWithJQuery(message){
            $.post('http://localhost:8345/rest/ping-pong', { message: message }, function(data) {
                alert(data);
            });
        }

        //This function send post request to the server using a low-level XmlHttpRequest instead of the jQuery
        //(no dependencies on external libraries)
        function test(message){
            var http = new XMLHttpRequest();
            var url = "http://localhost:8345/rest/ping-pong";
            var params = "message=" + message;
            http.open("POST", url, true);
            http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            http.setRequestHeader("Content-length", params.length);
            http.setRequestHeader("Connection", "close");
            http.onreadystatechange = function() {
                if(http.readyState == 4 && http.status == 200) {
                    alert(http.responseText);
                }
            };
            http.send(params);
        }
    </script>
</head>
<body>
    <button onclick="test('ping')">Test</button>
    <button onclick="testWithJQuery('ping')">Test using jQuery</button>
</body>
</html>

Djangoアプリケーションでもまったく同じことをしたいと思います(ユーザーがボタンを押すと、メッセージがJavaアプリケーションに送信され、その応答がアラートメッセージウィンドウに表示されます)。

Djangoは次のHTMLコードを生成します:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
<head>
    <title></title>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
    //This function send post request to the server using jQuery
    function testWithJQuery(message){
        $.post('http://localhost:8345/rest/ping-pong', { message: message }, function(data) {
            alert(data);
        });
    }

    //This function send post request to the server using a low-level XmlHttpRequest instead of the jQuery
    //(no dependencies on external libraries)
    function test(message){
        var http = new XMLHttpRequest();
        var url = "http://localhost:8345/rest/ping-pong";
        var params = "message=" + message;
        http.open("POST", url, true);
        http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        http.setRequestHeader("Content-length", params.length);
        http.setRequestHeader("Connection", "close");
        http.onreadystatechange = function() {
            if(http.readyState == 4 && http.status == 200) {
                alert(http.responseText);
            }
        };
        http.send(params);
    }
</script>


</head>
<body>
<button onclick="test('ping')">Test</button>
</body>
</html>

Djangoで生成されたコードで[テスト]ボタンを押すと、Javaアプリケーションはメッセージを受信します(これはコンソール出力に表示されます)が、HTMLコードを使用してもJavaアプリケーションの応答がDjangoWebサイトに表示されませんWARファイルのものと同じです。

これを修正するにはどうすればよいですか?つまり、Javaアプリケーションの応答がDjangoに表示されていることを確認してください。

UPD:Chromeの[ネットワーク]ペインに表示されるエラーの詳細は次のとおりです。

ここに画像の説明を入力してください

4

1 に答える 1

1

これは正解ではなく、問題の診断に役立つヒントです。コメントするには大きすぎるので、ここに投稿します。

  1. Chromeデバッガー(shif+ ctrl+ i)またはFirefox Firebugを開き、[ネットワーク]タブをアクティブにします。
  2. 両方のバージョンで作成された投稿を検査し、ヘッダーと本文を比較します

明確な動作がある場合は、両方の投稿の間にいくつかの違いがあるはずです。

[アップデート]

エラーが見つかりました-質問のスクリーンショットを参照してください。エラーは「XMLHttpRequestはlocalhost:8345 / rest / ping-pongをロードできません。オリジンlocalhost:8000はAccess-Control-Allow-Originで許可されていません。」です。

このエラーは、ブラウザのセキュリティ上の制約が原因です(同一生成元ポリシー)。いくつかの回避策があります(出典:ウィキペディア):

開発者が制御された方法で同一生成元ポリシーを回避できるようにするために、フラグメント識別子やwindow.nameプロパティの使用など、さまざまな「ハッキング」を使用して、異なるドメインに存在するドキュメント間でデータを渡します。HTML5標準では、このためのメソッドが形式化されました。postMessageインターフェースは、最近のブラウザーでのみ使用可能です。JSONPとクロスオリジンリソースシェアリングを使用して、他のドメインへのajaxのような呼び出しを有効にすることもできます。2 easyXDMを使用して、同一生成元ポリシーによって設定された制限を簡単に回避することもできます。これは、軽量で使いやすく、自己完結型のJavascriptライブラリであり、開発者がドメインの境界を越えてjavascriptAPIを簡単に通信および公開できるようにします。

私はサブドメインハックを成功裏に使用しました。この回答を参照してください。

于 2012-07-26T15:26:55.487 に答える