<template>
<view class="content">
<view class="text-area">
<text class="title">{{title}}</text>
</view>
<view class="" @click="post">
发送消息
</view>
</view>
</template>
<script>
import y_uni from "y_uniwebview"
export default {
data() {
return {
title: 'h5Uniapp'
}
},
onLoad() {
},
methods: {
post() {
console.log("din", y_uni);
y_uni.postMessage({
data: {
action: 'message',
data: 'hellosam'
}
});
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
margin-left: auto;
margin-right: auto;
margin-bottom: 50rpx;
}
.text-area {
display: flex;
justify-content: center;
}
.title {
font-size: 36rpx;
color: #8f8f94;
}
</style>
Sam888
- 发布：2025-12-02 09:49
- 更新：2025-12-03 17:07
- 阅读：196
产品分类： uniapp/H5
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： Win11
HBuilderX类型： 正式
HBuilderX版本号： 4.85
浏览器平台： Chrome
浏览器版本： 鸿蒙next
项目创建方式： HBuilderX
操作步骤：
预期结果：
<web-view id="webview" :src="biaoxunUrl" @load="loadedWebView" @message="message"
@onPostMessage="message"></web-view>
message(e) {
console.log(e.detail.data);
let action = e.detail.data[0].action
console.log(action);}
<web-view id="webview" :src="biaoxunUrl" @load="loadedWebView" @message="message"
@onPostMessage="message"></web-view>
message(e) {
console.log(e.detail.data);
let action = e.detail.data[0].action
console.log(action);}实际结果：
message(e) {
console.log(e.detail.data);
let action = e.detail.data[0].action
console.log(action);方法不调用
}
message(e) {
console.log(e.detail.data);
let action = e.detail.data[0].action
console.log(action);方法不调用
}bug描述：
uniapp开发的h5 用在uniapp webview中通信不生效
最佳回复
Sam888 (作者)
h5的项目是用uniapp打包出来的 我看
https://www.npmjs.com/package/y_uniwebview?activeTab=readme 这个是对uniapp打包的h5做了兼容 鸿蒙却没生效 是不是哪里还需要兼容一下
DCloud_UNI_OttoJi - 日常回复 uni-app/x 问题，如果艾特我没看到，请主动私信
这个三方依赖上次更新是两年前，内置的 jssdk 可能没有考虑鸿蒙的兼容
要是先 uniapp 打出来的网页，作为 webview 容器内容，希望做通讯，其他不复杂。
网页端引入 jssdk，添加检测代码即可，我建议你看一下这个网页的源码，尝试改一下，看是否功能正常，如果正常了就联系作者做个升级。
view-source:https://hellouniapp.dcloud.net.cn/html/web-view.html
这个源码
-
Sam888 (作者)
view-source:https://hellouniapp.dcloud.net.cn/html/web-view.html 这个在鸿蒙是可以的通信的 这个是h5直接写的页面和uniapp生成的H5有区别 现在就看能不能把https://www.npmjs.com/package/y_uniwebview?activeTab=readme这个源码改下用最新的https://gitcode.com/dcloud/uni-app/blob/dev/dist/uni.webview.1.5.6.js
2025-12-03 14:53
Sam888 (作者)
let y_uni;
! function(e, n) {
y_uni=n();
return
console.log(666888)
console.log(n())
"object" == typeof exports && "undefined" != typeof module ? module.exports = n() : "function" == typeof define &&
define.amd ? define(n) : (e = e || self).y_uni = n()
}(this, (function() {
"use strict";
try {
var e = {};
Object.defineProperty(e, "passive", {
get: function() {
!0
}
}), window.addEventListener("test-passive", null, e)
} catch (e) {}
var n = Object.prototype.hasOwnProperty;
function i(e, i) {
return n.call(e, i)
}
var t = [];
function o() {
return window.__dcloud_weex_postMessage || window.__dcloud_weex_
}
function a() {
return window.__uniapp_x_postMessage || window.__uniapp_x_
}
var r = function(e, n) {
var i = {
options: {
timestamp: +new Date
},
name: e,
arg: n
};
if (a()) {
if ("postMessage" === e) {
var r = {
data: n
};
return window.__uniapp_x_postMessage ? window.__uniapp_x_postMessage(r) : window.__uniapp_x_
.postMessage(JSON.stringify(r))
}
var d = {
type: "WEB_INVOKE_APPSERVICE",
args: {
data: i,
webviewIds: t
}
};
window.__uniapp_x_postMessage ? window.__uniapp_x_postMessageToService(d) : window.__uniapp_x_
.postMessageToService(JSON.stringify(d))
} else if (o()) {
if ("postMessage" === e) {
var s = {
data: [n]
};
return window.__dcloud_weex_postMessage ? window.__dcloud_weex_postMessage(s) : window
.__dcloud_weex_.postMessage(JSON.stringify(s))
}
var w = {
type: "WEB_INVOKE_APPSERVICE",
args: {
data: i,
webviewIds: t
}
};
window.__dcloud_weex_postMessage ? window.__dcloud_weex_postMessageToService(w) : window
.__dcloud_weex_.postMessageToService(JSON.stringify(w))
} else {
if (!window.plus) return window.parent.postMessage({
type: "WEB_INVOKE_APPSERVICE",
data: i,
pageId: ""
}, "*");
if (0 === t.length) {
var u = plus.webview.currentWebview();
if (!u) throw new Error("plus.webview.currentWebview() is undefined");
var g = u.parent(),
v = "";
v = g ? g.id : u.id, t.push(v)
}
if (plus.webview.getWebviewById("__uniapp__service")) plus.webview.postMessageToUniNView({
type: "WEB_INVOKE_APPSERVICE",
args: {
data: i,
webviewIds: t
}
}, "__uniapp__service");
else {
var c = JSON.stringify(i);
plus.webview.getLaunchWebview().evalJS('UniPlusBridge.subscribeHandler("'.concat(
"WEB_INVOKE_APPSERVICE", '",').concat(c, ",").concat(JSON.stringify(t), ");"))
}
}
},
d = {
navigateTo: function() {
var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {},
n = e.url;
r("navigateTo", {
url: encodeURI(n)
})
},
navigateBack: function() {
var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {},
n = e.delta;
r("navigateBack", {
delta: parseInt(n) || 1
})
},
switchTab: function() {
var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {},
n = e.url;
r("switchTab", {
url: encodeURI(n)
})
},
reLaunch: function() {
var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {},
n = e.url;
r("reLaunch", {
url: encodeURI(n)
})
},
redirectTo: function() {
var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {},
n = e.url;
r("redirectTo", {
url: encodeURI(n)
})
},
getEnv: function(e) {
a() ? e({
uvue: !0
}) : o() ? e({
nvue: !0
}) : window.plus ? e({
plus: !0
}) : e({
h5: !0
})
},
postMessage: function() {
var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {};
r("postMessage", e.data || {})
}
},
s = /uni-app/i.test(navigator.userAgent),
w = /Html5Plus/i.test(navigator.userAgent),
u = /complete|loaded|interactive/;
var g = window.my && navigator.userAgent.indexOf(["t", "n", "e", "i", "l", "C", "y", "a", "p", "i", "l",
"A"].reverse().join("")) > -1;
var v = window.swan && window.swan.webView && /swan/i.test(navigator.userAgent);
var c = window.qq && window.qq.miniProgram && /QQ/i.test(navigator.userAgent) && /miniProgram/i.test(
navigator.userAgent);
var p = window.tt && window.tt.miniProgram && /toutiaomicroapp/i.test(navigator.userAgent);
var _ = window.wx && window.wx.miniProgram && /micromessenger/i.test(navigator.userAgent) && /miniProgram/i
.test(navigator.userAgent);
var m = window.qa && /quickapp/i.test(navigator.userAgent);
var f = window.ks && window.ks.miniProgram && /micromessenger/i.test(navigator.userAgent) && /miniProgram/i
.test(navigator.userAgent);
var l = window.tt && window.tt.miniProgram && /Lark|Feishu/i.test(navigator.userAgent);
var E = window.jd && window.jd.miniProgram && /jdmp/i.test(navigator.userAgent);
var x = window.xhs && window.xhs.miniProgram && /xhsminiapp/i.test(navigator.userAgent);
for (var S, h = function() {
window.UniAppJSBridge = !0, document.dispatchEvent(new CustomEvent("UniAppJSBridgeReady", {
bubbles: !0,
cancelable: !0
}))
}, y = [function(e) {
if (s || w) return window.__uniapp_x_postMessage || window.__uniapp_x_ || window
.__dcloud_weex_postMessage || window.__dcloud_weex_ ? document.addEventListener(
"DOMContentLoaded", e) : window.plus && u.test(document.readyState) ?
setTimeout(e, 0) : document.addEventListener("plusready", e), d
}, function(e) {
if (_) return window.WeixinJSBridge && window.WeixinJSBridge.invoke ? setTimeout(e, 0) :
document.addEventListener("WeixinJSBridgeReady", e), window.wx.miniProgram
}, function(e) {
if (c) return window.QQJSBridge && window.QQJSBridge.invoke ? setTimeout(e, 0) : document
.addEventListener("QQJSBridgeReady", e), window.qq.miniProgram
}, function(e) {
if (g) {
document.addEventListener("DOMContentLoaded", e);
var n = window.my;
return {
navigateTo: n.navigateTo,
navigateBack: n.navigateBack,
switchTab: n.switchTab,
reLaunch: n.reLaunch,
redirectTo: n.redirectTo,
postMessage: n.postMessage,
getEnv: n.getEnv
}
}
}, function(e) {
if (v) return document.addEventListener("DOMContentLoaded", e), window.swan.webView
}, function(e) {
if (p) return document.addEventListener("DOMContentLoaded", e), window.tt.miniProgram
}, function(e) {
if (m) {
window.QaJSBridge && window.QaJSBridge.invoke ? setTimeout(e, 0) : document
.addEventListener("QaJSBridgeReady", e);
var n = window.qa;
return {
navigateTo: n.navigateTo,
navigateBack: n.navigateBack,
switchTab: n.switchTab,
reLaunch: n.reLaunch,
redirectTo: n.redirectTo,
postMessage: n.postMessage,
getEnv: n.getEnv
}
}
}, function(e) {
if (f) return window.WeixinJSBridge && window.WeixinJSBridge.invoke ? setTimeout(e, 0) :
document.addEventListener("WeixinJSBridgeReady", e), window.ks.miniProgram
}, function(e) {
if (l) return document.addEventListener("DOMContentLoaded", e), window.tt.miniProgram
}, function(e) {
if (E) return window.JDJSBridgeReady && window.JDJSBridgeReady.invoke ? setTimeout(e, 0) :
document.addEventListener("JDJSBridgeReady", e), window.jd.miniProgram
}, function(e) {
if (x) return window.xhs.miniProgram
}, function(e) {
return document.addEventListener("DOMContentLoaded", e), d
}], M = 0; M < y.length && !(S = y[M](h)); M++);
S || (S = {});
var P = "undefined" != typeof y_uni ? y_uni : {};
if (!P.navigateTo)
for (var b in S) i(S, b) && (P[b] = S[b]);
return P.webView = S, P
}));
module.exports = y_uni;
DCloud_UNI_OttoJi
你兼容了是吧，感谢反馈。
2025-12-04 19:42
Sam888 (作者)
回复 DCloud_UNI_OttoJi: 是的 解决了 通过我写的这个库 或者把库写到本地引入使用即可 导出使用
// module.exports = y_uni;
export default y_uni;
2025-12-05 08:45