JsBridge学習

8849 ワード
  • まずWebViewについてお話しします
  • 1追加権限:AndroidManifest.xmlで権限「android.permission.INTERNET」を設定します.そうしないと、Web page not availableエラーが発生します.
  • 2 ActivityでWebViewコンポーネントを生成します.WebView=new WebView(this);あるいはactivityのlayoutファイルにwebviewコントロール
    • を追加することもできます.
  • 3 WebView基本情報の設定:
    • mWebView = (WebView) findViewById(R.id.wb);
mWebView.getSettings().setJavaScriptEnabled(true);// javascript
mWebView.requestFocus();// mWebView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);// 
mWebView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);// js alert 
//load 
mWebView.loadUrl("file:///android_asset/hellotest.html");
//load 
//mWebView.loadUrl("http://www.google.com");
//js android， 
mWebView.addJavascriptInterface(new JsInteration(), "control");
// Alert ， onJsAlert（） return true 
mWebView.setWebChromeClient(new WebChromeClient() {    
@Override    
public boolean onJsAlert(WebView view, String url, String message, JsResult result) {        
//return super.onJsAlert(view, url, message, result);        
Toast.makeText(MainActivity.this, message, Toast.LENGTH_LONG).show();        
return true;  
  }});
  • 4 WevView表示するページを設定:インターネット用:webView.loadUrl("http://www.google.com");ローカルファイル用:webView.loadUrl()file:///android_asset/XX.html");ローカルファイル:assetsファイル**
  • 5リンクをクリックしたい場合は、Androidを新しく開いたシステムbrowserではなく、自分で処理します.WebViewにイベントリスニングオブジェクト(WebView Client)を追加し、その中のいくつかの方法を書き換える:shouldOverrideUrlLoading:Webページのハイパーリンクボタンへの応答.WebViewClientは、接続を押すとこのメソッドを呼び出し、パラメータ
    • を渡す.
       @Override
            public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
                view.loadUrl("");
                return true;
            }
  • 6 httpsリクエストを処理webViewはデフォルトではhttpsリクエストを処理しません.ページに空白が表示されます.
    • を設定する必要があります.
     @Override
            public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
                super.onReceivedSslError(view, handler, error);
                handler.proceed();   //  
//                handler.cancel();  // ， 
//                handler.handleMessage(null); //

    1,Http要求を受信したイベントonReceivedHttpAuthRequest(WebView,HttpAuthHandler handler,String host,String realm)2,ロードページ完了のイベントpublic void onPageFinished(WebView view,String url){}同様に,1ページのロードが完了したことを知り,loadingバーを閉じてプログラム動作を切り替えることができる.3,ロードページ開始のイベントpublic void onPageStarted(WebView,String url,Bitmap favicon){}このイベントはロードページ呼び出しを開始し、通常はここでloadingのページを設定し、ユーザープログラムにネットワーク応答を待っていることを伝えることができます.これらのイベントにより、プログラムの操作を簡単に制御し、ブラウザでコンテンツを表示しながら、ユーザーの操作を監視して、私たちが必要とする様々な表示方式を実現し、ユーザーの誤操作を防止することができます.
  • webviewポイントリンクで多くのページを見た後、何の処理もしない場合は、システム「Back」キーをクリックすると、ブラウザ全体がfinish()を呼び出して自身を終了し、ブラウザを終了するのではなく、閲覧したいページが戻る場合は、現在のActivityでBackイベントを処理して消費する必要があります.Activityクラスを上書きするonKeyDown(int keyCoder,KeyEvent event)メソッド.
    •  @Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
    if(keyCode == KeyEvent.KEYCODE_BACK &&IdWebView.canGoBack()){
        IdWebView.goBack(); // 
        return  true;
    }
    return super.onKeyDown(keyCode, event);
}

    二.Webviewとjsのインタラクション(相互呼び出しパラメータ、伝達値)

            
jaydenxiao webview    

function sayHello() {
alert(" toast") 
}
function alertMessage(message) { 
alert(message)  
}
function toastMessage(message) {
window.control.toastMessage(message)
}
function sumToJava(number1, number2){
window.control.onSumResult(number1 + number2)
}
function sumToJava2(number1, number2) {
return number1 + number2;
}

    呼び出しの例


    js呼び出しjava呼び出しフォーマットはwindowです.jsInterfaceName.MethodName(parameterValue)この例では、注入インタフェース名としてcontrolを使用します.
    function toastMessage(message){
window.control.toastMessage(message)
}
function sumToJava(number1 ,number2){
window.control.onSumResult(number1 +number2)
}

    Java呼び出しJS webview呼び出しjsの基本フォーマットはwebviewである.loadUrl("javascript:methodName(paraameterValues)")
  • android呼び出しjs無パラメトリック戻り値関数
    • final String call = "javacript:sayHello()";
