之前公司項目中UIWebView,涉及到j(luò)s 調(diào)用oc原生方法.WKWebview項目中沒使用,想了解的話,間書中有很多資料. 最近公司的網(wǎng)頁用vue框架,跟之前的稍微有變化,記錄下用到過的
普通的網(wǎng)頁
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div><a href="test01://loadThisTest">test01</a></div>
<div id="test02">test02</div>
<div id="test03">test03</div>
<script>
window.onload = function () {
let temp = document.getElementById("test02");
temp.onclick = function (e) {
if(window.js_obj){
window.js_obj.testJS();
}
}
document.getElementById("test03").onclick = function(){
if(window.js_obj){
window.js_obj.shareTitleDesc("111","222");
}
};
}
</script>
</body>
</html>
1.URL.scheme攔截的方法
在UIWebView的代理方法中根據(jù)URL的scheme判斷
-(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
NSLog(@"urlString---%@",request.URL.absoluteString);
NSLog(@"urlScheme---%@",request.URL.scheme);
return YES;
}
以上代理方法分別打印出
urlString---test01://loadThisTest
urlScheme—test01
2.JavaScriptCore
#import <JavaScriptCore/JavaScriptCore.h>
@protocol JSProtocol <JSExport>
-(void)testJS;
-(void)shareTitle:(NSString *)title Desc:(NSString *)desc;
@end
在項目中引入<JavaScriptCore/JavaScriptCore.h>
自定義協(xié)議,自定義方法
創(chuàng)建UIWebView,設(shè)置代理
@interface Web02ViewController () <UIWebViewDelegate,JSProtocol>
@end
在代理方法中webViewDidFinishLoad設(shè)置JSContext. 其他地方實現(xiàn)方法即可
-(void)webViewDidFinishLoad:(UIWebView *)webView{
JSContext *context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
context[@"js_obj"] = self;
}
#pragma mark - js
-(void)testJS{
NSLog(@"%s,%zd",__FUNCTION__,__LINE__);
}
-(void)shareTitle:(NSString *)title Desc:(NSString *)desc{
NSLog(@"title--%@--desc---%@",title,desc);
}
3.web頁面js
普通的web頁面中
<script>
window.onload = function () {
let temp = document.getElementById("test02");
temp.onclick = function (e) {
if(window.js_obj){
window.js_obj.testJS();
}
}
document.getElementById("test03").onclick = function(){
if(window.js_obj){
window.js_obj.shareTitleDesc("111","222");
}
};
}
</script>
vue.js中相應(yīng)的事件中
js_obj.testJS();
js_obj.shareTitleDesc("111","222");