iOS之JavaScript与OC的相互调用:webview 的使用

最新推荐文章于 2022-03-23 21:04:10 发布

liyubao160

最新推荐文章于 2022-03-23 21:04:10 发布

阅读量531

点赞数

分类专栏： iOS/oc

本文链接：https://blog.csdn.net/u011146511/article/details/51277897

版权

iOS/oc 专栏收录该内容

369 篇文章 6 订阅

订阅专栏

问题解决：https://github.com/ShingoFukuyama/WKWebViewTips/blob/master/README.md

webview：===================================

index.html中的代码

<body>

<br />

<ahref="http://www.baidu.com">百度</a><br />

<ahref="itcast:///showMessage:/zhangsan">调用oc方法</a><br />

<ahref="itcast:///share:/aa">分享</a><br />

<divid="container">

</div>

<scriptsrc="dfjUpdate.js"></script>

var game = window.dfjGame("lala","机器人","container" , false);

//game.chessboard.drawPlanes();

</script>

</body>

=================

OC中调用JavaScript代码

- (void)viewDidLoad {

[superviewDidLoad];

// Do any additional setup after loading the view, typically from a nib.

//oc调用js的代码

//加载本地网页

NSURL *url = [[NSBundlemainBundle]URLForResource:@"index.html"withExtension:nil];

NSURLRequest *request = [NSURLRequestrequestWithURL:url];

//设置webView缩放内容

self.webView.scalesPageToFit =YES;

//自动检测电话/邮箱/网址

self.webView.dataDetectorTypes = UIDataDetectorTypeAll;

//设置webView的代理

self.webView.delegate =self;

[self.webViewloadRequest:request];

}

//网页加载完毕,调用js代码

- (void)webViewDidFinishLoad:(UIWebView *)webView {

//执行js

[self.webViewstringByEvaluatingJavaScriptFromString:

@"game.chessboard.drawPlanes();"];

//获取js方法的返回值

NSString *title = [self.webViewstringByEvaluatingJavaScriptFromString:

@"test();"];

NSLog(@"%@",title);

}

==========================================================

JavaScript调用OC

js中:

<a href="lambo:///showmesage:/zhangsan">调用OC方法</a>

lambo是自定义协议;自定义协议这里是三条"/",show message是方法;zhangsan是参数;

<a href="share:///share:/aa">分享</a>

oc中:

#import"ViewController.h"

@interfaceViewController () <UIWebViewDelegate>

@property (weak,nonatomic)IBOutletUIWebView *webView;

@end

@implementation ViewController

- (void)viewDidLoad {

[superviewDidLoad];

// Do any additional setup after loading the view, typically from a nib.

//加载本地网页

NSURL *url = [[NSBundlemainBundle]URLForResource:@"index.html"withExtension:nil];

NSURLRequest *request = [NSURLRequestrequestWithURL:url];

//设置webView的代理

self.webView.delegate =self;

[self.webViewloadRequest:request];

}

//2********************************* js调用oc-------方法一：在将要发送请求前截取url；然后做相应的处理；

//当将要发送请求之前执行

---将要发送请求前截获url

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {

//判断当前访问的地址的协议是否是自定义协议(itcast)

// request.URL.scheme//获取地址中的协议

// NSLog(@"%@",request.URL.scheme);

if ([request.URL.schemeisEqualToString:@"itcast"]) {

//调用oc中的方法

// itcast://showMessage:/zhangsan

// request.URL.pathComponents //路径中所有的部分

// NSLog(@"%@",request.URL.pathComponents);

//获取方法名字

NSString *methodName = request.URL.pathComponents[1];

//获取方法的参数

NSString *param = request.URL.pathComponents[2];

//把字符串转换成SEL

SEL selector =NSSelectorFromString(methodName);

//判断当前方法是否存在

if ([selfrespondsToSelector:selector]) {

//忽略警告

#pragma clang diagnostic push

#pragma clang diagnostic ignored "-Warc-performSelector-leaks"

//调用方法

[selfperformSelector:selectorwithObject:param];

#pragma mark diagnostic pop

}

return NO;

}

//返回yes.继续执行当前的请求

//返回no.不执行后续的请求

returnYES;

}

- (void)showMessage:(NSString *)param {

NSLog(@"%@",param);

}

****************************js调用OC方法2：在HTML中，是js对象调用方法，使用下面的方法；

使用第二种和第三种方式时需要加入JavaScriptCore.framework，如果项目要求支持ios7.0之前的需要做兼容
从iOS7开始苹果公布了JavaScriptCore.framework 它使得JS与OC的交互更加方便了。

