微信小程序RequestTask.onChunkReceived返回的数据流如何解析？微信小程序不支持TextDecoder怎么办？

最近踩坑不少，关于微信小程序如何解决数据流的问题，总结一下

1、下载js文件

miniprogram/miniprogram-text-decoder.js at main · 123456789xzxz/miniprogram · GitHub

miniprogram/miniprogram-text-encoder.js at main · 123456789xzxz/miniprogram · GitHub

然后按需要引入就行

import TextDecoder from './miniprogram-text-decoder'

import TextEncoder from './miniprogram-text-encoder'

文件下载来后，引入小程序：

import TextDecoder from '@/utils/miniprogram-text-decoder'

使用方式：

javascript 复制代码

let tempUint8Array = new Uint8Array(0)
const requestTask = wx.request({
    url: baseURL,
    timeout: 15000,
    method: 'post',
    enableChunked: true, // 开启分片模式
    header: { },
    data: param
})
requestTask.onChunkReceived((response) => {
    const arrayBuffer = new Uint8Array(response.data)
    let str = new TextDecoder().decode(arrayBuffer)
    console.log('deMessage', str)
}

2、Protobuf 处理

1、下载依赖

需要注意下Protobuf版本使用 protobufjs@6.8.6最好，我在使用的时候安装7.多莫名奇妙

css 复制代码

npm install -g protobufjs@6.8.6

2、执行pbjs

3、转换proto文件

将文件流回来的数据格式在网站JSON转Protobuf,在线JSON转Protobuf - 图灵工具在线工具系统

上转化为标准的proto文件，新建文件awesome.proto，将转化好的文件复制进去，保存；

执行命令

复制代码

pbjs -t json awesome.proto > awesome.json

运行之后会生成一个 awesome.json文件

json 复制代码

"nested": {
        "AwesomeMessage": {
            "fields": {
                "awesomeField": {
                    "type": "string",
                    "id": 1
                }
            }
        }
    }

复制代码

4、转js文件

此时的json文件我们不能直接使用，不过我们可以将json对象取出放到小程序项目当中去，比如在小程序项目中新建一个awesome.js

java 复制代码

module.exports = {
    "nested": {
        "AwesomeMessage": {
            "fields": {
                "awesomeField": {
                    "type": "string",
                    "id": 1
                }
            }
        }
    }
};

5、最后使用

javascript 复制代码

// 引入
var protobuf = require('../../weichatPb/protobuf') //引入protobuf模块
var awesomeConfig = require('@/utils/protobuf/protobuf.js') //加载awesome.proto对应的json
//awesome
var AwesomeRoot = protobuf.Root.fromJSON(awesomeConfig)
var AwesomeMessage = AwesomeRoot.lookupType('AwesomeMessage')
//awesome


test1() {
      var payload = {awesomeField: "我是test1"};
      var message = AwesomeMessage.create(payload)
      var buffer = AwesomeMessage.encode(message).finish()
      console.log('buffer', buffer)
      var deMessage = AwesomeMessage.decode(buffer)
      console.log('deMessage', deMessage)
    }