国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看

前言

參考來(lái)源

前人栽樹(shù),后臺(tái)乘涼,本文參考了以下來(lái)源

• JSBridge-Web與Native交互之iOS篇
• Ios Android Hybrid app 與 Js Bridge
• Hybrid APP架構(gòu)設(shè)計(jì)思路
• Android4.2下 WebView的addJavascriptInterface漏洞解決方案
• WebView---Android與js交互實(shí)例

前置技術(shù)要求

閱讀本文前，建議先閱讀以下文章

• Hybrid APP基礎(chǔ)篇(一)->什么是Hybrid App

楔子

Hybrid APP的關(guān)鍵是原生頁(yè)面與H5頁(yè)面直接的交互,本文做簡(jiǎn)單介紹

Android、iOS原生和H5的基本通信機(jī)制

在Hybrid APP中,原生與H5的交互方式在Android和iOS上的實(shí)現(xiàn)是有異同的,原因是Android、iOS的通信機(jī)制有所區(qū)別,下面介紹原生和H5相互調(diào)用的方法

Android端

Native調(diào)JS

4.4版本之前

// mWebView = new WebView(this); //即當(dāng)前webview對(duì)象			mWebView.loadUrl("javascript: 方法名('參數(shù),需要轉(zhuǎn)為字符串')"); //ui線(xiàn)程中運(yùn)行 runOnUiThread(new Runnable() {          @Override          public void run() {              mWebView.loadUrl("javascript: 方法名('參數(shù),需要轉(zhuǎn)為字符串')");              Toast.makeText(Activity名.this, "調(diào)用方法...", Toast.LENGTH_SHORT).show();          }  });  			

4.4以后(包括4.4)

//異步執(zhí)行JS代碼,并獲取返回值	mWebView.evaluateJavascript("javascript: 方法名('參數(shù),需要轉(zhuǎn)為字符串')", new ValueCallback() {        @Override        public void onReceiveValue(String value) {    		//這里的value即為對(duì)應(yīng)JS方法的返回值        }});			

如上所示,Native用H5頁(yè)面中的JS方法,有如下特點(diǎn)

• 4.4之前Native通過(guò)loadUrl來(lái)調(diào)用JS方法,只能讓某個(gè)JS方法執(zhí)行,但是無(wú)法獲取該方法的返回值
• 4.4之后,通過(guò)evaluateJavascript異步調(diào)用JS方法,并且能在onReceiveValue中拿到返回值
• 不適合傳輸大量數(shù)據(jù)(大量數(shù)據(jù)建議用接口方式獲取)
• mWebView.loadUrl("javascript: 方法名('參數(shù),需要轉(zhuǎn)為字符串')");函數(shù)需在UI線(xiàn)程運(yùn)行，因?yàn)閙WebView為UI控件(但是有一個(gè)壞處是會(huì)阻塞UI線(xiàn)程)

JS調(diào)Native

 WebSettings webSettings = mWebView.getSettings();   //Android容器允許JS腳本，必須要webSettings.setJavaScriptEnabled(true);//Android容器設(shè)置僑連對(duì)象mWebView.addJavascriptInterface(getJSBridge(), "JSBridge");			

Android中JSBridge的代碼

//Android4.2版本以上，本地方法要加上注解@JavascriptInterface，否則會(huì)找不到方法。private Object getJSBridge(){      Object insertObj = new Object(){      	@JavascriptInterface        public String foo(){              return "foo";          }                  @JavascriptInterface        public String foo2(final String param){              return "foo2:" + param;          }                };      return insertObj;  }  			

Html中JS調(diào)用原生的代碼

//調(diào)用方法一window.JSBridge.foo(); //返回:'foo'//調(diào)用方法二window.JSBridge.foo2('test');//返回:'foo2:test'			

如上所示,Native中通過(guò)addJavascriptInterface添加暴露出來(lái)的JS橋?qū)ο?然后再該對(duì)象內(nèi)部聲明對(duì)應(yīng)的API方法,有如下特點(diǎn):

• 在Android4.2以上(api17后),暴露的api要加上注解@JavascriptInterface，否則會(huì)找不到方法。
• 在api17以前,addJavascriptInterface有風(fēng)險(xiǎn),hacker可以通過(guò)反編譯獲取Native注冊(cè)的Js對(duì)象，然后在頁(yè)面通過(guò)反射Java的內(nèi)置 靜態(tài)類(lèi)，獲取一些敏感的信息和破壞

  所以,也就是為什么Android中也會(huì)使用JSBridge來(lái)進(jìn)行交互,而不是addJavascriptInterface直接暴露api

• JS能調(diào)用到已經(jīng)暴露的api,并且能得到相應(yīng)返回值

iOS端

Native調(diào)JS

