这次给大家带来js怎样直接操作二进制数据,js直接操作二进制数据的注意事项有哪些,下面就是实战案例,一起来看一下。
首先是新建一个socket:
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
下面是接收数据处理:
//接收消息onmessage
socket.onmessage=function(data){
var blob_=new blob([data.data]);
parseblob(blob_);
}
//使用filereader操作blob对象
var reader = {
readas: function(type,blob,cb){
var r = new filereader();
r.onloadend = function(){
if(typeof(cb) === 'function') {
cb.call(r,r.result);
}
}
try{
r['readas'+type](blob);
}catch(e){}
}
}
function parseblob(blob){
reader.readas('arraybuffer',blob.slice(0,blob.size),function(arr){
var dataview_=new dataview(arr);
//协议中第二位是判断数据来源的
var socketcontype=dataview_.getuint8(1);
//转成字符串读取数据
var modulelength=(dataview_.buffer.bytelength-46)/33;
var modulestate={};
reader.readas('text',blob.slice(i*33+37,i*33+37+32),function(result){
modulestate[dataview_.getuint8(i*33+36)]=result;
});
})
}
转成字符串之后就可以为所欲为了。
相信看了本文案例你已经掌握了方法,更多精彩请关注其它相关文章!
推荐阅读:
web端的应用实现后退强制刷新
ionic2中怎么使用自动生成器
以上就是js怎样直接操作二进制数据的详细内容。