Android WebView和JS交互详细教程

我们的态度是：每天进步一点点，理想终会被实现。

前言

Android webview和JS的交互已经是老生常谈了，坑很多、问题也很多。即使再多的坑，我们很多情况下还是要使用，毕竟直接嵌入HTML可以节省开发成本、节约开发时间，以及之前很火的Android和H5混合开发。因此，今天我写了一篇Android WebView和JS交互的详细教程，以及我们的WebView我们真是项目中都有哪些坑，或者说哪些问题BUG。

WebView和JS交互

---

1.android webview 调用Java方法

WebView调用Java方法主要分为三个步骤：

• 允许WebView加载JS代码
• 编写JS的接口类，供JS调用

• 给WebView添加JS接口

  • MainActivity代码：
    `

public class MainActivity extends AppCompatActivity implements IJsBridge {
   
   private WebView mWebView;
   private TextView textView;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_main);
       mWebView = findViewById(R.id.webview);
       textView = findViewById(R.id.result);
       initView();
   }

   @SuppressLint("SetJavaScriptEnabled")
   private void initView() {
       //1.允许WebView加载JS代码
       mWebView.getSettings().setJavaScriptEnabled(true);
       //2.编写JS接口
       JStoJava jStoJava = new JStoJava(this);
       //3.WebView添加JS接口  传递JsToJava的对象jsToJava
       mWebView.addJavascriptInterface(jStoJava, "jsToJava");
       mWebView.loadUrl("file:///android_asset/index.html");
   }

   /**
    * 这个方法在子线程
    *
    * @param values
    */
   @Override
   public void setTextView(final String values) {
       runOnUiThread(new Runnable() {
           @Override
           public void run() {
               //切换到主线程执行
               textView.setText(values);
           }
       });
   }
}

• 编写JS的接口类，供JS调