js操作二进制数据

2018-06-24 01:36:11来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

最近做了几个项目,用js操作二进制数据,通过socket与后台进行传输。在此用博客做个记录

首先是新建一个socket:

1 var socket=new WebSocket("ws://192.168.0.147");

接着定义socket打开,连接之后执行的函数:

websocket有个属性binaryType,可将其设置为“blob”或者“arraybuffer”,默认格式为“blob”,做项目的时候忘记设置为“arraybuffer”了,结果在下面接收数据的时候就需要用Blob对象来接。

socket.onopen=function(){
   //发送登录帧,4-20位为手机号
    var loginArr=[0X02,0X02,0X00,0X1E,0X20,0X20,0X20,0X20,0X20,0X20,0X20,0X20,0X20,0X20,0X20,0X20,0X20,0X20,0X20,0X20,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X0D,0X0A]                              
}

下面是转成bype发送出去:

var loginBuffer=new ArrayBuffer(30);
var loginDataview=new DataView(loginBuffer);
//localstorageuserinfo为缓存在本地的用户手机号
var telArr=localstorageuserinfo.TelPhone; 
var loginTime=tempTrans();
for(var i=0;i<loginArr.length;){
    loginDataview.setInt8(i,loginArr[i]);
    if(i>3&&i<(telArr.length+4)){
            loginDataview.setInt8(i,telArr.charCodeAt(i-4));
    }            
    if(i>19&&i<loginArr.length-2){
        loginDataview.setInt8(i,loginTime[i-20]);
    }
    i++;
}
//登录包
socket.send(loginDataview.buffer);            
//格式化时间同时按照年俩位月日时分秒1位由高到底排序
function tempTrans(time){
    if(!time){
        time=new Date();
    }
    var u32Dataview=new DataView(new Uint16Array([time.getFullYear()]).buffer);
    var uint8=[];
    uint8.push(new DataView(new Uint8Array([0X00]).buffer).getUint8(0))
    for(var i=u32Dataview.byteLength-1;i>=0;i--){
        uint8.push(u32Dataview.getUint8(i))
    }
    uint8.push(new DataView(new Uint8Array([time.getMonth()+1]).buffer).getUint8(0));
    uint8.push(new DataView(new Uint8Array([time.getDate()]).buffer).getUint8(0));
    uint8.push(new DataView(new Uint8Array([time.getHours()]).buffer).getUint8(0));
    uint8.push(new DataView(new Uint8Array([time.getMinutes()]).buffer).getUint8(0));
    uint8.push(new DataView(new Uint8Array([time.getSeconds()]).buffer).getUint8(0));
    return uint8;
}

发送的流程大概就是这样,先new ArrayBuffer对象,该对象需要填入缓冲区长度参数,具体查看api==>  https://msdn.microsoft.com/zh-cn/library/br212474(v=vs.94).aspx,

然后新建DataView对象,将ArrayBuffer传进去。然后用DataView的setUint和getUint方法按位进行读取设置,具体参考api==> https://msdn.microsoft.com/zh-cn/library/br212463(v=vs.94).aspx

下面是接收数据处理:

 1 //接收消息onmessage
 2 socket.onmessage=function(data){
 3         var blob_=new Blob([data.data]);
 4         parseBlob(blob_);
 5     }
 6 //使用fileReader操作blob对象
 7 var reader = { 
 8     readAs: function(type,blob,cb){
 9         var r = new FileReader();
10         r.onloadend = function(){
11               if(typeof(cb) === 'function') {
12                 cb.call(r,r.result);
13               }
14         }
15         try{
16               r['readAs'+type](blob);
17         }catch(e){}
18       }
19 }
20 function parseBlob(blob){
21    reader.readAs('ArrayBuffer',blob.slice(0,blob.size),function(arr){
22      var dataview_=new DataView(arr);
23      //协议中第二位是判断数据来源的
24      var socketConType=dataview_.getUint8(1);
25      //转成字符串读取数据
26      var modulelength=(dataview_.buffer.byteLength-46)/33;
27      var modulestate={};
28     reader.readAs('Text',blob.slice(i*33+37,i*33+37+32),function(result){
29         modulestate[dataview_.getUint8(i*33+36)]=result;
30      });
31    })
32 }

转成字符串之后就可以为所欲为了。

以上就是我做项目时用到的操作二进制数据的方法

第一次写博客,希望各位能多指导交流

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:中国及国外菜系汇总字段

下一篇:AJAX跨域问题解决方法(1)——禁止浏览器进行跨域限制