参考：JavaScriptCore实现js调用OC

http://blog.csdn.net/jason_chen13/article/details/53542488-------js调用OC的三种方法

http://www.jianshu.com/p/86a1b69bc9a6

http://blog.csdn.net/horisea/article/details/52191573

#import <Foundation/Foundation.h>

#import <JavaScriptCore/JavaScriptCore.h>

//凡事添加了JSExport协议的协议，所规定的方法，变量等就会对js开放，我们可以通过js调用到

@protocol WofusdjjsObjectProtocol <JSExport>

- (void)hideOverlayLayout;//这里的方法要和js中的对应WebInterface.hideOverlayLayout,WebInterface是js中的一个对象

- (void)finish:(NSString *)result;//这个对应js中中的WebInterface.finish("字符串参数");

@end

@interface WofusdjjsObject :NSObject<WofusdjjsObjectProtocol>

///定义block，上面的协议中定义了几种方法，这里就定义几个block，以便在webView中的didfinish方法中回调实现js要调用的OC方法

@property (nonatomic,copy)void(^hideOverlayLayoutBlock)();

@property (nonatomic,copy)void(^finishBlock)();

@end

*********

#import "WofusdjjsObject.h"

@implementation WofusdjjsObject

//实现协议中和js对应的OC方法，

- (void)hideOverlayLayout{

NSLog(@"开始");

dispatch_async(dispatch_get_main_queue(), ^{

self.hideOverlayLayoutBlock();//调用个block，以便实现调用OC的方法，注意如果涉及到UI的要在主线程中调用block

});

}

- (void)finish:(NSString *)result{

NSLog(@"结束");

dispatch_async(dispatch_get_main_queue(), ^{

self.finishBlock();

});

}

@end

*************

#import <UIKit/UIKit.h>

#import <JavaScriptCore/JavaScriptCore.h>

@interface Wofuquxianwebview : UIViewController

@property(nonatomic,strong)NSDictionary *credDisct;

@property(nonatomic,strong)NSString *amount;

@end

*************

#import "Wofuquxianwebview.h"

#import "WofusdjjsObject.h"

@interface Wofuquxianwebview ()<UIWebViewDelegate>//,WKUIDelegate,WKNavigationDelegate,WKScriptMessageHandler

@property(nonatomic,copy)NSString *jsCode;

@property(nonatomic,strong)UIWebView *web;

//@property(nonatomic,strong)WKWebView *wkweb;

//@property(nonatomic,assign)NSInteger index;

@property(nonatomic,strong)JSContext *context;

@end

@implementation Wofuquxianwebview

- (void)viewDidLoad {

[superviewDidLoad];

[selfaddbackBtn];

// [self hideOverlayLayout];

self.navigationItem.title=@"";

self.edgesForExtendedLayout=UIRectEdgeNone;

self.automaticallyAdjustsScrollViewInsets=NO;

self.view.backgroundColor=[UIColorwhiteColor];

}

-(void)webviewwith:(NSString *)htmlStr{

UIWebView *web=[[UIWebViewalloc]initWithFrame:CGRectMake(0, 0,WIDTH , HEIGHT-64)];

web.delegate=self;

self.web=web;

[self.viewaddSubview:web];

[web loadHTMLString:htmlStrbaseURL:nil];

}

-(void)webViewDidFinishLoad:(UIWebView *)webView{

//首先创建JSContext对象（此处通过当前webView的键获取到jscontext）

self.context=[webViewvalueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];

//js是通过对象调用的，我们假设js里面有一个对象 WebInterface 在调用方法

//首先创建我们新建类的对象，将他赋值给js的对象

WofusdjjsObject *sdkjsobject=[[WofusdjjsObjectalloc]init];

sdkjsobject.hideOverlayLayoutBlock = ^{

[selfhideOverlayLayout];

NSLog(@"遮盖");

};

sdkjsobject.finishBlock = ^{

NSLog(@"结束");

[selffinish];

};

self.context[@"WebInterface"] = sdkjsobject;//WebInterface是js中的一个对象，吧自定的sdkjsobject对象赋值给js的对象，这样就可以js调用OC的方法了

//标识IOS

[self.webstringByEvaluatingJavaScriptFromString:@"window.agent = 'ios';"];

[self.webstringByEvaluatingJavaScriptFromString:self.jsCode];//执行js

}

-(void)hideOverlayLayout{

// NSLog(@"js调用OC方法实现了");

[selfsetMBProgresWithStr:@"loading..."];

}

-(void)finish{

[MBProgressHUDhideAllHUDsForView:self.viewanimated:YES];

}

