WKWebView、WebView和JS的交互方式詳解
由于Xcode8發(fā)布之后,編譯器開(kāi)始不支持iOS 7了,這樣我們的app也改為最低支持iOS 8.0,既然需要與web交互,那自然也就選擇使用了 iOS 8.0之后 才推出的新控件 WKWebView.
相比與 UIWebView, WKWebView 存在很多優(yōu)勢(shì):
- 支持更多的HTML5的特性
- 高達(dá)60fps滾動(dòng)刷新頻率與內(nèi)置手勢(shì)
- 與Safari相容的JavaScript引擎
- 在性能、穩(wěn)定性方面有很大提升占用內(nèi)存更少 協(xié)議方法及功能都更細(xì)致
- 可獲取加載進(jìn)度等。
UIWebView與JS的交互方式
一,OC調(diào)用JS
直接調(diào)用蘋果提供的API
- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;
使用方式:
OC部分:
[self.webView stringByEvaluatingJavaScriptFromString:@"add(1,2)"];
JS部分:
function add(a,b) {
return a+b;
}
二,JS調(diào)用OC
OC處理JS的時(shí)機(jī)在UIWebView的代理方法內(nèi)
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType;
使用方式:
JS部分:
function btnClick1() {
location.href = "jsCallBack://method_?param1¶m2"
}
OC部分:
NSString *schem = webView.request.URL.scheme;
if ([schem containsString:@"jsCallBack://"]) {
//action...
return NO;
}
WKWebView與JS的交互方式
一,OC調(diào)用JS
調(diào)用蘋果提供的API
- (void)evaluateJavaScript:(NSString *)javaScriptString completionHandler:(void (^ _Nullable)(_Nullable id, NSError * _Nullable error))completionHandler;
使用方式:
OC部分:
[self.wkWebView evaluateJavaScript:@"playSount()" completionHandler:nil];
JS部分:
function playSount() {
//playSount...
}
二,JS調(diào)用OC
OC部分:
這種使用方式比較麻煩一些
1.在創(chuàng)建wkWebView時(shí),需要將被js調(diào)用的方法注冊(cè)進(jìn)去
//創(chuàng)建WKWebViewConfiguration文件 WKWebViewConfiguration *config = [[WKWebViewConfiguration alloc] init]; config.preferences.minimumFontSize = 10.f; [config.userContentController addScriptMessageHandler:self name:@"playSound"]; //創(chuàng)建WKWebView類 WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.bounds configuration:config];
2.在WKScriptMessageHandler代理方法中監(jiān)聽(tīng)js的調(diào)用
#pragma mark - WKScriptMessageHandler
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message {
if ([message.name isEqualToString:@"playSound"]) {
[self playSound];
}
}
JS部分:
//JS響應(yīng)事件
function btnClick() { window.webkit.messageHandlers.playSound.postMessage(null);
}
利用JavaScriptCore庫(kù),WebView與JS的交互
一,OC調(diào)用JS
self.jsContent = [[JSContext alloc] init];
NSString *js = @"function add(a,b) {return a + b}";
[self.jsContent evaluateScript:js];
JSValue *jsValue = [self.jsContent[@"add"] callWithArguments:@[@2,@3]];
二,JS調(diào)用OC
self.jsContent = [[JSContext alloc] init];
self.jsContent[@"add"] = ^(int a, int b){
NSLog(@"a+b = %d",a+b);
};
[self.jsContent evaluateScript:@"add(10,20)"];
三,JS直接訪問(wèn)OC對(duì)象方法與屬性
1.首先定義一個(gè)協(xié)議,這個(gè)協(xié)議遵守JSExport協(xié)議
@protocol JSExportTest <JSExport> @property (nonatomic, assign) NSInteger sum; JSExportAs(add, - (NSInteger)add:(int)a b:(int)b); @end
其中JSExportAs()是系統(tǒng)提供的宏,用來(lái)聲明在JS環(huán)境中方法add與OC環(huán)境中方法- (NSInteger)add:(int)a b:(int)b對(duì)應(yīng)。
2.創(chuàng)建一類,遵守JSExportTest協(xié)議,并實(shí)現(xiàn)它什么的方法與屬性
@interface JSProtolObj : NSObject <JSExportTest>
@end
@implementation JSProtolObj
@synthesize sum = _sum;
- (NSInteger)add:(int)a b:(int)b {
return a+b;
}
- (void)setSum:(NSInteger)sum {
_sum = sum;
}
@end
3.使用方式:
self.jsContent = [[JSContext alloc] init];
self.jsContent.exceptionHandler = ^(JSContext *context, JSValue *exception) {
[JSContext currentContext].exception = exception;
NSLog(@"exception:%@",exception);
};
self.jsContent[@"OCobj"] = self.jsProtolObj;
[self.jsContent evaluateScript:@"OCobj.sum = OCobj.add(10,20)"];
這三種使用方式可以根據(jù)實(shí)際情況進(jìn)行適當(dāng)使用
總結(jié)
以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,如果有疑問(wèn)大家可以留言交流,謝謝大家對(duì)腳本之家的支持。
相關(guān)文章
iOS開(kāi)發(fā)中導(dǎo)航控制器的基本使用教程
這篇文章主要介紹了iOS開(kāi)發(fā)中導(dǎo)航控制器的基本使用教程,代碼基于傳統(tǒng)的Objective-C,需要的朋友可以參考下2015-11-11
iOS App設(shè)計(jì)模式開(kāi)發(fā)中對(duì)interpreter解釋器模式的運(yùn)用
這篇文章主要介紹了iOS App設(shè)計(jì)模式開(kāi)發(fā)中對(duì)interpreter解釋器模式的運(yùn)用,示例為傳統(tǒng)的Objective-C寫成,需要的朋友可以參考下2016-04-04
IOS開(kāi)發(fā)仿微信右側(cè)彈出視圖實(shí)現(xiàn)
這篇文章主要介紹了IOS開(kāi)發(fā)仿微信右側(cè)彈出視圖實(shí)現(xiàn)的相關(guān)資料,希望通過(guò)本文能幫助到大家,讓大家實(shí)現(xiàn)這樣類似的功能,需要的朋友可以參考下2017-10-10
iOS設(shè)置圓角的4種方法實(shí)例(附性能評(píng)測(cè))
這篇文章主要給大家介紹了關(guān)于iOS設(shè)置圓角的4種方法,并給大家附上了性能評(píng)測(cè),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-01-01
iOS實(shí)現(xiàn)自定義購(gòu)物車角標(biāo)顯示購(gòu)物數(shù)量(添加商品時(shí)角標(biāo)抖動(dòng) Vie)
本文主要介紹了iOS實(shí)現(xiàn)自定義購(gòu)物車及角標(biāo)顯示購(gòu)物數(shù)量(添加商品時(shí)角標(biāo)抖動(dòng) Vie)的相關(guān)知識(shí)。具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧2017-04-04
iOS設(shè)計(jì)模式——Category簡(jiǎn)單介紹
這篇文章主要介紹了iOS設(shè)計(jì)模式——Category簡(jiǎn)單介紹,有興趣學(xué)習(xí)的同學(xué)可以了解一下。2016-11-11
詳解IOS 利用storyboard修改UITextField的placeholder文字顏色
這篇文章主要介紹了詳解IOS 利用storyboard修改UITextField的placeholder文字顏色的相關(guān)資料,希望通過(guò)本文能實(shí)現(xiàn)這樣類似的功能,需要的朋友可以參考下2017-08-08
IOS 開(kāi)發(fā)之查看大圖的實(shí)現(xiàn)代碼
這篇文章主要介紹了IOS 開(kāi)發(fā)之查看大圖的實(shí)現(xiàn)代碼的相關(guān)資料,希望通過(guò)本文能幫助到大家,需要的朋友可以參考下2017-10-10

