JSBRIDGE 使用

1.新建一个文件

// import Vue from 'vue';
export const setupWebViewJavascriptBridge = callback => {var u = navigator.userAgent;var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);if (!isiOS) {if (window.WebViewJavascriptBridge) {// eslint-disable-next-line no-undefcallback(WebViewJavascriptBridge);} else {document.addEventListener('WebViewJavascriptBridgeReady',function () {// eslint-disable-next-line no-undefcallback(WebViewJavascriptBridge);},false);}} else {if (window.WebViewJavascriptBridge) {return callback(window.WebViewJavascriptBridge);}if (window.WVJBCallbacks) {return window.WVJBCallbacks.push(callback);}window.WVJBCallbacks = [callback];var WVJBIframe = document.createElement('iframe');WVJBIframe.style.display = 'none';WVJBIframe.src = 'wvjbscheme://__BRIDGE_LOADED__';document.documentElement.appendChild(WVJBIframe);setTimeout(function () {document.documentElement.removeChild(WVJBIframe);}, 0);}
};export const  appUtil={//网点管家下载附件downLoadFn(params){setupWebViewJavascriptBridge(function(bridge){bridge.callHandler('downLoadFn',params)})}
}

2.页面引用

import { appUtil } from "../assets/JSBridge/JSBridge.js";
appUtil.downLoadFn(params)//调用原生方法

JSBRIDGE 使用相关推荐

JSBridge 技术原理分析
- JSBridge的起源 - PhoneGap(Codova 的前身)作为 Hybrid 鼻祖框架,是一个开源的移动开发框架,允许你用标准的web技术-HTML5,CSS3和JavaS ...
为自己搭建一个鹊桥 -- Native Page与Web View之间的JSBridge实现方式
原文:为自己搭建一个鹊桥 -- Native Page与Web View之间的JSBridge实现方式说起JSBridge,大家最熟悉的应该就是微信的WeixinJSBridge,通过它各个公众页面 ...
Android之利用JSBridge库实现Html，JavaScript与Android的所有交互
java 和 js互通框架 WebViewJavascriptBridge是移动UIView和Html交互通信的桥梁,用作者的话来说就是实现java和js的互相调用的桥梁. 替代了WebView的自带 ...
JSBridge深度剖析
概述做过混合开发的人都知道Ionic和PhoneGap之类的框架,这些框架在web基础上包装一层Native,然后通过Bridge技术的js调用本地的库. 在讲JSBridge技术之前,我们来看一下 ...
EasyBridge:一种简单的js-bridge设计方案
EasyBridge是一个简单易用的js-bridge的工具库,提供了日常开发中,JavaScript与Java之间通讯的能力,与其他常见的js-bridge工具库实现方案不同,EasyBridge具 ...
JsBridge Uncaught TypeError: Cannot call method 'callHandler' of undefined, source
h5和原生结合开发app越来越流行.其实就是webview 的js调用native的方法.也就是需要搭建一个桥.这样的桥早就有人搭建好了,那就是jsbridge. git地址: https://git ...
H5与Native交互之JSBridge技术
一.原理篇下面分别介绍IOS和Android与Javascript的底层交互原理 IOS 在讲解原理之前,首先来了解下iOS的UIWebView组件,先来看一下苹果官方的介绍: You can us ...
Atitit.android jsbridge v1新特性
Atitit.android jsbridge v1新特性 1. Java代码调用js并传参其实是通过WebView的loadUrl方法去调用的.只是参数url的写法不一样而已1 2. 三.JAVA ...
jsbridge实现及原理_如何实现一个优雅的jsBridge
什么是jsbridge jsbridge是客户端和H5沟通的桥梁,通过它,我们可以获取部分原生能力,同时客户端也可以使用我们提供的一些方法.实现双向通信. jsbridge原理客户端可以通过webv ...
H5与Native交互之JSBridge技术 1
做过混合开发的很多人都知道Ionic和PhoneGap之类的框架,这些框架在web基础上包了一层Native,然后通过Bridge技术使得js可以调用视频.位置.音频等功能.本文就是介绍这层Bridg ...

JSBRIDGE 使用

JSBRIDGE 使用相关推荐

最新文章

热门文章