主要依賴插件pako?https://www.npmjs.com/package/pako
1、安裝
npm install pako
2、使用,?pako.inflate(reader.result, {to: "string"}) 解壓后的string 對象,需要JSON.parse轉成json
this.ws.onmessage = (evt) => {console.log("websocket推送=====",evt.data instanceof Blob)var messageData = evt.data;try {
// S 解壓主要代碼if(evt.data instanceof Blob){let reader = new FileReader();reader.readAsArrayBuffer(evt.data, "utf-8");reader.onload =() =>{// 對數據進行解壓messageData = pako.inflate(reader.result, {to: "string"})console.log("解析壓縮",messageData)}}
// E 解壓主要代碼} catch (error) {console.log("推送報錯-blob",error)}....
3、使用發現解析壓縮會存在異步,導致解壓未完成后續代碼執行會報錯,優化
// 解析websocket推送的gzip blob數據to json
const pakoUngzipToJson = (messageData) => {return new Promise((resolve, reject) => {try {let reader = new FileReader();reader.readAsArrayBuffer(messageData, "utf-8");reader.onload = () => {// 對數據進行解壓let ungzipData = pako.inflate(reader.result, { to: "string" });resolve(ungzipData);};} catch (error) {console.log("推送解析報錯-blob", error);reject(error);}});
};//使用receive: async (message) => {var messageData = message.data;if(messageData instanceof Blob){console.time("解析數據gzip-web")messageData = await pakoUngzipToJson(messageData)console.timeEnd("解析數據gzip-web")}var params = JSON.parse(messageData);......