谁能给一个基于leaf+html5的通讯的例子

[xinjiayu]

说明太少了，按介绍中WebSocket的使用，实现从html5客户端向服务端发送信息，并在服务端debug出信息。可是我想在html5的页面中得到返回来的信息，而不是只是debug在服务端。。应该怎么做呢？请大神帮助。

[name5566]

文档中例子有回应消息到 HTML5 页面：

a.WriteMsg(&msg.Hello{
    Name: "client",
})

发送消息给 HTML5 页面通过 Agent 来完成。你需要获取服务器来的消息，在 HTML5 页面这么编写：

// 处理服务器来的消息
socket.onmessage = function(e) {
    var data = JSON.parse(decoder.decode(e.data));
    // 使用 data
}

需要注意，服务器回应的是二进制数据（也就是说，e.data 是二进制数据），因此这里使用了 decoder（详见：https://github.com/inexorabletash/text-encoding/blob/master/lib/encoding.js），使用 decoder 不是唯一，可能也不是最好的方式。具体可以在研究研究。

[chenxiaobin3000]

<script src="encoding-indexes.js"></script>
<script src="encoding.js"></script>
ws.onmessage = function (event) {
var fileReader = new FileReader(); // 用filereader来转blob为arraybuffer
fileReader.onload = function() {
var arrayBuffer = this.result; // 得到arraybuffer
var decoder = new TextDecoder('utf-8') // 上面回复中给的encoding.js、encoding-indexes.js
var json = JSON.parse(decoder.decode(new DataView(arrayBuffer)))
console.log('response text msg: ' + JSON.stringify(json))
};
fileReader.readAsArrayBuffer(event.data); // 此处读取blob
};
贴个完整的解析代码，把leaf返回的blob转成json：）今天刚刚跑通leaf的ws，chrome测试通过。

[doublEeVil]

不建议像作者这样转，建议使用自带的原生js转换函数，直接将二进制流转为文本或者对象。
代码如下

sock.onmessage = function(e) {
    //var data = JSON.parse(decoder.decode(e.data));
    //console.log("message received: " + e.data);
    var reader = new FileReader();
    reader.readAsText(e.data)
    reader.onload = function() {
        console.log(this.result)//直接打印的就是服务端传回来的数据
    }
}

[miaomiao3]

doublEeVil's method "reader.readAsText(e.data)" throws exception，
e.data is arraybuffer and this type does not implement Blob。

i changed the code：

socket.onmessage = function(e) {
  var ay=new Uint8Array(e.data);
  function uintToString(uintArray) {
      var encodedString = String.fromCharCode.apply(null, uintArray),
      decodedString = decodeURIComponent(escape(encodedString));
      return decodedString;
  }
  console.log(uintToString(ay));
  var data = JSON.parse(uintToString(ay));
  //var data = JSON.parse(decoder.decode(e.data));
}

it worked in leaf-chat_server.
reference： http://stackoverflow.com/questions/17191945/conversion-between-utf-8-arraybuffer-and-string

[heyuanchao]

在 Chrome 中可以使用 TextDecoder

ws = new WebSocket(wsaddr)
ws.binaryType = "arraybuffer"

ws.onmessage = function (e) {
        var decoder = new window.TextDecoder("utf-8")
        var result = JSON.parse(decoder.decode(e.data))
        console.log(result)
}