解决手机端解码报错的问题

package-lock.json

@@ -9,6 +9,7 @@
             "version": "1.0.1",
             "dependencies": {
                 "abort-controller": "^3.0.0",
+                "buffer": "^6.0.3",
                 "mqtt": "^3.0.0",
                 "vue": "^3.5.21"
             }
@@ -220,6 +221,30 @@
                 "readable-stream": "^3.4.0"
             }
         },
+        "node_modules/bl/node_modules/buffer": {
+            "version": "5.7.1",
+            "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
+            "integrity": "sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==",
+            "funding": [
+                {
+                    "type": "github",
+                    "url": "https://github.com/sponsors/feross"
+                },
+                {
+                    "type": "patreon",
+                    "url": "https://www.patreon.com/feross"
+                },
+                {
+                    "type": "consulting",
+                    "url": "https://feross.org/support"
+                }
+            ],
+            "license": "MIT",
+            "dependencies": {
+                "base64-js": "^1.3.1",
+                "ieee754": "^1.1.13"
+            }
+        },
         "node_modules/bl/node_modules/readable-stream": {
             "version": "3.6.2",
             "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
@@ -245,9 +270,9 @@
             }
         },
         "node_modules/buffer": {
-            "version": "5.7.1",
+            "version": "6.0.3",
-            "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
+            "resolved": "https://registry.npmjs.org/buffer/-/buffer-6.0.3.tgz",
-            "integrity": "sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==",
+            "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==",
             "funding": [
                 {
                     "type": "github",
@@ -265,7 +290,7 @@
             "license": "MIT",
             "dependencies": {
                 "base64-js": "^1.3.1",
-                "ieee754": "^1.1.13"
+                "ieee754": "^1.2.1"
             }
         },
         "node_modules/buffer-from": {

package.json

@@ -18,6 +18,7 @@
     },
     "dependencies": {
         "abort-controller": "^3.0.0",
+        "buffer": "^6.0.3",
         "mqtt": "^3.0.0",
         "vue": "^3.5.21"
     }

packages/customerService/index/index.vue

@@ -1,4 +1,4 @@
-<template>
+packages/customerService/index/index<template>
   <view class="chat-container">
     <!-- 聊天头部 -->
     <view :style="{ paddingTop: top + 'px', height: localHeight + 'px' }" class="chat-header">
@@ -15,8 +15,8 @@
     <view v-if="connectingStatus" class="connecting-status">{{ connectingStatus }}</view>
 
     <!-- 聊天消息区域 -->
-    <scroll-view :scroll-into-view="scrollToView" class="chat-messages" scroll-y="true"
+    <scroll-view :scroll-into-view="scrollToView" class="chat-messages" scroll-y="true" @scrolltoupper="loadMoreHistory"
-                 @scrolltoupper="loadMoreHistory" @scrolltolower="loadMoreHistory" lower-threshold="100" upper-threshold="100">
+      @scrolltolower="loadMoreHistory" lower-threshold="100" upper-threshold="100">
       <!-- 加载历史消息提示 -->
       <view v-if="isLoadingHistory" class="message-time">加载历史消息...</view>
 
@@ -45,8 +45,8 @@
       <view class="input-container">
         <textarea v-model="inputMessage" :adjust-position="true" class="message-input" placeholder="请输入消息..."
           @confirm="sendMessage" @input="handleInput" auto-height hold-keyboard="true"
-                  enable-keyboard-accessory-view="true" cursor-spacing="10" maxlength="500"
+          enable-keyboard-accessory-view="true" cursor-spacing="10" maxlength="500" @focus="onInputFocus"
-                  @focus="onInputFocus" @blur="onInputBlur"></textarea>
+          @blur="onInputBlur"></textarea>
         <button :disabled="!canSend || !client || !isConnected" class="send-btn" @tap="sendMessage">
           发送
         </button>
@@ -154,9 +154,10 @@ export default {
 
       await this.subscribe()
       this.client.on('message', (topic, message) => {
-        let de = new TextDecoder('utf-8')
+        const msgStr = Buffer.from(message).toString('utf8'); // 二进制转UTF-8字符串
-        let msg = de.decode(message)
+        const msg = JSON.parse(msgStr); // 后续解析逻辑不变
-        let jsMsg = JSON.parse(msg)
+
+        let jsMsg = msg // 直接使用已解析的对象，无需再次解析
         console.log('收到消息', topic, msg)
         if (jsMsg.send_client === this.selfClientId || jsMsg.receive_client === this.selfClientId) {
           console.log('接收或发送人是我')

packages/localLife/detail/index.css

@@ -83,6 +83,7 @@ page {
   justify-content: space-between;
   align-items: center;
   box-shadow: 3rpx -3rpx 15rpx 0rpx rgba(255,27,27,0.05);
+  padding-bottom: 30rpx;
 }
 
 .left {

yarn.lock

@@ -164,6 +164,14 @@ buffer@^5.5.0:
     base64-js "^1.3.1"
     ieee754 "^1.1.13"
 
+buffer@^6.0.3:
+  version "6.0.3"
+  resolved "https://registry.npmjs.org/buffer/-/buffer-6.0.3.tgz"
+  integrity sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==
+  dependencies:
+    base64-js "^1.3.1"
+    ieee754 "^1.2.1"
+
 callback-stream@^1.0.2:
   version "1.1.0"
   resolved "https://registry.npmjs.org/callback-stream/-/callback-stream-1.1.0.tgz"
@@ -384,7 +392,7 @@ help-me@^1.0.1:
     through2 "^2.0.1"
     xtend "^4.0.0"
 
-ieee754@^1.1.13:
+ieee754@^1.1.13, ieee754@^1.2.1:
   version "1.2.1"
   resolved "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz"
   integrity sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==