js는 바이너리 데이터를 작동하는 방법을 구현합니다.-JS 튜토리얼-php.cn

js는 바이너리 데이터를 작동하는 방법을 구현합니다.

亚连

풀어 주다： 2018-06-01 16:27:51

원래의

2107명이 탐색했습니다.

이제 좋은 참고 가치가 있는 바이너리 데이터를 조작하는 js 방법을 여러분과 공유하겠습니다. 모두에게 도움이 되기를 바랍니다.

저는 최근 js를 사용하여 바이너리 데이터를 조작하고 소켓과 백그라운드를 통해 전송하는 여러 프로젝트를 수행했습니다. 여기에 블로그 메모를 작성하겠습니다

먼저 새 소켓을 만듭니다.

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

로그인 후 복사

그런 다음 소켓이 열리고 연결된 후 실행될 함수를 정의합니다.

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;
}

로그인 후 복사

전송 프로세스는 대략 다음과 같습니다. 먼저 버퍼 길이 매개변수를 채워야 하는 새 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) === &#39;function&#39;) {
    cb.call(r,r.result);
    }
  }
  try{
    r[&#39;readAs&#39;+type](blob);
  }catch(e){}
  }
}
function parseBlob(blob){
 reader.readAs(&#39;ArrayBuffer&#39;,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(&#39;Text&#39;,blob.slice(i*33+37,i*33+37+32),function(result){
  　　modulestate[dataview_.getUint8(i*33+36)]=result;
 　　});
 })
}

로그인 후 복사

위 내용은 제가 모두를 위해 정리한 내용입니다. 앞으로 모든 분들께 도움이 되길 바랍니다.