android與h5之間的互調
阿新 • • 發佈：2018-12-24
android與h5之間的互調
最近android專案中用到了與html之間的互動，總結了一下，還是比較全的，主要有
java呼叫js函式,js呼叫java函式，瀏覽器中通過連結開啟app
- Android和H5互調-java呼叫js
private void initWebView() { WebSettings webSettings = webView.getSettings(); //設定支援javaScript腳步語言 webSettings.setJavaScriptEnabled(true); //支援雙擊-前提是頁面要支援才顯示 webSettings.setUseWideViewPort(true); //支援縮放按鈕-前提是頁面要支援才顯示 webSettings.setBuiltInZoomControls(true); //設定客戶端-不跳轉到預設瀏覽器中 webView.setWebViewClient(new WebViewClient()); //載入網路資源 // webView.loadUrl("http://atguigu.com/teacher.shtml"); //載入本地資源 webView.loadUrl("file:///android_asset/index.html"); setContentView(webView); }
本地檔案位置如圖所示
/**
* Java呼叫javaScript
* @param numebr
*/
private void login(String numebr) {
webView.loadUrl("javascript:javaCallJs("+"'"+numebr+"'"+")");
setContentView(webView);
}
html 中javascript
程式碼如下：
function javaCallJs(){ document.getElementById("content").innerHTML += "<br\>java呼叫了js無參函式"; } function javaCallJs(arg){ document.getElementById("content").innerHTML = ("歡迎："+arg ); }
- Android和H5互調-JavaScript調java
1_配置Javascript介面
//設定支援js呼叫java
webView.addJavascriptInterface(new AndroidAndJSInterface(),"Android");//此處"Android"字串要與下面的onclick中"window.Android.showToast()"的Android字串保持一致
2_實現Javascript介面類
/** * js可以呼叫該類的方法 */ class AndroidAndJSInterface{ @JavascriptInterface public void showToast( ){ Toast.makeText(JavaAndJSActivity.this, "我被js呼叫了", Toast.LENGTH_SHORT).show(); } }
html程式碼：
<input type="button" value="點選Android被呼叫" onclick="window.Android.showToast()" />
當點選webview內嵌網頁時該按鈕時，就可以呼叫java中的showToast函數了,
當然showToast函式也可以攜帶引數:
<input type="button" value="點選Android被呼叫" onclick="window.Android.showToast('JS中傳來的引數')" class="ButtonInput"/>
/**
* js可以呼叫該類的方法
*/
class AndroidAndJSInterface{
@JavascriptInterface
public void showToast( ){
Toast.makeText(JavaAndJSActivity.this, "我被js呼叫了", Toast.LENGTH_SHORT).show();
}
public void showToast( String mString){
Toast.makeText(JavaAndJSActivity.this, "我被js呼叫了"+mString, Toast.LENGTH_SHORT).show();
}
}
- Android實現通過瀏覽器點選連結開啟本地應用（APP）並拿到瀏覽器傳遞的資料
1_首先在編寫一個簡單的html頁面
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>title</title>
</head>
<body>
<a href="mame1://name2/">開啟app</a>
</body>
</html>
2_在Android本地app的配置
在AndroidManifest的清單檔案裡的intent-filte中加入如下元素：
name1與name2要對應相同
程式碼如下：
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data
android:host="name2"
android:scheme="name1"/>
</intent-filter>
3_如何通過這個方法獲取網頁帶過來的資料
傳資料的方式
<a href="mame1://mame2/?arg0=0&arg1=1">開啟app</a><br/>
（1）.通過瀏覽器開啟這個網頁的，那麼獲取資料的方式為：
Uri uri = getIntent().getData();
String test1= uri.getQueryParameter("arg0");
String test2= uri.getQueryParameter("arg1");
（2）如果使用webview訪問該網頁，獲取資料的操作為：
複製程式碼
webView.setWebViewClient(new WebViewClient(){
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
Uri uri=Uri.parse(url);
if(uri.getScheme().equals("name1")&&uri.getHost().equals("name2")){
String arg0=uri.getQueryParameter("arg0");
String arg1=uri.getQueryParameter("arg1");
}else{
view.loadUrl(url);
}
return true;
}
});