JS与NATIVE交互

实现JS和Native有两种方式:

• shouldOverrideUrlLoading(WebView view, String url）
• js与java互相调用

先来说一下第一种方式shouldOverrideUrlLoading(WebView view, String url）

通过给WebView加一个事件监听对象（WebViewClient)并重写shouldOverrideUrlLoading(WebView view, String url）方法。当按下某个连接时WebViewClient会调用这个方法，并传递参数view和url

开始第二种.JS和Java互调

如何实现java和js互调

1. WebView开启JavaScript脚本执行
2. WebView设置供JavaScript调用的交互接口
3. 客户端和网页端编写调用对方的代码

JS调用JAVA
JS : window.jsInterfaceName.methodName(parameterValues)
native: webView.addJavascriptInterface(new JsInteration(), “androidNative”);

下面给出一个实例,方便理解

<code class="hljs java has-numbering">webView.addJavascriptInterface(<span class="hljs-keyword">new</span> JsInteration(), “androidNative”);
<span class="hljs-annotation">@JavascriptInterface</span>
<span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title">helloJS</span>(){…}</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li></ul>

<code class="hljs avrasm has-numbering">window<span class="hljs-preprocessor">.androidNative</span><span class="hljs-preprocessor">.helloJS</span>()<span class="hljs-comment">;</span></code><ul style="display: block;" class="pre-numbering"><li>1</li></ul>

Java调用JS

webView调用js的基本格式为webView.loadUrl(“javascript:methodName(parameterValues)”)

• 调用js无参无返回值函数： String call =“javascript:sayHello()”；webView.loadUrl(call);
• 调用js有参无返回值函数：String call = “javascript:alertMessage(\”” + “content” + “\”)”; webView.loadUrl(call);
• 调用js有参数有返回值的函数
  Android在4.4之前并没有提供直接调用js函数并获取值的方法，所以在此之前，常用的思路是 java调用js方法，js方法执行完毕，再次调用java代码将值返回。
  Android 4.4之后使用evaluateJavascript即可。

<code class="hljs cs has-numbering"><span class="hljs-keyword">private</span> <span class="hljs-keyword">void</span> <span class="hljs-title">testEvaluateJavascript</span>(WebView webView) {
  webView.evaluateJavascript(<span class="hljs-string">"getGreetings()"</span>, <span class="hljs-keyword">new</span> ValueCallback<String>() {
  @Override
  <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title">onReceiveValue</span>(String <span class="hljs-keyword">value</span>) {
      Log.i(LOGTAG, <span class="hljs-string">"onReceiveValue value="</span> + <span class="hljs-keyword">value</span>);
  }});
}</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li></ul>

注:

1. 参数类型如果是简单的int或String，可以直接传，对于复杂的数据类型，建议以字符串形式的json返回。
2. evaluateJavascript方法必须在UI线程（主线程）调用，因此onReceiveValue也执行在主线程。

当native与js交互时存cookie看到很多人遇到过这样一个问题,cookie存不进去,网上有很多解释方案,但是很多没说到重点上,这里直接贴一下代码:

<code class="hljs avrasm has-numbering">public static void synCookies(Context context, String url, String version) {
        CookieSyncManager<span class="hljs-preprocessor">.createInstance</span>(context)<span class="hljs-comment">;</span>
        CookieManager cookieManager = CookieManager<span class="hljs-preprocessor">.getInstance</span>()<span class="hljs-comment">;</span>
        cookieManager<span class="hljs-preprocessor">.setAcceptCookie</span>(true)<span class="hljs-comment">;</span>
        cookieManager<span class="hljs-preprocessor">.removeAllCookie</span>()<span class="hljs-comment">;</span>
        cookieManager<span class="hljs-preprocessor">.setCookie</span>(url, <span class="hljs-string">"sessionKey="</span> + UserInfoShareprefrence<span class="hljs-preprocessor">.getInstance</span>(context)<span class="hljs-preprocessor">.getLocalSessionKey</span>())<span class="hljs-comment">;</span>
        cookieManager<span class="hljs-preprocessor">.setCookie</span>(url, <span class="hljs-string">"productVersion=android-epocket-v"</span> + version)<span class="hljs-comment">;</span>
        CookieSyncManager<span class="hljs-preprocessor">.getInstance</span>()<span class="hljs-preprocessor">.sync</span>()<span class="hljs-comment">;</span>

    }</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li><li>8</li><li>9</li><li>10</li></ul>

存不进去的很大一部分原因是你的url不多,他官方给出的解释是这样的

<code class="hljs applescript has-numbering"> /**
     * Sets a cookie <span class="hljs-keyword">for</span> <span class="hljs-keyword">the</span> <span class="hljs-keyword">given</span> URL. Any existing cookie <span class="hljs-keyword">with</span> <span class="hljs-keyword">the</span> same host,
     * path <span class="hljs-keyword">and</span> <span class="hljs-property">name</span> will be replaced <span class="hljs-keyword">with</span> <span class="hljs-keyword">the</span> new cookie. The cookie being <span class="hljs-keyword">set</span>
     * will be ignored <span class="hljs-keyword">if</span> <span class="hljs-keyword">it</span> <span class="hljs-keyword">is</span> expired.
     *
     * @param url <span class="hljs-keyword">the</span> URL <span class="hljs-keyword">for</span> which <span class="hljs-keyword">the</span> cookie <span class="hljs-keyword">is</span> <span class="hljs-keyword">to</span> be <span class="hljs-keyword">set</span>
     * @param value <span class="hljs-keyword">the</span> cookie <span class="hljs-keyword">as</span> a <span class="hljs-type">string</span>, using <span class="hljs-keyword">the</span> format <span class="hljs-keyword">of</span> <span class="hljs-keyword">the</span> 'Set-Cookie'
     *              HTTP response header
     */
    public void setCookie(String url, String value) {
        throw new MustOverrideException();
    }</code><ul style="display: block;" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li><li>8</li><li>9</li><li>10</li><li>11</li><li>12</li></ul>

其实没说明白url到底是什么,这里的url就是显示的url的域名,这里顺便贴出取域名的方法,给出的是通过正则提取域名

<code class="hljs java has-numbering">    <span class="hljs-javadoc">/**
     * 获得域名
     *
     *<span class="hljs-javadoctag"> @param</span> url
     *<span class="hljs-javadoctag"> @return</span>
     */</span>
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">static</span> String <span class="hljs-title">getDomain</span>(String url) {
        Pattern p = Pattern.compile(<span class="hljs-string">"[^//]*?\\.(com|cn|net|org|biz|info|cc|tv)"</span>, Pattern.CASE_INSENSITIVE);
        Matcher matcher = p.matcher(url);
        matcher.find();
        <span class="hljs-keyword">return</span> matcher.group();
    }</code>