feat: web通讯的处理

src/pages/webview/index.vue

@@ -1,15 +1,19 @@
 <template>
   <view>
-    <web-view :src="webviewUrl" @message="handleMessage"></web-view>
+    <web-view id="webview" :src="webviewUrl" @message="handleMessage"></web-view>
   </view>
 </template>
 
 <script setup>
-import { ref, onMounted } from "vue";
-import { navigateToNewPage, saveImageToAlbum, chooseAndUploadImage } from "./h5.js";
+import { ref, onMounted, onUnmounted } from "vue";
+import { navigateToNewPage, saveImageToAlbum, chooseAndUploadImage } from "./bridge.js";
 
 const webviewUrl = ref("");
 
+onUnmounted(() => {
+  uni.$off('UPLOAD_RESULT')
+})
+
 onMounted(() => {
   // 获取页面参数
   const pages = getCurrentPages();
@@ -19,10 +23,31 @@ onMounted(() => {
   // 从页面参数中获取url
   if (options.url) {
     // 对URL进行解码，因为传递时可能被编码了
-    webviewUrl.value = decodeURIComponent(options.url);
+    const decoded = decodeURIComponent(options.url);
+    webviewUrl.value = decoded;
   }
+
+  chooseAndUpload();
 });
 
+const chooseAndUpload = () => {
+  uni.$on('UPLOAD_RESULT', (imageUrl) => {
+    console.log('收到图片地址:', imageUrl)
+
+    const webview = getCurrentPages()
+      .slice(-1)[0]
+      .selectComponent('#webview')
+
+    if (webview) {
+      webview.evalJS(
+        `window.onUploadResult && window.onUploadResult("${imageUrl}")`
+      )
+    } else {
+      console.error('webview 未找到')
+    }
+  })
+}
+
 const handleMessage = (event) => {
   const messageData = event.detail.data[0];
   console.log("Received message from H5:", messageData);
@@ -43,18 +68,9 @@ const handleMessage = (event) => {
       saveImageToAlbum(messageData.imageUrl);
       break;
     case "chooseAndUpload": {
-      // 调用公共上传方法
-      chooseAndUploadImage()
-        .then((imageUrl) => {
-          // 将图片地址通过 hash 传回 H5（不刷新页面）
-          const newUrl = `${originalWebviewUrl.value}#uploadResult=${encodeURIComponent(imageUrl)}`
-          webviewUrl.value = newUrl
-        })
-        .catch(() => {
-          // 上传失败，也可以通知 H5（比如传一个空值或错误标识）
-          const newUrl = `${originalWebviewUrl.value}#uploadResult=error`
-          webviewUrl.value = newUrl
-        })
+      uni.navigateTo({
+        url: '/pages-bridge/UploadImage',
+      })
     }
     break;