H5とネイティブアプリのインタラクティブJsBridge

対話の原則にH5ネイティブアプリ

今、多くの場合、そのようjssdkマイクロ手紙などのネイティブアプリ、通信(中のWebViewで実行)、との対話window.wxオブジェクトによっていくつかのネイティブアプリの機能を呼び出す必要があり、サイドWebアプリケーションを動かします。だから、脳卒中に今回のネイティブアプリとの対話の原則とストロークH5。

ネイティブアプリと対話H5は、本質的には、2つの呼び出しです。

  1. アプリコールコードH5

  2. アプリのコードを呼び出すH5

1.アプリ呼番号H5

アプリがホストであるため、あなたはH5で(メソッドを含む)グローバルオブジェクトの数にさらされ、直接この呼び出しは比較的簡単ですので、H5にアクセスして、ネイティブアプリにそれらを呼び出すことができます

ジャバスクリプト

window.sdk = {

  double = value => value * 2,

  triple = value => value * 3,

};

アンドロイド:

webview.evaluateJavascript('window.sdk.double(10)', new ValueCallback<String>() {

  @Override

  public void onReceiveValue(String s) {

    // 20

  }

});

IOS:

NSString *func = @"window.sdk.double(10)";

NSString *str = [webview stringByEvaluatingJavaScriptFromString:func]; // 20

 

アプリのコードを呼び出す2. H5

H5は、直接ホストアプリケーションにアクセスすることはできませんので、ので、このコールは比較的少し複雑です。

これは、一般的に二つの方法で呼び出さ:

  1. jsオブジェクトは、アプリケーションによってグローバルH5を注入し、その後、H5で直接オブジェクトにアクセスすることです

  2. カスタム要求を起動するためのH5合意した後、アプリが要求をインターセプトし、アプリは、コールバック関数を呼び出し、H5

2.1アプリの注入は、グローバルH5の対象とJS

このように、通信メカニズムを理解することは比較的容易で、簡単で、H5のために、それがより推奨される方法で、何も新しいものはありません。しかし、このアプローチは、セキュリティ上のリスクがあり、あなたは、AndroidのWebViewの脆弱性を利用して、詳細ビューではわかりません。

アンドロイド

webview.addJavascriptInterface(new Object() {

  @JavascriptInterface

  public int double(value) {

    return value * 2;

  }

   

  @JavascriptInterface

  public int triple(value) {

    return value * 3;

  }

}, "appSdk");

 

IOS

 

NSString *scripts = @"window.appSdk = {double: value => value * 2, triple: value => value * 3}";

[webview stringByEvaluatingJavaScriptFromString:scripts];

 

ジャバスクリプト

window.appSdk.double(10); // 20

おすすめ

転載: www.cnblogs.com/tu-front-end/p/11301685.html