FEAT => 本次更新项目为：

精简初步完成
2025-08-02 14:43:08 +08:00
parent 2e01757519
commit fca202fd76
4 changed files with 109 additions and 504 deletions
--- a/nkebao/index.html
+++ b/nkebao/index.html
@@ -10,7 +10,7 @@
      }
    </style>
    <!-- 引入 uni-app web-view SDK（必须） -->
-    <script src="./websdk.js"></script>
+    <script type="text/javascript" src="./websdk.js"></script>
  </head>
  <body>
    <div id="root"></div>
--- a/nkebao/src/pages/iframe/index.tsx
+++ b/nkebao/src/pages/iframe/index.tsx
@@ -1,5 +1,6 @@
-import React, { useState, useEffect, useRef } from "react";
+import React, { useState, useEffect } from "react";
 import style from "./index.module.scss";
+import { json } from "stream/consumers";

 // 声明全局的 uni 对象
 declare global {
@@ -19,41 +20,46 @@ const IframeDebugPage: React.FC = () => {
  const [receivedMessages, setReceivedMessages] = useState<string[]>([]);
  const [messageId, setMessageId] = useState(0);
  const [inputMessage, setInputMessage] = useState("");
-  const [urlParams, setUrlParams] = useState<Record<string, string>>({});
-  const [processedMessages] = useState(new Set<string>()); // 用于防止重复处理消息

  useEffect(() => {
-    // 解析 URL 参数
-    const parseUrlParams = () => {
-      // 使用兼容的方式解析 URL 参数
-      const search = window.location.search.substring(1); // 移除开头的 '?'
-      const params: Record<string, string> = {};
+    // 解析 URL 参数中的消息
+    const parseUrlMessage = () => {
+      const search = window.location.search.substring(1);
+      let messageParam = null;

      if (search) {
        const pairs = search.split("&");
-        pairs.forEach(pair => {
+        for (const pair of pairs) {
          const [key, value] = pair.split("=");
-          if (key) {
-            params[decodeURIComponent(key)] = decodeURIComponent(value || "");
+          if (key === "message" && value) {
+            messageParam = decodeURIComponent(value);
+            break;
          }
-        });
+        }
      }

-      setUrlParams(params);
-      console.log("解析到的 URL 参数:", JSON.stringify(params));
-
-      // 将 URL 参数作为消息添加到列表
-      if (Object.keys(params).length > 0) {
-        const paramMessage = `[${new Date().toLocaleTimeString()}] URL参数: ${JSON.stringify(params)}`;
-        setReceivedMessages(prev => [paramMessage, ...prev]);
+      if (messageParam) {
+        try {
+          const message = decodeURIComponent(messageParam);
+          console.log("存客宝 收到消息:", message);
+          handleReceivedMessage(JSON.parse(message));
+          // 清除URL中的message参数
+          const newUrl =
+            window.location.pathname +
+            window.location.search
+              .replace(/[?&]message=[^&]*/, "")
+              .replace(/^&/, "?");
+          window.history.replaceState({}, "", newUrl);
+        } catch (e) {
+          console.error("解析URL消息失败:", e);
+        }
      }
    };

    // 初始化 uni-app web-view SDK
    const initUniSDK = () => {
-      console.log("web-view SDK 初始化完成");
-
-      // 页面加载完成后发送准备就绪消息，包含 URL 参数
+      // console.log("web-view SDK 初始化完成");
+      // 发送准备就绪消息
      setTimeout(() => {
        sendMessageToParent({
          id: 0,
@@ -61,7 +67,6 @@ const IframeDebugPage: React.FC = () => {
          data: {
            status: "loaded",
            url: window.location.href,
-            urlParams: urlParams,
          },
          timestamp: Date.now(),
        });
@@ -71,24 +76,16 @@ const IframeDebugPage: React.FC = () => {
    // 监听 SDK 初始化完成事件
    document.addEventListener("UniAppJSBridgeReady", initUniSDK);

-    // 解析 URL 参数
-    parseUrlParams();
+    // 解析 URL 参数中的消息
+    parseUrlMessage();

-    // 检查URL参数中的消息
-    checkUrlMessage();
-
-    // 监听 postMessage 事件（备用方案）
+    // 监听 postMessage 事件
    const handlePostMessage = (event: MessageEvent) => {
-      console.log("收到 postMessage:", event.data);
-
-      // 处理 uni.postMessage 发送的消息格式
      if (event.data && typeof event.data === "object") {
-        // uni.postMessage 发送的消息格式是 { data: message }
        if (event.data.data) {
-          handleParentMessage(event.data.data);
+          handleReceivedMessage(event.data.data);
        } else {
-          // 直接发送的消息格式
-          handleParentMessage(event.data);
+          handleReceivedMessage(event.data);
        }
      }
    };
@@ -99,104 +96,31 @@ const IframeDebugPage: React.FC = () => {
      document.removeEventListener("UniAppJSBridgeReady", initUniSDK);
      window.removeEventListener("message", handlePostMessage);
    };
-  }, []); // 移除 urlParams 依赖，避免无限循环
-
-  // 检查URL参数中的消息
-  const checkUrlMessage = () => {
-    // 使用兼容的方式解析 URL 参数
-    const search = window.location.search.substring(1);
-    let messageParam = null;
-
-    if (search) {
-      const pairs = search.split("&");
-      for (const pair of pairs) {
-        const [key, value] = pair.split("=");
-        if (key === "message" && value) {
-          messageParam = decodeURIComponent(value);
-          break;
-        }
-      }
-    }
-
-    if (messageParam) {
-      try {
-        const message = JSON.parse(messageParam);
-        handleParentMessage(message);
-        // 清除URL参数
-        const newUrl = window.location.pathname;
-        window.history.replaceState({}, "", newUrl);
-      } catch (e) {
-        console.error("解析URL消息失败:", e);
-      }
-    }
-  };
-
-  // 移除 localStorage 相关代码，使用 postMessage 通信
-
-  // 接收 App 发送的消息（需与 App 端 evalJS 调用的函数名一致）
-  const receiveFromApp = (data: any) => {
-    console.log("web-view 收到 App 消息：", data);
-    handleParentMessage(data);
-  };
-
-  // 将函数挂载到全局，供 App 端调用
-  useEffect(() => {
-    (window as any).receiveFromApp = receiveFromApp;
-
-    return () => {
-      delete (window as any).receiveFromApp;
-    };
  }, []);

-  // 接收 App 发送的消息
-  const handleParentMessage = (message: Message) => {
-    // 生成消息的唯一标识，用于防重复处理
-    const messageKey = `${message.id}-${message.timestamp}-${JSON.stringify(message.data)}`;
-
-    // 检查是否已经处理过这个消息
-    if (processedMessages.has(messageKey)) {
-      console.log("消息已处理过，跳过:", message);
-      return;
-    }
-
-    // 添加到已处理集合
-    processedMessages.add(messageKey);
-
-    console.log("web-view 收到 App 消息：", message);
-    const messageText = `[${new Date().toLocaleTimeString()}] 收到: ${JSON.stringify(message)}`;
+  // 处理接收到的消息
+  const handleReceivedMessage = (message: Message) => {
+    const messageText = `[${new Date().toLocaleTimeString()}] 收到: ${message}`;
    setReceivedMessages(prev => [...prev, messageText]);
-
-    // 根据消息类型进行不同处理
-    if (message.type === "command") {
-      if (message.data?.action === "update") {
-        // 更新页面内容
-        console.log("执行更新操作:", message.data.content);
-      }
-    } else if (message.type === "fromApp") {
-      console.log("收到 App 消息:", message.data?.content);
-    }
  };

  // 向 App 发送消息
  const sendMessageToParent = (message: Message) => {
-    console.log("web-view 发送消息到 App:", message);
-
-    // 通过 uni.postMessage 发送消息（数据必须放在 data 字段中）
    if (window.uni && window.uni.postMessage) {
      try {
        window.uni.postMessage({
          data: message,
        });
-        console.log("通过 uni.postMessage 发送消息到 App:", message);
+        console.log("发送消息到 App:", message);
      } catch (e) {
-        console.error("uni.postMessage 失败:", e);
+        console.error("发送失败:", e);
      }
    } else {
-      console.error("uni 对象不存在，无法发送消息");
+      console.error("无法发送消息");
    }
  };

-  // 向 App 发送消息
+  // 发送自定义消息到 App
  const sendCustomMessage = () => {
    if (!inputMessage.trim()) return;

@@ -307,32 +231,9 @@ const IframeDebugPage: React.FC = () => {
        <div className={style["info-item"]}>
          <strong>页面URL:</strong> {window.location.href}
        </div>
-        <div className={style["info-item"]}>
-          <strong>User Agent:</strong> {navigator.userAgent}
-        </div>
-        <div className={style["info-item"]}>
-          <strong>窗口大小:</strong> {window.innerWidth} x {window.innerHeight}
-        </div>
        <div className={style["info-item"]}>
          <strong>消息ID:</strong> {messageId}
        </div>
-
-        {/* URL 参数显示区域 */}
-        <div className={style["url-params-section"]}>
-          <h4>URL 参数</h4>
-          {Object.keys(urlParams).length === 0 ? (
-            <div className={style["no-params"]}>暂无 URL 参数</div>
-          ) : (
-            <div className={style["params-list"]}>
-              {Object.entries(urlParams).map(([key, value]) => (
-                <div key={key} className={style["param-item"]}>
-                  <span className={style["param-key"]}>{key}:</span>
-                  <span className={style["param-value"]}>{value}</span>
-                </div>
-              ))}
-            </div>
-          )}
-        </div>
      </div>
    </div>
  );