mWebView.post(new Runnable(){
public void run(){
mWebView.loadurl(call);
}
});
  • 2.android呼び出しjs有パラメトリック戻り値関数
    • final String call = "javascript:alertMessage(\""+" android ，hey,man"+"\")"
mWebView.post(new Runnable(){
public void run(){
mWebView.loadUrl(call);
}
})

    -3.android呼び出しjsは、戻り値関数((4.4以上)Android 4.4以上を参照してevaluateJavascriptを使用すればよい.ここでは、戻り値を有するjsメソッドjsコードの簡単なインタラクション例を示します.
    function sumToJava2(number1, number2) {
return number1 + number2;
}

    Androidコードは以下の通りです.
    @TargetApi(Build.VERSION_CODES.KITKAT)
public void Android2JsHaveParmHaveResult2(View view) { 
 mWebView.evaluateJavascript("sumToJava2(3,4)", new ValueCallback() {
@Override 
public void onReceiveValue(String Str) {   
Toast.makeText(getApplicationContext(), " android js (4.4 )， 3 4，js " + Str, Toast.LENGTH_LONG).show(); 
  }    
});}

    最後に、Webviewのメモリ漏洩についてお話しします。

    public void releaseAllWebViewCallback() { 
 if (android.os.Build.VERSION.SDK_INT < 16) { 
 try { 
 Field field = WebView.class.getDeclaredField("mWebViewCore"); 
field = field.getType().getDeclaredField("mBrowserFrame"); 
 field = field.getType().getDeclaredField("sConfigCallback");
field.setAccessible(true); 
 field.set(null, null);
 } catch (NoSuchFieldException e) {
 if (BuildConfig.DEBUG) {
  e.printStackTrace();
  }
 } catch (IllegalAccessException e) {
 if (BuildConfig.DEBUG) {
  e.printStackTrace();
  }
  }
 } else {
 try {
 Field sConfigCallback = Class.forName("android.webkit.BrowserFrame").getDeclaredField("sConfigCallback");
 if (sConfigCallback != null) {
 sConfigCallback.setAccessible(true);
 sConfigCallback.set(null, null);
  }
 } catch (NoSuchFieldException e) {
if (BuildConfig.DEBUG) {
  e.printStackTrace();
  }
 } catch (ClassNotFoundException e) {
 if (BuildConfig.DEBUG) {
  e.printStackTrace();
  }
 } catch (IllegalAccessException e) {
 if (BuildConfig.DEBUG) {
  e.printStackTrace();
  }
  }
  }
 }

    Webviewのdestroyメソッドでこのメソッドを呼び出せばいいです.
    public class WithPhotoWebActivity extends AppCompatActivity{
    private ProgressBar pg;
    private WebView mWebView;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.act_with_photo_webview);
        initView();
    }

    private void initView() {
        pg = (ProgressBar) findViewById(R.id.pg);
        pg.setVisibility(View.VISIBLE);
        mWebView = (WebView) findViewById(R.id.wb);
        mWebView.getSettings().setJavaScriptEnabled(true);
        mWebView.loadUrl("http://m.3gbizhi.com/");
        mWebView.addJavascriptInterface(this,"imagelistner");
        mWebView.setWebViewClient(new MyWebViewClient());
        mWebView.setOnLongClickListener(new View.OnLongClickListener() {
            @Override
            public boolean onLongClick(View view) {
                WebView.HitTestResult result = mWebView.getHitTestResult();
                if(result!=null){
                    int type = result.getType();
                    if(type == WebView.HitTestResult.IMAGE_TYPE ||type == WebView.HitTestResult.SRC_IMAGE_ANCHOR_TYPE){
                        String  imgurl = result.getExtra();
                        Toast.makeText(WithPhotoWebActivity.this, imgurl, Toast.LENGTH_SHORT).show();
                    }
                }
                return true;
            }
        });
    }

    @JavascriptInterface
    public void openImage(String img) {
        System.out.println(img);
        //ShowWebImageActivity.startAction(this,img);
        System.out.println(img);
    }

    private void addImageClickListner(){
        //  js ， img ， onclick ， url 
        mWebView.loadUrl(
                "javascript:(function(){"+
           " var objs = document.getElementsByTagName(\"img\");"+
           " for(var i=0;i
    ローカルで作成されたルールの設定を読み込みます
    ユーティリティタイプ