-(void)setMBProgresWithStr:(NSString *)str{

MBProgressHUD *hud=[MBProgressHUDshowHUDAddedTo:self.viewanimated:YES];

hud.labelText=str;

hud.color=[UIColorcolorWithWhite:0.8 alpha:0.6];

hud.mode=MBProgressHUDModeDeterminate;

hud.animationType=MBProgressHUDAnimationZoomIn;

hud.minSize=self.view.frame.size;

hud.color=[UIColorgrayColor];

}

************************js调用oc方法3：HTML中直接使用js的方法，不是对象调用js方法，

-(void)webViewDidFinishLoad:(UIWebView *)webView
{
//网页加载完成调用此方法

//首先创建JSContext 对象（此处通过当前webView的键获取到jscontext）
JSContext *context=[webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];

//js调用iOS
//第一种情况
//其中test1就是js的方法名称，赋给是一个block 里面是iOS代码
//此方法最终将打印出所有接收到的参数，js参数是不固定的我们测试一下就知道
context[@"test1"] = ^() {
NSArray *args = [JSContext currentArguments];
for (id obj in args) {
NSLog(@"%@",obj);
}
};
//此处我们没有写后台（但是前面我们已经知道iOS是可以调用js的，我们模拟一下）
//首先准备一下js代码，来调用js的函数test1 然后执行
//一个参数
NSString *jsFunctStr=@"test1('参数1')";
[context evaluateScript:jsFunctStr];

//二个参数
NSString *jsFunctStr1=@"test1('参数a','参数b')";
[context evaluateScript:jsFunctStr1];

}

========在当前控制器中使用js调用oc，

#import <JavaScriptCore/JavaScriptCore.h>
@property(nonatomic,strong)JSContext *context;

-(void)jsUSEocfirst{
    
    self.context = [[JSContext alloc]init];
//    注册一个block对象给JS用：
    self.context[@"add"] = ^(NSInteger a, NSInteger b) {
        NSLog(@"---%@",@(a + b));
    };
    
    [self.context evaluateScript:@"add(2,3)"];

}
-(void)jsUSEocSec{
    self.context = [[JSContext alloc] init];
//    利用currentArguments获取参数：
    self.context[@"log"] = ^() {
        NSArray *args = [JSContext currentArguments];
        for (id obj in args) { NSLog(@"%@",obj); }
    };
    
    //使用js调用objc
    [self.context evaluateScript:@"log('hello,i am js side')"];

    
}

==========javascript调用OC实例===================

********HTML端的代码：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script>
        window.onload = function () {
            // 判断设备
            var u = navigator.userAgent;
            var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
            var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
            var timer = null;
            if (isAndroid) { // android
                window.android.cashout();
            }
            if (isIOS) { // ios
                // alert('开启定时器');
                var timer = setInterval(function () {
                    if (cashout) {
                        // alert('函数加载完成');
                        clearInterval(timer);
                        cashout();
                    }
                }, 100);
            }
        }
    </script>
</body>
</html>

IOS端的代码：

-(void)setWebviewWithurlStr:(NSString *)urlStr{

    UIWebView *web=[[UIWebView alloc]initWithFrame:CGRectMake(0, 0, WIDTH, HEIGHT-64)];

    if(HEIGHT==812){

        web=[[UIWebView alloc]initWithFrame:CGRectMake(0, 0, WIDTH, HEIGHT-88-34)];

    }

    self.web=web;

    web.delegate=self;

//    web.UIDelegate=self;

//        web.navigationDelegate=self;

    [self.view addSubview:web];

    NSURL *url=[NSURL URLWithString:urlStr];

    NSURLRequest *request=[NSURLRequest requestWithURL:url];

    [web loadRequest:request];

}



- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {

    self.index++;

    if(self.index==2){

        //这个是返回的url是第二个HTML代码。

        NSString *url=[NSString stringWithContentsOfURL:request.URL encoding:NSUTF8StringEncoding error:nil];

        NSLog(@"--url ---%@",url);

       [self.web loadHTMLString:url baseURL:nil];//注意：这里面有两个url，第一个url是webView启动就加载，这一个url需要自己去加载

                }

          return YES;

}

-(void)webViewDidFinishLoad:(UIWebView *)webView{

    [[LYCommonMBprogresshud sharedManager]dimisAnimalProgressWith:self.view];

   

    JSContext *context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];

    context[@"cashout"]=^(){//cashout是HTML中的方法

        NSLog(@"HTML执行了");

            };

    }

-(void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error{

        NSLog(@"error---%@",error);

}