Datei-Upload über WebSockets zu Play Framework 2.0

Question

Ich benutze Play Framework 2.0, Javascript und WebSockets. Wie im Beispiel habe ich einen AKKA-Akteur, der alle Websockets kennt. Die einzelnen WebSockets.In verfügen über ein ListenerCallback-Objekt, das eingehende Anforderungen von der Clientseite verarbeitet. Auf der Client-Seite habe ich Javascript/jquery, um in JSON serialisierte Formulardaten an den Websocket zu senden. Dies funktioniert sehr gut für einfache Eingaben. Aber jetzt möchte ich dasselbe mit einer Datei machen. Daher muss ich die Dateidaten irgendwie in JSON-Daten (z. B. base64) konvertieren. Weiß jemand, wie man das richtig macht? Ich möchte die Datei in Javascript "sammeln" und dann über JSON an den Websocket senden. Ich weiß, Base64 ist nicht sehr effizient, wenn jemand eine Alternative hat, bitte sagen Sie mir.

Dank

Answer 1

Es ist möglich, aber Sie müssen die WebSocket und FileReader API verwenden, die nur in neueren Browsern unterstützt werden. Javascript hat jetzt einen TypedArray Datentyp, mit dem Bytes übertragen werden können. Um zum Beispiel die folgende HTML gegeben:

​<form> 
    <input type="file" id="picture" /> 
</form>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ 

Sie benötigen die change Ereignis auf dem Datei Eingabefeld zu beobachten. Auf der Javascript-Seite (jQuery):

$("#picture").change(function(){ 
    var reader = new FileReader; 

    reader.onloadend = function (bytes) { 
     var ws = new WebSocket("ws://host/path"); 
     ws.send(bytes);   
    } 

    reader.readAsArrayBuffer(this.files[0]); 
}​);​ 

WebSocket PDU ist minimal gerahmt (nur zwei Byte-Header), und wenn Sie send(), sollte der Browser sorgt für binäre Übertragung die richtige Opcode der Einstellung, und auf dem Server Sie sollten in der Lage sein, den Rohdatenstrom zu lesen. Ich schaue mir jetzt die Play API an, um ein minimales Arbeitsbeispiel zu liefern.

Answer 2

Ich weiß nicht, über das Hochladen von Dateien über WebSockets, sondern über einfache alte HTTP ist es möglich FormData und XMLHttpRequest Objekte verwenden. Werfen Sie einen Blick auf diese article.