个人案例
每日健身打卡助手
健身打卡
每日健身打卡助手扫码体验
- wx.request()设置了enableChunked,但是收到的结果非流式还是一次性返回呢?
wx.request()已经设置了enableChunked:true,但是实际收到的结果是这样的,结果是分段的,但是确实一次性返回: [图片] 用Postman请求又没有问题,返回是分段式返回的 [图片] 大家帮忙看看是哪里有问题呢?基础库版本是2.25.4 代码如下: test() { const that = this; const requestTask = wx.request({ url: 'https://keyue.cloud.baidu.com/online/core/v5/stream/query', method: 'POST', responseType: "arraybuffer", enableChunked: true, //关键!开启流式传输模式 header: { 'content-type': 'application/json', }, header: { token: that.data.token }, data: { "queryText": '', "sessionId": '' }, success: (res) => { console.log("结束----request success", res); }, fail: (err) => { console.log("request fail", err); }, }); // 监听请求头接受事件 requestTask.onHeadersReceived(r => {}); // 监听数据分块接收事件 requestTask.onChunkReceived((response) => { // 收到流式数据,根据返回值进行相对应数据解码 let data16 = that.buf2hex(response.data) let responseText = that.hexToStr(data16) // 将处理好的字符串加入到数据中 console.log(responseText) }); }, buf2hex(buffer) { return Array.prototype.map.call(new Uint8Array(buffer), x => ('00' + x.toString(16)).slice(-2)).join(''); }, hexToStr(hex) { let str = ''; for (let i = 0; i < hex.length; i += 2) { str += String.fromCharCode(parseInt(hex.substr(i, 2), 16)); } return str; }
2024-09-27 - 小程序实现流式数据(打字机)效果输出
小程序实现打字机流式数据输出,有两种方案,一种就是小程序自身实现,另外一种就是使webView转接到 h5 间接实现。 小程序自身实现就是用 uni.request 的 enableChunked 分块数据配置项 const requestTask = uni.request({ url: '服务地址', timeout: 100000, responseType: 'text', method: 'GET', enableChunked: true, //配置这里 data: {}, }) // 返回的 requestTask 拥有一个 onChunkReceived 监听回调 onChunkReceived 的回调参数: res:data (ArrayBuffer):接收到的分块数据。 requestTask.onChunkReceived(res => { // res 流式数据 注意:这里可能是多块数据,服务推送多次信息,onChunkReceived只响应一次,则该次监听的内容就是服务器推送多次拼接在一起的字符串,需要单独裁剪额外处理 try { // 解码分块数据 const uint8Array = new Uint8Array(res.data); let test = String.fromCharCode.apply(null, uint8Array); test = decodeURIComponent(escape(test)); let testArr = test.split('data:'); console.log(testArr, '====9999==='); // 这里就是服务器推送的原始内容 // 后续用户自己的操作。。。 } catch(err){ console.error('推送数据结构异常!', err); } }) requestTask.abort() // 手动关闭链接 webView转接到 h5 间接实现 使用 h5 内嵌的话,那就正常跟 web端实现一样,使用 EventSource(单项数据流) 实例(因为小程序端没有 EventSource 实例,所以不可用),EventSource 方案只支持 get 请求,所以传参可能会复杂些 let eventSource = new EventSource('服务链接+传参'); eventSource.onopen = (e) => { // 链接建立成功的钩子 } eventSource.onerror= (e) => { // 链接异常抛出的钩子 } eventSource.onmessage = (e) => { // 服务端推送信息捕获的钩子,服务端推送一次就会触发一次 https://developer.mozilla.org/zh-CN/docs/Web/API/EventSource/EventSource } eventSource.close() // 手动关闭链接
03-04 - 小程序右上角“...” 里的“重新进入小程序”,Android 丢失路由参数,iOS 不会
复现方式如下: 设置页面启动参数[图片] 2 使用 Android 手机真机预览,并点击“重新进入小程序”,过程如视频:https://assets-phi.vercel.app/issue/1655360013201439.mp4 3 使用 iOS 手机真机预览,并点击“重新进入小程序”,过程如视频:https://assets-phi.vercel.app/issue/1655361682840191.mp4
2022-06-16