2016-03-21 59 views
0
public static WebSocket<JsonNode> chat(final String chatname, final String username) { 
    Logger.info("Received request for WebSocket"); 
    return new WebSocket<JsonNode>() { 
     public void onReady(WebSocket.In<JsonNode> in, final WebSocket.Out<JsonNode> out){ 
      ...... 
      //My Code never reaches here 
     } 
} 

ログエントリ「Websocketの受信リクエスト」が表示され、それからonReadyにアクセスすることはありません。Websocket接続ハンドシェイクがタイムアウトしました

プレイバージョン2.3.10およびScalaバージョン2.11.6。まっすぐ進む

var WS = window['MozWebSocket'] ? MozWebSocket : WebSocket 
var chatSocket = new WS("@routes.Application.chat(chatname, username).webSocketURL(request)") 

に見える

Javascriptコードは、誰かが正しい方向に私を指すもらえますか?いくつかのバージョンの不一致の問題があり、例外やJVMが早期に終了し、すべてをクリアすることができましたが、これは何の手がかりも与えません。ジャワ -

クロームコンソールにはエラーが

Scalaの後

編集:: Javascriptが

$(function() { 

$("#onChat").show() 

var WS = window['MozWebSocket'] ? MozWebSocket : WebSocket 
var chatSocket = new WS("ws://localhost:9000/room/chat?chatname=topic&amp;username=test") 

var sendMessage = function() { 
    chatSocket.send(JSON.stringify(
     {text: $("#talk").val()} 
    )) 
    $("#talk").val('') 
} 

var receiveEvent = function(event) { 
    var data = JSON.parse(event.data) 

    // Create the message element 
    var el = $('<div class="message"><span></span><p></p></div>') 
    $("span", el).text(data.user) 
    $("p", el).text(data.message) 
    $(el).addClass(data.kind) 
    $('#messages').append(el) 
} 

var handleReturnKey = function(e) { 
    if(e.charCode == 13 || e.keyCode == 13) { 
     e.preventDefault(); 
     waitForSocketConnection(chatSocket,sendMessage); 
    } 
} 

$("#talk").keypress(handleReturnKey) 

chatSocket.onmessage = waitForSocketConnection(chatSocket,receiveEvent); 

// Make the function wait until the connection is made... 
function waitForSocketConnection(socket, callback) { 
    setTimeout(function() { 
     if (socket.readyState === 1) { 
      console.log("Connection is made") 
      if(callback != null) { 
       callback(); 
      } 
      return; 
     } else { 
      console.log("wait for connection...") 
      waitForSocketConnection(socket, callback); 
     } 

    }, 1000); // wait 5 milisecond for the connection... 
} 

}) 

ルート

GET /        controllers.Application.index() 
GET  /room       controllers.Application.chatRoom(chatname: String ?= null, username: String ?= null) 
GET  /room/chat      controllers.Application.chat(chatname, username) 
GET  /assets/javascripts/chatroom.js controllers.Application.chatRoomJs(chatname, username) 

# Map static resources from the /public folder to the /assets URL path 
GET  /assets/*file     controllers.Assets.at(path="/public", file) 
+0

私は最終的なJavaスクリプトがScalaのテンプレートの後に何があるか、より多くの情報が必要コンパイルされる? ここでは、方向: ここでは、@ routes.Application.chat(chatname、username).webSocketURL()をリクエストパラメータなしで使用しましたが、これは遊び2.2.6用です。 また、https/httpとwss/wsの互換性もチェックしてください。 あなたはApacheまたはnginxの下にいますか?はいの場合は、WSプロトコルを受け入れるように設定する必要があります。 希望します.. :) – nipo

+1

バックエンドを検証するためにこれを試してください:http://www.websocket.org/echo.html – nipo

+0

@nipo - 最終的なJavascriptで私の質問を編集しました –

答えて

0

バックエンド

コントローラーをコンパイルする "ハンドシェイクがタイムアウトになりました" と表示します8

import play.mvc.WebSocket; 

public static WebSocket<String> socket() { 
    return WebSocket.withActor(MyWebSocketActor::props); 
} 

コントローラ - Javaの7

public static WebSocket<String> socket() { 
    return WebSocket.withActor(new Function<ActorRef, Props>() { 
     public Props apply(ActorRef out) throws Throwable { 
      return MyWebSocketActor.props(out); 
     } 
    }); 
} 

俳優 - ハンドラ

import akka.actor.*; 

public class MyWebSocketActor extends UntypedActor { 

    public static Props props(ActorRef out) { 
     return Props.create(MyWebSocketActor.class, out); 
    } 

    private final ActorRef out; 

    public MyWebSocketActor(ActorRef out) { 
     this.out = out; 
    } 

    public void onReceive(Object message) throws Exception { 
     if (message instanceof String) { 
      out.tell("I received your message: " + message, self()); 
     } 
    } 
} 

出典link


フロントエンド

jQueryのhttps://github.com/ffdead/jquery-graceful-websocket

Javascriptを: 私たちがここで使用したパターンです:

<!DOCTYPE html> 
    <meta charset="utf-8" /> 
    <title>WebSocket Test</title> 
    <script language="javascript" type="text/javascript"> 

    var wsUri = "ws://YOUR_URL"; // it should be wss:// for https connections 
    var output; 

    function init() 
    { 
    output = document.getElementById("output"); 
    testWebSocket(); 
    } 

    function testWebSocket() 
    { 
    websocket = new WebSocket(wsUri); 
    websocket.onopen = function(evt) { onOpen(evt) }; 
    websocket.onclose = function(evt) { onClose(evt) }; 
    websocket.onmessage = function(evt) { onMessage(evt) }; 
    websocket.onerror = function(evt) { onError(evt) }; 
    } 

    function onOpen(evt) 
    { 
    writeToScreen("CONNECTED"); 
    doSend("WebSocket rocks"); 
    } 

    function onClose(evt) 
    { 
    writeToScreen("DISCONNECTED"); 
    } 

    function onMessage(evt) 
    { 
    writeToScreen('<span style="color: blue;">RESPONSE: ' + evt.data+'</span>'); 
    websocket.close(); 
    } 

    function onError(evt) 
    { 
    writeToScreen('<span style="color: red;">ERROR:</span> ' + evt.data); 
    } 

    function doSend(message) 
    { 
    writeToScreen("SENT: " + message); 
    websocket.send(message); 
    } 

    function writeToScreen(message) 
    { 
    var pre = document.createElement("p"); 
    pre.style.wordWrap = "break-word"; 
    pre.innerHTML = message; 
    output.appendChild(pre); 
    } 

    window.addEventListener("load", init, false); 

    </script> 

    <h2>WebSocket Test</h2> 

    <div id="output"></div> 
関連する問題