在文件根目录下新建 utils 目录，新建 uni.webview.1.5.2.js ，拷贝代码导入：

<code>!function(e,n){ "object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):(e=e||self).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 t(e,t){ return n.call(e,t)}var i=[],a=function(e,n){ var t={ options:{ timestamp:+new Date},name:e,arg:n};if(window.__dcloud_weex_postMessage||window.__dcloud_weex_){ if("postMessage"===e){ var a={ data:[n]};return window.__dcloud_weex_postMessage?window.__dcloud_weex_postMessage(a):window.__dcloud_weex_.postMessage(JSON.stringify(a))}var o={ type:"WEB_INVOKE_APPSERVICE",args:{ data:t,webviewIds:i}};window.__dcloud_weex_postMessage?window.__dcloud_weex_postMessageToService(o):window.__dcloud_weex_.postMessageToService(JSON.stringify(o))}if(!window.plus)return window.parent.postMessage({ type:"WEB_INVOKE_APPSERVICE",data:t,pageId:""},"*");if(0===i.length){ var r=plus.webview.currentWebview();if(!r)throw new Error("plus.webview.currentWebview() is undefined");var d=r.parent(),s="";s=d?d.id:r.id,i.push(s)}if(plus.webview.getWebviewById("__uniapp__service"))plus.webview.postMessageToUniNView({ type:"WEB_INVOKE_APPSERVICE",args:{ data:t,webviewIds:i}},"__uniapp__service");else{ var w=JSON.stringify(t);plus.webview.getLaunchWebview().evalJS('UniPlusBridge.subscribeHandler("'.concat("WEB_INVOKE_APPSERVICE",'",').concat(w,",").concat(JSON.stringify(i),");"))}},o={ navigateTo:function(){ var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{ },n=e.url;a("navigateTo",{ url:encodeURI(n)})},navigateBack:function(){ var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{ },n=e.delta;a("navigateBack",{ delta:parseInt(n)||1})},switchTab:function(){ var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{ },n=e.url;a("switchTab",{ url:encodeURI(n)})},reLaunch:function(){ var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{ },n=e.url;a("reLaunch",{ url:encodeURI(n)})},redirectTo:function(){ var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{ },n=e.url;a("redirectTo",{ url:encodeURI(n)})},getEnv:function(e){ window.plus?e({ plus:!0}):e({ h5:!0})},postMessage:function(){ var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{ };a("postMessage",e.data||{ })}},r=/uni-app/i.test(navigator.userAgent),d=/Html5Plus/i.test(navigator.userAgent),s=/complete|loaded|interactive/;var w=window.my&&navigator.userAgent.indexOf("AlipayClient")>-1;var u=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 g=window.tt&&window.tt.miniProgram&&/toutiaomicroapp/i.test(navigator.userAgent);var v=window.wx&&window.wx.miniProgram&&/micromessenger/i.test(navigator.userAgent)&&/miniProgram/i.test(navigator.userAgent);var p=window.qa&&/quickapp/i.test(navigator.userAgent);for(var l,_=function(){ window.UniAppJSBridge=!0,document.dispatchEvent(new CustomEvent("UniAppJSBridgeReady",{ bubbles:!0,cancelable:!0}))},f=[function(e){ if(r||d)return window.__dcloud_weex_postMessage||window.__dcloud_weex_?document.addEventListener("DOMContentLoaded",e):window.plus&&s.test(document.readyState)?setTimeout(e,0):document.addEventListener("plusready",e),o},function(e){ if(v)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(w){ 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(u)return document.addEventListener("DOMContentLoaded",e),window.swan.webView},function(e){ if(g)return document.addEventListener("DOMContentLoaded",e),window.tt.miniProgram},function(e){ if(p){ 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){ return document.addEventListener("DOMContentLoaded",e),o}],m=0;m<f.length&&!(l=f[m](_));m++);l||(l={ });var E="undefined"!=typeof uni?uni:{ };if(!E.navigateTo)for(var b in l)t(l,b)&&(E[b]=l[b]);return E.webView=l,E}));code>

打开 main.js 导入 uni.webview.1.5.2.js：

import App from './App'

// #ifndef VUE3

import Vue from 'vue'

import './uni.promisify.adaptor'

// ***************************** 导入 ***************************** //

import * as uni from './utils/uni.webview.1.5.2.js'

document.addEventListener("UniAppJSBridgeReady", function() { // 这里必须更换uni，不然指向有误

Vue.prototype.myUni = uni

});

// *************************************************************** //

Vue.config.productionTip = false

App.mpType = 'app'

const app = new Vue({

...App

})

app.$mount()

// #endif

// #ifdef VUE3

import { createSSRApp } from 'vue'

export function createApp() {

const app = createSSRApp(App)

return {

app

}

}

// #endif

四、页面使用

webview 页面：

<template>

<view>

<web-view @message="message" :src="url"></web-view>code>

</view>

</template>

<script>

export default {

data() {

return {

url: 'http://XXX.XXX.X.XXX:XXXX/?data='

};

},

onLoad() {

let data = [{

name:'测试数据'code>

}]

this.url += encodeURIComponent(JSON.stringify(data))

},

methods: {

// 在小程序中没办法这样轻松获取数据，只有在离开页面、转发、销毁等情况下才可以获取，十分离谱

message(arg) { // 获取 H5 提交参数

console.log(arg)

},

}

};

</script>

H5 页面

<template>

<view @click="sendMessage()"></view>code>

</template>

<script>

export default {

data() {

return {

}

},

mounted() {

let data = this.getQuery('data') // 获取页面信息

console.log('data=============>>>>>>>>', JSON.parse(data));

},

methods: {

//取url中的参数值

getQuery(name) {

// 正则：[找寻'&' + 'url参数名字' = '值' + '&']（'&'可以不存在）

let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");

let r = window.location.search.substr(1).match(reg);

console.log(r);

if (r != null) {

// 对参数值进行解码

return decodeURIComponent(r[2]);

}

return null;

},

sendMessage() { // 提交参数

let that = this;

this.myUni.webView.postMessage({ // 提交参数一定要放在data内

data: {

id: 0,

text: 'Id'

},

});

},

}

}

</script>

五、参考