//可以取得JS函數(shù)執(zhí)行的返回值//方法必須是Html頁(yè)面綁定在最頂層的window上對(duì)象的//如window.top.foo//Swiftwebview.stringByEvaluatingJavaScriptFromString("方法名(參數(shù))")//OC[webView stringByEvaluatingJavaScriptFromString:@"方法名(參數(shù));"];			

如上所示,Native通過(guò)stringByEvaluatingJavaScriptFromString調(diào)用Html綁定在window上的函數(shù),有如下特點(diǎn)

• Native調(diào)用JS方法時(shí),能拿到JS方法的返回值
• 不適合傳輸大量數(shù)據(jù)(大量數(shù)據(jù)建議用接口方式獲取)

JS調(diào)Native

引入官方的庫(kù)文件

#import <JavaScriptCore/JavaScriptCore.h>

Native注冊(cè)api函數(shù)(OC)

//webview加載完畢后設(shè)置一些js接口-(void)webViewDidFinishLoad:(UIWebView *)webView{    [self hideProgress];    [self setJSInterface];}-(void)setJSInterface{        JSContext *context =[_wv valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];        // 注冊(cè)名為foo的api方法    context[@"foo"] = ^() {    	    	//獲取參數(shù)        NSArray *args = [JSContext currentArguments];        NSString *title = [NSString stringWithFormat:@"%@",[args objectAtIndex:0]];        //做一些自己的邏輯        //返回一個(gè)值  'foo:'+title        return [NSString stringWithFormat:@"foo:%@", title];    };        }							

Html中JS調(diào)用原生的代碼

//調(diào)用方法,用top是確保調(diào)用到最頂級(jí),因?yàn)閕frame要用top才能拿到頂級(jí)window.top.foo('test'); //返回:'foo:test'			

如上所示,Native中通過(guò)引入官方提供的JavaScriptCore庫(kù)(iOS7中出現(xiàn)的),然后可以將api綁定到JSContext上(然后Html中JS默認(rèn)通過(guò)window.top.***可調(diào)用)。有如下特點(diǎn)

• iOS7才出現(xiàn)這種方式,在這之前,js無(wú)法直接調(diào)用Native,只能通過(guò)JSBridge方式簡(jiǎn)介調(diào)用
• JS能調(diào)用到已經(jīng)暴露的api,并且能得到相應(yīng)返回值
• iOS原生本身是無(wú)法被JS調(diào)用的,但是通過(guò)引入官方提供的第三方"JavaScriptCore",即可開(kāi)放api給JS調(diào)用

原生和H5的另一種通訊方式:JSBridge

實(shí)際上,Native與H5通信,除了前面提到的用基本方法外,還有一種廣為流行的方法:JSBridge

什么是JSBridge

JSBridge是廣為流行的Hybrid開(kāi)發(fā)中JS和Native一種通信方式,各大公司的應(yīng)用中都有用到這種方法

簡(jiǎn)單的說(shuō),JSBridge就是定義Native和JS的通信,Native只通過(guò)一個(gè)固定的橋?qū)ο笳{(diào)用JS,JS也只通過(guò)固定的橋?qū)ο笳{(diào)用Native,基本原理是:

H5->通過(guò)某種方式觸發(fā)一個(gè)url->Native捕獲到url,進(jìn)行分析->原生做處理->Native調(diào)用H5的JSBridge對(duì)象傳遞回調(diào)。如下圖

上圖簡(jiǎn)單的介紹了下JSBridge的核心原理,具體詳細(xì)實(shí)現(xiàn)請(qǐng)參考后面詳解。

為什么要用JSBridge

在上文中我們有提到Native和原生之間的基本通信,既然Native和原生已經(jīng)能夠?qū)崿F(xiàn)通信了,那為什么還要這種通過(guò)url scheme的JSBridge方式呢,原因大致如下

• Android4.2以下,addJavascriptInterface方式有安全漏掉
• iOS7以下,JS無(wú)法調(diào)用Native
• url scheme交互方式是一套現(xiàn)有的成熟方案,可以完美兼容各種版本,不存在上述問(wèn)題

另外,請(qǐng)注意,可以理解為JSBridge是一種交互理念,而上述的url scheme則是其中的一種實(shí)現(xiàn),所以也就是說(shuō),就算后面實(shí)現(xiàn)變?yōu)榱薬ddJavascriptInterface,JavaScriptCore,也一樣是JSBridge交互

JSBridge交互的一個(gè)很大特點(diǎn)就是便于拓展,而且沒(méi)有重大的安全性問(wèn)題,所以也就是為什么它廣為流行

JSBridge原理以及實(shí)現(xiàn)

JSBridge的原理和實(shí)現(xiàn)請(qǐng)參考 JSBridge實(shí)現(xiàn)原理