在webSokcet客户端调用后,服务器返回给客户端为二进制,在客户端通过js将对象转为字符串或者对象,由于在调用服务端的时候客户端浏览器报websocket Could not decode a text frame as UTF-8,于是将客户端和服务端数据转为二进制操作(arraybuffer)
一,客户端连接webSokcet发消息
1,导入websocket相关js
2,客户端连接webSocket服务
<script>
var ws;
var WEB_SOCKET_SWF_LOCATION = 'assets/socket/media/WebSocketMain.swf';
var WEB_SOCKET_DEBUG = true;
$(function (){
connection();
});
function connection(){
var loc=window.location.href;
var arr=loc.split("/");
arr=arr[2];
var url = "";
if(loc.indexOf("https:")!=-1){
url = "wss://"+arr+"/chat/SYMSG"
}else{
url = "ws://"+arr+"/chat/SYMSG"
}
url = "ws://IP:端口号0"
//url = "ws://IP:端口号/ws/webSocket"
if ('WebSocket' in window) {
ws = new WebSocket(url);
} else if ('MozWebSocket' in window) {
ws = new MozWebSocket(url);
}
ws.binaryType='arraybuffer'; //发送的消息转为二进制
//ws.binaryType='blob'; //发送的消息转为对象,webSocket默认为blob
ws.onopen = function() {
console.log("链接成功!");
var msg='{"msg_id":"ws__getMemberListRequest","user":"admin"}';
//发送消息
ws.send(msg);
};
ws.onmessage = function(resultValue) {
console.log("WebSocket:收到一条消息-norm", resultValue);
showResult(resultValue); //服务端响应消息
};
ws.onclose = function (e) {
console.log('websocket 断开: ' + e.code + ' ' + e.reason + ' ' + e.wasClean)
console.log(e)
}
ws.onerror = function(e) {
console.log("e:"+e);
};
}
//响应消息数据
function showResult(result){
console.log("rsult:"+result)
var json = JSON.parse(new TextDecoder("utf-8").decode(new Uint8Array(result.data))); //将二进制数组转为字符串(重点)
if (json!=undefined&&json!=""){
var data;
var html;
var status;
var encodertype;
//将字符串转为对象
//var parentJsons =eval(json);
//var parentData=parentJsons.data;
//var parentJson=JSON.parse(parentData);
if (json.msg_id=="ws__getMemberListResponse"){
//console.log("msg_id:"+json.msg_id);
var return_data = json.return_;
//var return_data = eval(parentJson.return_.memberInfoList[0].id);
if (return_data.memberInfoList.length>0){
data=return_data.memberInfoList;
for (let i = 0; i < data.length; i++) {
//console.log("id:"+data[i].id+"-->rtspinfo:"+data[i].rtspinfo.loginName);
//状态判断
if (data[i].memberStatus==0){
status="离线";
}else if(data[i].memberStatus==1){
status="在线";
}else if (data[i].memberStatus==2){
status="正在呼叫";
}else if (data[i].memberStatus==3){
status="正在挂断";
}
//类型
if (data[i].memberType==4){
encodertype="ipcamera";
}else if(data[i].memberType==9){
encodertype="sip";
}else if (data[i].memberType==3){
encodertype="avx3000";
}else if (data[i].memberType==10){
encodertype="codec200";
}else if(data[i].memberType==0){
encodertype="h323";
}
//页面数据显示
html+="<tr>" +
"<th class=\'no-sorting\' style=\'width:25px;white-space:nowrap;\'>"+
"<input type=\'checkbox\' class=\'cbr\' value=\'"+data[i].id+"\' data=\'"+data[i].memberStatus+"\'>"+
"</th>"+
"<td>"+status+"</td>"+
"<td>"+data[i].memberName+"</td>"+
"<td>"+data[i].memberAddress+"</td>"+
"<td>"+encodertype+"</td>"+
"<td>"+data[i].SendAudioFmt+"/"+data[i].RecvAudioFmt+"</td>"+
"<td>"+data[i].SendVideoFmt+"/"+data[i].RecvVideoFmt+"</td>"+
"<td>"+
/*操作*/
"<a href=\'encoderUpdate.html?coderId="+data[i].id+"\' >"+
"修改"
+"</a>"+"|"+
"<a href=\'\' οnclick=\'deleteEncoder("+data[i].id+","+data[i].memberStatus+")\'>"+
"删除"
+"</a>"+
"</td>"+
"</tr>";
}
$("#choose").html(html);
}
}else if (parentJson.msg_id=="ws__deleteMemberResponse"){
if (parentJson.result_=="0"){
alert("删除成功!");
window.location.href="encoder.html";
}else {
alert("删除失败!");
window.location.href="encoder.html";
}
}
}
}
</script>
解决websocket 报 Could not decode a text frame as UTF-8 的问题:
https://blog.csdn.net/KokJuis/article/details/107630778