DDR爱好者之家 Design By 杰米
最近做了几个项目,用js操作二进制数据,通过socket与后台进行传输。在此用博客做个记录
首先是新建一个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;
});
})
}
转成字符串之后就可以为所欲为了。
以上就是我做项目时用到的操作二进制数据的方法,按位读取头都要炸了······google开源的protobuf能够设置完数据格式之后,所有读取操作都不用自己拼接了,非常舒服。不过不懂后台技术,我只能跟在后台大佬后面吃馍渣 TnT
这篇js操作二进制数据方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。
DDR爱好者之家 Design By 杰米
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
DDR爱好者之家 Design By 杰米
暂无评论...
更新日志
2025年10月24日
2025年10月24日
- 小骆驼-《草原狼2(蓝光CD)》[原抓WAV+CUE]
- 群星《欢迎来到我身边 电影原声专辑》[320K/MP3][105.02MB]
- 群星《欢迎来到我身边 电影原声专辑》[FLAC/分轨][480.9MB]
- 雷婷《梦里蓝天HQⅡ》 2023头版限量编号低速原抓[WAV+CUE][463M]
- 群星《2024好听新歌42》AI调整音效【WAV分轨】
- 王思雨-《思念陪着鸿雁飞》WAV
- 王思雨《喜马拉雅HQ》头版限量编号[WAV+CUE]
- 李健《无时无刻》[WAV+CUE][590M]
- 陈奕迅《酝酿》[WAV分轨][502M]
- 卓依婷《化蝶》2CD[WAV+CUE][1.1G]
- 群星《吉他王(黑胶CD)》[WAV+CUE]
- 齐秦《穿乐(穿越)》[WAV+CUE]
- 发烧珍品《数位CD音响测试-动向效果(九)》【WAV+CUE】
- 邝美云《邝美云精装歌集》[DSF][1.6G]
- 吕方《爱一回伤一回》[WAV+CUE][454M]