diff --git a/examples/mpx-webview/H5/webviewbridge.min.js b/examples/mpx-webview/H5/webviewbridge.min.js index 850fb03c1..1b7e32115 100644 --- a/examples/mpx-webview/H5/webviewbridge.min.js +++ b/examples/mpx-webview/H5/webviewbridge.min.js @@ -3,4 +3,4 @@ * (c) 2024 @mpxjs team * @license Apache */ -var e,a;e=this,a=function(){"use strict";var e,a,o,t,n=Object.assign({wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},my:{url:"https://appx/web-view.min.js"},swan:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://lf3-cdn-tos.bytegoofy.com/obj/goofy/developer/jssdk/jssdk-1.2.1.js"}},window.sdkUrlMap),i=null,r=0,c=(o=location.href,(t=/mpx_webview_id=(\d+)/g.exec(o))&&t[1]&&(a=+t[1]),a),s={},d=function(e){var a=e.data,o=a;try{"string"==typeof a&&(o=JSON.parse(a))}catch(e){}var t=o,n=t.callbackId,i=t.error,r=t.result;void 0!==n&&s[n]&&(i?s[n](i):s[n](null,r),delete s[n])},g=navigator.userAgent;g.indexOf("AlipayClient")>-1&&g.indexOf("MiniProgram")>-1?i="my":g.toLowerCase().indexOf("miniprogram")>-1?i=g.indexOf("QQ")>-1?"qq":"wx":g.indexOf("swan/")>-1?i="swan":g.indexOf("toutiao")>-1&&(i="tt"),window.ReactNativeWebView?(i="rn",g.toLowerCase().indexOf("ios")>-1?window.addEventListener("message",d,!1):document.addEventListener("message",d,!1)):(i="web",window.addEventListener("message",d,!1));var w=!1;function p(a){w?a():e.then((function(){w=!0,a()}))}var l={config:function(e){"wx"===i?p((function(){window.wx&&window.wx.config(e)})):console.warn("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};function m(e){for(var a=arguments.length,o=new Array(a>1?a-1:0),t=1;t1&&void 0!==arguments[1]?arguments[1]:{},o=a.time,t=void 0===o?5e3:o,n=a.crossOrigin,i=void 0!==n&&n;function r(){return new Promise((function(a,o){var t=document.createElement("script");t.type="text/javascript",t.async="async",i&&(t.crossOrigin="anonymous"),t.onload=t.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(a(),t.onload=t.onreadystatechange=null)},t.onerror=function(){o(new Error("load ".concat(e," error"))),t.onerror=null},t.src=e,document.getElementsByTagName("head")[0].appendChild(t)}))}function c(){return new Promise((function(a,o){setTimeout((function(){o(new Error("load ".concat(e," timeout")))}),t)}))}return Promise.race([r(),c()])}(n[i].url):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk")):Promise.resolve(),v(),l},"object"==typeof exports&&"undefined"!=typeof module?module.exports=a():"function"==typeof define&&define.amd?define(a):(e=e||self).mpx=a(); \ No newline at end of file +var e,a;e=this,a=function(){"use strict";var e,a,o,t,n=Object.assign({wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},my:{url:"https://appx/web-view.min.js"},swan:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://lf3-cdn-tos.bytegoofy.com/obj/goofy/developer/jssdk/jssdk-1.2.1.js"}},window.sdkUrlMap),i=null,r=0,c=(o=location.href,(t=/mpx_webview_id=(\d+)/g.exec(o))&&t[1]&&(a=+t[1]),a),s={},d=function(e){var a=e.callbackId,o=e.error,t=e.result;void 0!==a&&s[a]&&(o?s[a](o):s[a](null,t),delete s[a])},g=navigator.userAgent;g.indexOf("AlipayClient")>-1&&g.indexOf("MiniProgram")>-1?i="my":g.toLowerCase().indexOf("miniprogram")>-1?i=g.indexOf("QQ")>-1?"qq":"wx":g.indexOf("swan/")>-1?i="swan":g.indexOf("toutiao")>-1&&(i="tt"),window.ReactNativeWebView?(i="rn",window.mpxWebviewMessageCallback=d):(i="web",window.addEventListener("message",(function(e){var a=e.data,o=a;try{"string"==typeof a&&(o=JSON.parse(a))}catch(e){}d(o)}),!1));var w=!1;function p(a){w?a():e.then((function(){w=!0,a()}))}var l={config:function(e){"wx"===i?p((function(){window.wx&&window.wx.config(e)})):console.warn("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};function v(e){for(var a=arguments.length,o=new Array(a>1?a-1:0),t=1;t1&&void 0!==arguments[1]?arguments[1]:{},o=a.time,t=void 0===o?5e3:o,n=a.crossOrigin,i=void 0!==n&&n;function r(){return new Promise((function(a,o){var t=document.createElement("script");t.type="text/javascript",t.async="async",i&&(t.crossOrigin="anonymous"),t.onload=t.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(a(),t.onload=t.onreadystatechange=null)},t.onerror=function(){o(new Error("load ".concat(e," error"))),t.onerror=null},t.src=e,document.getElementsByTagName("head")[0].appendChild(t)}))}function c(){return new Promise((function(a,o){setTimeout((function(){o(new Error("load ".concat(e," timeout")))}),t)}))}return Promise.race([r(),c()])}(n[i].url):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk")):Promise.resolve(),m(),l},"object"==typeof exports&&"undefined"!=typeof module?module.exports=a():"function"==typeof define&&define.amd?define(a):(e=e||self).mpx=a(); \ No newline at end of file diff --git a/packages/webpack-plugin/lib/runtime/components/react/mpx-web-view.tsx b/packages/webpack-plugin/lib/runtime/components/react/mpx-web-view.tsx index fd6a89340..787c94a3d 100644 --- a/packages/webpack-plugin/lib/runtime/components/react/mpx-web-view.tsx +++ b/packages/webpack-plugin/lib/runtime/components/react/mpx-web-view.tsx @@ -111,6 +111,12 @@ const _WebView = forwardRef, WebViewProps>((pr } true; ` + const sendMessage = function(params: string) { + return ` + window.mpxWebviewMessageCallback(${params}) + true; + ` + } const _changeUrl = function (navState: WebViewNavigation) { if (navState.navigationType) { // navigationType这个事件在页面开始加载时和页面加载完成时都会被触发所以判断这个避免其他无效触发执行该逻辑 currentPage.__webViewUrl = navState.url @@ -182,21 +188,21 @@ const _WebView = forwardRef, WebViewProps>((pr asyncCallback && asyncCallback.then((res: any) => { if (webViewRef.current?.postMessage) { - const test = JSON.stringify({ + const result = JSON.stringify({ type, callbackId: data.callbackId, result: res }) - webViewRef.current.postMessage(test) + webViewRef.current.injectJavaScript(sendMessage(result)) } }).catch((error: any) => { if (webViewRef.current?.postMessage) { - const test = JSON.stringify({ + const result = JSON.stringify({ type, callbackId: data.callbackId, error }) - webViewRef.current.postMessage(test) + webViewRef.current.injectJavaScript(sendMessage(result)) } }) } diff --git a/packages/webview-bridge/dist/webviewbridge.esm.browser.js b/packages/webview-bridge/dist/webviewbridge.esm.browser.js index a04123e05..64dbd2ee4 100644 --- a/packages/webview-bridge/dist/webviewbridge.esm.browser.js +++ b/packages/webview-bridge/dist/webviewbridge.esm.browser.js @@ -75,6 +75,19 @@ let env = null; let callbackId = 0; const clientUid = getMpxWebViewId(); const callbacks = {}; + +const runCallback = (msgData) => { + const { callbackId, error, result } = msgData; + if (callbackId !== undefined && callbacks[callbackId]) { + if (error) { + callbacks[callbackId](error); + } else { + callbacks[callbackId](null, result); + } + delete callbacks[callbackId]; + } +}; + const eventListener = (event) => { // 接收web-view的回调 const data = event.data; @@ -85,15 +98,7 @@ const eventListener = (event) => { } } catch (e) { } - const { callbackId, error, result } = msgData; - if (callbackId !== undefined && callbacks[callbackId]) { - if (error) { - callbacks[callbackId](error); - } else { - callbacks[callbackId](null, result); - } - delete callbacks[callbackId]; - } + runCallback(msgData); }; // 环境判断逻辑 @@ -108,11 +113,7 @@ if (systemUA.indexOf('AlipayClient') > -1 && systemUA.indexOf('MiniProgram') > - env = 'tt'; } if (window.ReactNativeWebView) { env = 'rn'; - if (systemUA.toLowerCase().indexOf('ios') > -1) { - window.addEventListener('message', eventListener, false); - } else { - document.addEventListener('message', eventListener, false); // 安卓机接收消息 - } + window.mpxWebviewMessageCallback = runCallback; } else { env = 'web'; window.addEventListener('message', eventListener, false); diff --git a/packages/webview-bridge/dist/webviewbridge.esm.browser.min.js b/packages/webview-bridge/dist/webviewbridge.esm.browser.min.js index 56d5d53f0..f92a85d54 100644 --- a/packages/webview-bridge/dist/webviewbridge.esm.browser.min.js +++ b/packages/webview-bridge/dist/webviewbridge.esm.browser.min.js @@ -3,4 +3,4 @@ * (c) 2024 @mpxjs team * @license Apache */ -let e;const o=Object.assign({wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},my:{url:"https://appx/web-view.min.js"},swan:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://lf3-cdn-tos.bytegoofy.com/obj/goofy/developer/jssdk/jssdk-1.2.1.js"}},window.sdkUrlMap);let a=null,t=0;const n=function(){const e=location.href,o=/mpx_webview_id=(\d+)/g.exec(e);let a;return o&&o[1]&&(a=+o[1]),a}(),i={},s=e=>{const o=e.data;let a=o;try{"string"==typeof o&&(a=JSON.parse(o))}catch(e){}const{callbackId:t,error:n,result:s}=a;void 0!==t&&i[t]&&(n?i[t](n):i[t](null,s),delete i[t])},r=navigator.userAgent;r.indexOf("AlipayClient")>-1&&r.indexOf("MiniProgram")>-1?a="my":r.toLowerCase().indexOf("miniprogram")>-1?a=r.indexOf("QQ")>-1?"qq":"wx":r.indexOf("swan/")>-1?a="swan":r.indexOf("toutiao")>-1&&(a="tt"),window.ReactNativeWebView?(a="rn",r.toLowerCase().indexOf("ios")>-1?window.addEventListener("message",s,!1):document.addEventListener("message",s,!1)):(a="web",window.addEventListener("message",s,!1));let c=!1;function d(o){c?o():e.then(()=>{c=!0,o()})}const g={config(e){"wx"===a?d(()=>{window.wx&&window.wx.config(e)}):console.warn("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};const w=()=>{const e={wx:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","postMessage","getEnv"]},tt:{keyName:"miniProgram",api:["redirectTo","navigateTo","switchTab","reLaunch","navigateBack","setSwipeBackModeSync","postMessage","getEnv","checkJsApi","chooseImage","compressImage","previewImage","uploadFile","getNetworkType","openLocation","getLocation"]},swan:{keyName:"webView",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]},qq:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]}}[a]||{},o={wx:["checkJSApi","chooseImage","previewImage","uploadImage","downloadImage","getLocalImgData","startRecord","stopRecord","onVoiceRecordEnd","playVoice","pauseVoice","stopVoice","onVoicePlayEnd","uploadVoice","downloadVoice","translateVoice","getNetworkType","openLocation","getLocation","startSearchBeacons","stopSearchBeacons","onSearchBeacons","scanQRCode","chooseCard","addCard","openCard"],my:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","chooseImage","previewImage","getLocation","openLocation","alert","showLoading","hideLoading","getNetworkType","startShare","tradePay","postMessage","onMessage","getEnv"],swan:["makePhoneCall","setClipboardData","getNetworkType","openLocation","getLocation","chooseLocation","chooseImage","previewImage","openShare","navigateToSmartProgram"],web:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage","getLoadError","getLocation","invoke"],rn:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage","getLoadError","getLocation","invoke"],tt:[]}[a]||[];(e.api||[]).forEach(o=>{g[o]=(...t)=>{d(()=>{window[a][e.keyName][o](...t)})}}),o.forEach(e=>{g[e]=(...o)=>{"web"===a||"rn"===a?function(e,...o){"invoke"===e&&(e=o[0],o=o.slice(1));const a=o[0]||{};if("getEnv"!==e){const s=++t;i[s]=(e,o)=>{e?(a.fail&&a.fail(e),a.complete&&a.complete(e)):(a.success&&a.success(o),a.complete&&a.complete(o)),delete i[s]};const r={type:e,callbackId:t,args:o};void 0!==n&&(r.clientUid=n),window.ReactNativeWebView?window.ReactNativeWebView.postMessage&&window.ReactNativeWebView.postMessage(JSON.stringify(r)):window.parent.postMessage&&window.parent.postMessage(JSON.stringify(r),"*")}else a({webapp:!0})}(e,...o):d("wx"===a?()=>{window[a]&&window[a].ready(()=>{window[a][e](...o)})}:()=>{window[a][e](...o)})}})};e="web"!==a&&"rn"!==a?o[a].url?function(e,{time:o=5e3,crossOrigin:a=!1}={}){return Promise.race([new Promise((o,t)=>{const n=document.createElement("script");n.type="text/javascript",n.async="async",a&&(n.crossOrigin="anonymous"),n.onload=n.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(o(),n.onload=n.onreadystatechange=null)},n.onerror=function(){t(new Error(`load ${e} error`)),n.onerror=null},n.src=e,document.getElementsByTagName("head")[0].appendChild(n)}),new Promise((a,t)=>{setTimeout(()=>{t(new Error(`load ${e} timeout`))},o)})])}(o[a].url):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk")):Promise.resolve(),w();export default g; \ No newline at end of file +let e;const o=Object.assign({wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},my:{url:"https://appx/web-view.min.js"},swan:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://lf3-cdn-tos.bytegoofy.com/obj/goofy/developer/jssdk/jssdk-1.2.1.js"}},window.sdkUrlMap);let a=null,t=0;const n=function(){const e=location.href,o=/mpx_webview_id=(\d+)/g.exec(e);let a;return o&&o[1]&&(a=+o[1]),a}(),i={},s=e=>{const{callbackId:o,error:a,result:t}=e;void 0!==o&&i[o]&&(a?i[o](a):i[o](null,t),delete i[o])},r=e=>{const o=e.data;let a=o;try{"string"==typeof o&&(a=JSON.parse(o))}catch(e){}s(a)},c=navigator.userAgent;c.indexOf("AlipayClient")>-1&&c.indexOf("MiniProgram")>-1?a="my":c.toLowerCase().indexOf("miniprogram")>-1?a=c.indexOf("QQ")>-1?"qq":"wx":c.indexOf("swan/")>-1?a="swan":c.indexOf("toutiao")>-1&&(a="tt"),window.ReactNativeWebView?(a="rn",window.mpxWebviewMessageCallback=s):(a="web",window.addEventListener("message",r,!1));let d=!1;function g(o){d?o():e.then(()=>{d=!0,o()})}const w={config(e){"wx"===a?g(()=>{window.wx&&window.wx.config(e)}):console.warn("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};const p=()=>{const e={wx:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","postMessage","getEnv"]},tt:{keyName:"miniProgram",api:["redirectTo","navigateTo","switchTab","reLaunch","navigateBack","setSwipeBackModeSync","postMessage","getEnv","checkJsApi","chooseImage","compressImage","previewImage","uploadFile","getNetworkType","openLocation","getLocation"]},swan:{keyName:"webView",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]},qq:{keyName:"miniProgram",api:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage"]}}[a]||{},o={wx:["checkJSApi","chooseImage","previewImage","uploadImage","downloadImage","getLocalImgData","startRecord","stopRecord","onVoiceRecordEnd","playVoice","pauseVoice","stopVoice","onVoicePlayEnd","uploadVoice","downloadVoice","translateVoice","getNetworkType","openLocation","getLocation","startSearchBeacons","stopSearchBeacons","onSearchBeacons","scanQRCode","chooseCard","addCard","openCard"],my:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","chooseImage","previewImage","getLocation","openLocation","alert","showLoading","hideLoading","getNetworkType","startShare","tradePay","postMessage","onMessage","getEnv"],swan:["makePhoneCall","setClipboardData","getNetworkType","openLocation","getLocation","chooseLocation","chooseImage","previewImage","openShare","navigateToSmartProgram"],web:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage","getLoadError","getLocation","invoke"],rn:["navigateTo","navigateBack","switchTab","reLaunch","redirectTo","getEnv","postMessage","getLoadError","getLocation","invoke"],tt:[]}[a]||[];(e.api||[]).forEach(o=>{w[o]=(...t)=>{g(()=>{window[a][e.keyName][o](...t)})}}),o.forEach(e=>{w[e]=(...o)=>{"web"===a||"rn"===a?function(e,...o){"invoke"===e&&(e=o[0],o=o.slice(1));const a=o[0]||{};if("getEnv"!==e){const s=++t;i[s]=(e,o)=>{e?(a.fail&&a.fail(e),a.complete&&a.complete(e)):(a.success&&a.success(o),a.complete&&a.complete(o)),delete i[s]};const r={type:e,callbackId:t,args:o};void 0!==n&&(r.clientUid=n),window.ReactNativeWebView?window.ReactNativeWebView.postMessage&&window.ReactNativeWebView.postMessage(JSON.stringify(r)):window.parent.postMessage&&window.parent.postMessage(JSON.stringify(r),"*")}else a({webapp:!0})}(e,...o):g("wx"===a?()=>{window[a]&&window[a].ready(()=>{window[a][e](...o)})}:()=>{window[a][e](...o)})}})};e="web"!==a&&"rn"!==a?o[a].url?function(e,{time:o=5e3,crossOrigin:a=!1}={}){return Promise.race([new Promise((o,t)=>{const n=document.createElement("script");n.type="text/javascript",n.async="async",a&&(n.crossOrigin="anonymous"),n.onload=n.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(o(),n.onload=n.onreadystatechange=null)},n.onerror=function(){t(new Error(`load ${e} error`)),n.onerror=null},n.src=e,document.getElementsByTagName("head")[0].appendChild(n)}),new Promise((a,t)=>{setTimeout(()=>{t(new Error(`load ${e} timeout`))},o)})])}(o[a].url):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk")):Promise.resolve(),p();export default w; \ No newline at end of file diff --git a/packages/webview-bridge/dist/webviewbridge.esm.js b/packages/webview-bridge/dist/webviewbridge.esm.js index 3c43d88e2..26c4a50cf 100644 --- a/packages/webview-bridge/dist/webviewbridge.esm.js +++ b/packages/webview-bridge/dist/webviewbridge.esm.js @@ -75,6 +75,19 @@ var env = null; var callbackId = 0; var clientUid = getMpxWebViewId(); var callbacks = {}; +var runCallback = function runCallback(msgData) { + var callbackId = msgData.callbackId, + error = msgData.error, + result = msgData.result; + if (callbackId !== undefined && callbacks[callbackId]) { + if (error) { + callbacks[callbackId](error); + } else { + callbacks[callbackId](null, result); + } + delete callbacks[callbackId]; + } +}; var eventListener = function eventListener(event) { // 接收web-view的回调 var data = event.data; @@ -84,18 +97,7 @@ var eventListener = function eventListener(event) { msgData = JSON.parse(data); } } catch (e) {} - var _msgData = msgData, - callbackId = _msgData.callbackId, - error = _msgData.error, - result = _msgData.result; - if (callbackId !== undefined && callbacks[callbackId]) { - if (error) { - callbacks[callbackId](error); - } else { - callbacks[callbackId](null, result); - } - delete callbacks[callbackId]; - } + runCallback(msgData); }; // 环境判断逻辑 @@ -111,11 +113,7 @@ if (systemUA.indexOf('AlipayClient') > -1 && systemUA.indexOf('MiniProgram') > - } if (window.ReactNativeWebView) { env = 'rn'; - if (systemUA.toLowerCase().indexOf('ios') > -1) { - window.addEventListener('message', eventListener, false); - } else { - document.addEventListener('message', eventListener, false); // 安卓机接收消息 - } + window.mpxWebviewMessageCallback = runCallback; } else { env = 'web'; window.addEventListener('message', eventListener, false); diff --git a/packages/webview-bridge/dist/webviewbridge.js b/packages/webview-bridge/dist/webviewbridge.js index 6332a7eee..69a0c35c5 100644 --- a/packages/webview-bridge/dist/webviewbridge.js +++ b/packages/webview-bridge/dist/webviewbridge.js @@ -81,6 +81,19 @@ var callbackId = 0; var clientUid = getMpxWebViewId(); var callbacks = {}; + var runCallback = function runCallback(msgData) { + var callbackId = msgData.callbackId, + error = msgData.error, + result = msgData.result; + if (callbackId !== undefined && callbacks[callbackId]) { + if (error) { + callbacks[callbackId](error); + } else { + callbacks[callbackId](null, result); + } + delete callbacks[callbackId]; + } + }; var eventListener = function eventListener(event) { // 接收web-view的回调 var data = event.data; @@ -90,18 +103,7 @@ msgData = JSON.parse(data); } } catch (e) {} - var _msgData = msgData, - callbackId = _msgData.callbackId, - error = _msgData.error, - result = _msgData.result; - if (callbackId !== undefined && callbacks[callbackId]) { - if (error) { - callbacks[callbackId](error); - } else { - callbacks[callbackId](null, result); - } - delete callbacks[callbackId]; - } + runCallback(msgData); }; // 环境判断逻辑 @@ -117,11 +119,7 @@ } if (window.ReactNativeWebView) { env = 'rn'; - if (systemUA.toLowerCase().indexOf('ios') > -1) { - window.addEventListener('message', eventListener, false); - } else { - document.addEventListener('message', eventListener, false); // 安卓机接收消息 - } + window.mpxWebviewMessageCallback = runCallback; } else { env = 'web'; window.addEventListener('message', eventListener, false); diff --git a/packages/webview-bridge/dist/webviewbridge.min.js b/packages/webview-bridge/dist/webviewbridge.min.js index 850fb03c1..1b7e32115 100644 --- a/packages/webview-bridge/dist/webviewbridge.min.js +++ b/packages/webview-bridge/dist/webviewbridge.min.js @@ -3,4 +3,4 @@ * (c) 2024 @mpxjs team * @license Apache */ -var e,a;e=this,a=function(){"use strict";var e,a,o,t,n=Object.assign({wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},my:{url:"https://appx/web-view.min.js"},swan:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://lf3-cdn-tos.bytegoofy.com/obj/goofy/developer/jssdk/jssdk-1.2.1.js"}},window.sdkUrlMap),i=null,r=0,c=(o=location.href,(t=/mpx_webview_id=(\d+)/g.exec(o))&&t[1]&&(a=+t[1]),a),s={},d=function(e){var a=e.data,o=a;try{"string"==typeof a&&(o=JSON.parse(a))}catch(e){}var t=o,n=t.callbackId,i=t.error,r=t.result;void 0!==n&&s[n]&&(i?s[n](i):s[n](null,r),delete s[n])},g=navigator.userAgent;g.indexOf("AlipayClient")>-1&&g.indexOf("MiniProgram")>-1?i="my":g.toLowerCase().indexOf("miniprogram")>-1?i=g.indexOf("QQ")>-1?"qq":"wx":g.indexOf("swan/")>-1?i="swan":g.indexOf("toutiao")>-1&&(i="tt"),window.ReactNativeWebView?(i="rn",g.toLowerCase().indexOf("ios")>-1?window.addEventListener("message",d,!1):document.addEventListener("message",d,!1)):(i="web",window.addEventListener("message",d,!1));var w=!1;function p(a){w?a():e.then((function(){w=!0,a()}))}var l={config:function(e){"wx"===i?p((function(){window.wx&&window.wx.config(e)})):console.warn("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};function m(e){for(var a=arguments.length,o=new Array(a>1?a-1:0),t=1;t1&&void 0!==arguments[1]?arguments[1]:{},o=a.time,t=void 0===o?5e3:o,n=a.crossOrigin,i=void 0!==n&&n;function r(){return new Promise((function(a,o){var t=document.createElement("script");t.type="text/javascript",t.async="async",i&&(t.crossOrigin="anonymous"),t.onload=t.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(a(),t.onload=t.onreadystatechange=null)},t.onerror=function(){o(new Error("load ".concat(e," error"))),t.onerror=null},t.src=e,document.getElementsByTagName("head")[0].appendChild(t)}))}function c(){return new Promise((function(a,o){setTimeout((function(){o(new Error("load ".concat(e," timeout")))}),t)}))}return Promise.race([r(),c()])}(n[i].url):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk")):Promise.resolve(),v(),l},"object"==typeof exports&&"undefined"!=typeof module?module.exports=a():"function"==typeof define&&define.amd?define(a):(e=e||self).mpx=a(); \ No newline at end of file +var e,a;e=this,a=function(){"use strict";var e,a,o,t,n=Object.assign({wx:{url:"https://res.wx.qq.com/open/js/jweixin-1.3.2.js"},qq:{url:"https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"},my:{url:"https://appx/web-view.min.js"},swan:{url:"https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.4.js"},tt:{url:"https://lf3-cdn-tos.bytegoofy.com/obj/goofy/developer/jssdk/jssdk-1.2.1.js"}},window.sdkUrlMap),i=null,r=0,c=(o=location.href,(t=/mpx_webview_id=(\d+)/g.exec(o))&&t[1]&&(a=+t[1]),a),s={},d=function(e){var a=e.callbackId,o=e.error,t=e.result;void 0!==a&&s[a]&&(o?s[a](o):s[a](null,t),delete s[a])},g=navigator.userAgent;g.indexOf("AlipayClient")>-1&&g.indexOf("MiniProgram")>-1?i="my":g.toLowerCase().indexOf("miniprogram")>-1?i=g.indexOf("QQ")>-1?"qq":"wx":g.indexOf("swan/")>-1?i="swan":g.indexOf("toutiao")>-1&&(i="tt"),window.ReactNativeWebView?(i="rn",window.mpxWebviewMessageCallback=d):(i="web",window.addEventListener("message",(function(e){var a=e.data,o=a;try{"string"==typeof a&&(o=JSON.parse(a))}catch(e){}d(o)}),!1));var w=!1;function p(a){w?a():e.then((function(){w=!0,a()}))}var l={config:function(e){"wx"===i?p((function(){window.wx&&window.wx.config(e)})):console.warn("\u975e\u5fae\u4fe1\u73af\u5883\u4e0d\u9700\u8981\u914d\u7f6econfig")}};function v(e){for(var a=arguments.length,o=new Array(a>1?a-1:0),t=1;t1&&void 0!==arguments[1]?arguments[1]:{},o=a.time,t=void 0===o?5e3:o,n=a.crossOrigin,i=void 0!==n&&n;function r(){return new Promise((function(a,o){var t=document.createElement("script");t.type="text/javascript",t.async="async",i&&(t.crossOrigin="anonymous"),t.onload=t.onreadystatechange=function(){this.readyState&&!/^(loaded|complete)$/.test(this.readyState)||(a(),t.onload=t.onreadystatechange=null)},t.onerror=function(){o(new Error("load ".concat(e," error"))),t.onerror=null},t.src=e,document.getElementsByTagName("head")[0].appendChild(t)}))}function c(){return new Promise((function(a,o){setTimeout((function(){o(new Error("load ".concat(e," timeout")))}),t)}))}return Promise.race([r(),c()])}(n[i].url):Promise.reject(new Error("\u672a\u627e\u5230\u5bf9\u5e94\u7684sdk")):Promise.resolve(),m(),l},"object"==typeof exports&&"undefined"!=typeof module?module.exports=a():"function"==typeof define&&define.amd?define(a):(e=e||self).mpx=a(); \ No newline at end of file diff --git a/packages/webview-bridge/src/index.js b/packages/webview-bridge/src/index.js index 11571c103..f469ff53d 100644 --- a/packages/webview-bridge/src/index.js +++ b/packages/webview-bridge/src/index.js @@ -31,6 +31,19 @@ let env = null let callbackId = 0 const clientUid = getMpxWebViewId() const callbacks = {} + +const runCallback = (msgData) => { + const { callbackId, error, result } = msgData + if (callbackId !== undefined && callbacks[callbackId]) { + if (error) { + callbacks[callbackId](error) + } else { + callbacks[callbackId](null, result) + } + delete callbacks[callbackId] + } +} + const eventListener = (event) => { // 接收web-view的回调 const data = event.data @@ -41,15 +54,7 @@ const eventListener = (event) => { } } catch (e) { } - const { callbackId, error, result } = msgData - if (callbackId !== undefined && callbacks[callbackId]) { - if (error) { - callbacks[callbackId](error) - } else { - callbacks[callbackId](null, result) - } - delete callbacks[callbackId] - } + runCallback(msgData) } // 环境判断逻辑 @@ -64,11 +69,7 @@ if (systemUA.indexOf('AlipayClient') > -1 && systemUA.indexOf('MiniProgram') > - env = 'tt' } if (window.ReactNativeWebView) { env = 'rn' - if (systemUA.toLowerCase().indexOf('ios') > -1) { - window.addEventListener('message', eventListener, false) - } else { - document.addEventListener('message', eventListener, false) // 安卓机接收消息 - } + window.mpxWebviewMessageCallback = runCallback } else { env = 'web' window.addEventListener('message', eventListener, false)