[セットトップ]iOS開発-オリジナルJSとOCメソッドに基づいて相互に呼び出し、値を送信(HTMLコード付)

10472 ワード
ios iOS学習資料 JSとOCのインタラクション リソース iOSの一般的な方法
最近、プロジェクトには商品活動インタフェースがあり、web側と値を伝え、ユーザーがホームページでクリックした商品idをクライアントに伝える、つまりjsインタラクションがある.
本稿では,オリジナルのJavaScriptインタラクションをどのように行うかについて述べる.
本文はJSがOC方法を呼び出して値を伝達することを含んで、OCはJS方法を呼び出して値を伝達します
htmlをサーバーに入れてアクセスしようと思ったのですが、htmlをローカルにロードしたほうが理解に役立つと思い、プロジェクトに入れました.

HTMLコード

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<div style="margin-top: 20px">
<h2>JS OC  </h2>
<input type="button" value="      (call)" onclick="tianbai.call()">
</div>
<div>
<input type="button" value="  getCall:(NSString *)callString  " onclick="call()">
</div>

<script> var call = function() { var callInfo = JSON.stringify({"jianshu": "http://www.jianshu.com/users/55c8fdc3c6e7/latest_articles"}); tianbai.getCall(callInfo); } var Callback = function(str) { alert(str); } var alerCallback = function() { alert('  '); } </script>
</body>
</html>

上のhtmlのコード:2つのbuttonを確立しました
最初のbuttonはtianbai.call()メソッドをバインドし、ここでtianbaiはオブジェクトであり、このオブジェクトの役割は以下のOCコードで説明され、tianbai.call()はtianbaiオブジェクト呼び出しcall()メソッドを表す.
2番目のbuttonはcall()の方法をバインドし、呼び出されたのは次のJavaScriptのcall()の方法であり、JavaScriptのcall()の中で、callInfoのパラメータを定義し、方法のtianbai.getCall(callInfo)はtianbaiのオブジェクト呼び出しgetCallの方法を表し、パラメータcallInfoを伝達し、次の2つの方法はOC呼び出しJavaScriptの方法であり、Callbackはstrに戻り、alerCallbackはOCがJavaScriptのみを呼び出す方法である!

OCコード


demoはオリジナルのJavaScriptCoreクラスを採用
3つの名詞を導入します.
  • JSCoext:JavaScriptに実行するコンテキスト環境を提供する
  • JSValue:JavaScriptとObjective-Cデータとメソッドの橋渡し
  • JSFport:これはプロトコルです.プロトコルの方法で対話する場合、自分で定義したプロトコルはこのプロトコル
    • を遵守する必要があります.
    ViewController.hの中のコード(コードが長すぎて、方法の説明はすべて注釈の中にあります)
    #import <UIKit/UIKit.h>
//     
#import <JavaScriptCore/JavaScriptCore.h>

@protocol JSObjcDelegate <JSExport>
//tianbai     JavaScript  ，    ！！！
- (void)call;
- (void)getCall:(NSString *)callString;

@end
@interface ViewController : UIViewController<UIWebViewDelegate,JSObjcDelegate>
@property (nonatomic, strong) JSContext *jsContext;
@property (strong, nonatomic)  UIWebView *webView;

@end

    ViewController.mの中のコード(コードが長すぎて、方法の説明はすべて注釈の中にあります)
    JavaScriptCoreのWebページからオリジナルアプリケーションを呼び出す方法は、DelegateまたはBlockの2つの方法で説明できます.
    WebViewの設定
    self.webView = [[UIWebView alloc]initWithFrame:CGRectMake(0, 20, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height)];
    self.webView.delegate = self;
    //     html  
    NSString* path = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];
    NSURL* url = [NSURL fileURLWithPath:path];
    NSURLRequest* request = [NSURLRequest requestWithURL:url] ;
    [self.webView loadRequest:request];

    [self.view addSubview:self.webView];

    JavaScriptのtianbaiは、オリジナルアプリケーションとwebページの橋渡しとして機能するオブジェクトです.メソッドの呼び出しに使用
    Webviewロード完了コールエージェント
    - (void)webViewDidFinishLoad:(UIWebView *)webView {

      //   javaScriptContext   
    self.jsContext = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
    // tianbai      
    self.jsContext[@"tianbai"] = self;
    self.jsContext.exceptionHandler = ^(JSContext *context, JSValue *exceptionValue) {
        context.exception = exceptionValue;
        NSLog(@"    ：%@", exceptionValue);
    };
}

    オブジェクトを自身に向けると、呼び出しtianbai.call()が次のメソッドに応答し、OCメソッドではjsのCallbackメソッドが呼び出され、値が伝達されます.
    - (void)call{
    NSLog(@"call");
    //      JavaScript   Callback      
    JSValue *Callback = self.jsContext[@"Callback"];
    //   web 
    [Callback callWithArguments:@[@"    OC    "]];
}

    オブジェクトを自分自身に向けると、tianbai.getCall(callInfo)を呼び出すと次のメソッドに応答し、OCメソッドではJavaScriptのalerCallbackメソッドのみが呼び出されます.
    - (void)getCall:(NSString *)callString{
    NSLog(@"Get:%@", callString);
    //     JavaScript   Callback
    JSValue *Callback = self.jsContext[@"alerCallback"];
    [Callback callWithArguments:nil];
}

    オブジェクトを自身に向けるとhtmlにjsを注入することもできます
    - (void)alert{

    //        
    NSString *str = @"alert('OC  JS    ')";
    [self.jsContext evaluateScript:str];

}

    Demoアドレス:ダウンロードをクリック
    文／TianBai(簡書作者)
    テキストリンク:http://www.jianshu.com/p/fd378c6d70c0
    著作権は作者の所有で、転載は作者に連絡して授権を得て、そして“簡書の作者”を表示してください.
    21.09.04
    モジュール反応コンポーネントライブラリを構築する方法