uniapp纯h5的vue页面和上级webview通信 - window.postMessage方式 - 纯H5版vue页面中的webview无法捕捉html文件的uni.postMessage消息
// 在纯H5版vue页面中,监听message事件
window.addEventListener('message', function(event) {
// 确保消息来源可靠
if (event.origin !== 'https://your-parent-webview-domain.com') return;
// 处理接收到的数据
console.log('接收到的数据:', event.data);
}, false);
// 在某个事件中,发送消息到上级webview
function sendMessageToParentWebview() {
// 假设上级webview的URL是 'https://your-parent-webview-domain.com'
window.parent.postMessage({
action: 'yourAction',
data: 'yourData'
}, 'https://your-parent-webview-domain.com');
}
在这个例子中,我们首先在纯H5版vue页面中监听message
事件,以便接收来自上级webview的消息。然后,在某个事件处理函数中,我们调用window.parent.postMessage
方法向上级webview发送消息。注意,在发送消息时,我们需要指定window.parent
以及需要发送到的特定域。
评论已关闭