diff --git a/ckApp/pages/index/index.vue b/ckApp/pages/index/index.vue
index e9f07a3c..9941a044 100644
--- a/ckApp/pages/index/index.vue
+++ b/ckApp/pages/index/index.vue
@@ -48,13 +48,7 @@
receivedMessages: [],
messageId: 0,
// URL 参数配置
- urlParams: {
- userId: '12345',
- token: 'abc123',
- theme: 'dark',
- language: 'zh-CN',
- timestamp: Date.now()
- }
+ urlParams: {}
}
},
onLoad() {
@@ -84,10 +78,12 @@
sendMessageToIframe() {
this.messageId++;
const message = {
- id: this.messageId,
- type: 'fromApp',
- content: `Hello,我是 App 发送的消息 ${this.messageId}`,
- timestamp: Date.now()
+ type: 0, // 数据类型:0数据交互 1App功能调用
+ data: {
+ id: this.messageId,
+ content: `Hello,我是 App 发送的消息 ${this.messageId}`,
+ timestamp: Date.now()
+ }
};
// 将消息添加到URL参数中
@@ -104,15 +100,18 @@
this.receivedMessages.push(`[${new Date().toLocaleTimeString()}] ${JSON.stringify(webData)}`);
- if (webData.type === 'ready') {
- // console.log('web-view 已准备就绪');
+ if (webData.type === 0) {
+ // 数据交互
+ console.log('收到数据交互消息:', webData.data);
uni.showToast({
- title: 'web-view 连接成功',
- icon: 'success'
+ title: `收到数据:${webData.data.content || '无内容'}`,
+ icon: 'none'
});
- } else if (webData.type === 'toApp') {
+ } else if (webData.type === 1) {
+ // App功能调用
+ console.log('收到App功能调用:', webData.data);
uni.showToast({
- title: `收到:${webData.content}`,
+ title: `收到功能调用:${webData.data.action || '未知功能'}`,
icon: 'none'
});
}
diff --git a/nkebao/src/pages/iframe/index.tsx b/nkebao/src/pages/iframe/index.tsx
index 521db96a..459b7f10 100644
--- a/nkebao/src/pages/iframe/index.tsx
+++ b/nkebao/src/pages/iframe/index.tsx
@@ -1,6 +1,5 @@
import React, { useState, useEffect } from "react";
import style from "./index.module.scss";
-import { json } from "stream/consumers";
// 声明全局的 uni 对象
declare global {
@@ -10,10 +9,8 @@ declare global {
}
interface Message {
- id: number;
- type: string;
+ type: number; // 数据类型:0数据交互 1App功能调用
data: any;
- timestamp: number;
}
const IframeDebugPage: React.FC = () => {
@@ -40,9 +37,9 @@ const IframeDebugPage: React.FC = () => {
if (messageParam) {
try {
- const message = decodeURIComponent(messageParam);
+ const message = JSON.parse(decodeURIComponent(messageParam));
console.log("存客宝 收到消息:", message);
- handleReceivedMessage(JSON.parse(message));
+ handleReceivedMessage(message);
// 清除URL中的message参数
const newUrl =
window.location.pathname +
@@ -62,13 +59,12 @@ const IframeDebugPage: React.FC = () => {
// 发送准备就绪消息
setTimeout(() => {
sendMessageToParent({
- id: 0,
- type: "ready",
+ type: 0, // 数据交互
data: {
+ action: "ready",
status: "loaded",
url: window.location.href,
},
- timestamp: Date.now(),
});
}, 500);
};
@@ -100,7 +96,7 @@ const IframeDebugPage: React.FC = () => {
// 处理接收到的消息
const handleReceivedMessage = (message: Message) => {
- const messageText = `[${new Date().toLocaleTimeString()}] 收到: ${message}`;
+ const messageText = `[${new Date().toLocaleTimeString()}] 收到: ${JSON.stringify(message)}`;
setReceivedMessages(prev => [...prev, messageText]);
};
@@ -128,14 +124,13 @@ const IframeDebugPage: React.FC = () => {
setMessageId(newMessageId);
const message: Message = {
- id: newMessageId,
- type: "toApp",
+ type: 0, // 数据交互
data: {
+ id: newMessageId,
content: inputMessage,
source: "web-view",
timestamp: Date.now(),
},
- timestamp: Date.now(),
};
sendMessageToParent(message);
@@ -148,14 +143,29 @@ const IframeDebugPage: React.FC = () => {
setMessageId(newMessageId);
const message: Message = {
- id: newMessageId,
- type: "toApp",
+ type: 0, // 数据交互
data: {
+ id: newMessageId,
action: "ping",
content: `web-view测试消息 ${newMessageId}`,
random: Math.random(),
},
- timestamp: Date.now(),
+ };
+
+ sendMessageToParent(message);
+ };
+
+ // 发送App功能调用消息
+ const sendAppFunctionCall = () => {
+ const message: Message = {
+ type: 1, // App功能调用
+ data: {
+ action: "showToast",
+ params: {
+ title: "来自H5的功能调用",
+ icon: "success",
+ },
+ },
};
sendMessageToParent(message);
@@ -201,6 +211,12 @@ const IframeDebugPage: React.FC = () => {
>
发送测试消息
+