目錄:
image
Android通過WebView調用 JS代碼
通過WebView的loadUrl()
點擊Android按鈕彤侍,即調用WebView JS(文本名為javascript)中callJS()
步驟1:將需要調用的JS代碼以.html格式放到src/main/assets文件夾里
需要加載JS代碼:xxxx.html
'<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Carson_Ho</title>
// JS代碼
<script>
// Android需要調用的方法
function callJS(){
alert("Android調用了JS的callJS方法");
}
</script>
</head>
</html>'
步驟2:在Android里通過WebView設置調用JS代碼
Android代碼:MainActivity.java
public class MainActivity extends AppCompatActivity {
WebView mWebView;
Button button;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mWebView =(WebView) findViewById(R.id.webview);
WebSettings webSettings = mWebView.getSettings();
// 設置與Js交互的權限
webSettings.setJavaScriptEnabled(true);
// 設置允許JS彈窗
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
// 先載入JS代碼
// 格式規(guī)定為:file:///android_asset/文件名.html
mWebView.loadUrl("file:///android_asset/xxxx.html");
button = (Button) findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 注意調用的JS方法名要對應上
// 調用javascript的callJS()方法
mWebView.loadUrl("javascript:callJS()");
});
}
JS通過WebView調用 Android 代碼
以.html格式放到src/main/assets文件夾里
步驟1:在JS約定所需要的Url協議
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Carson_Ho</title>
<script>
function callAndroid(){
/*約定的url協議為:js://webview?arg1=111&arg2=222*/
document.location = "js://webview?arg1=111&arg2=222";
}
</script>
</head>
<!-- 點擊按鈕則調用callAndroid()方法 -->
<body>
<button type="button" id="button1" onclick="callAndroid()">點擊調用Android代碼</button>
</body>
</html>
步驟2:在Android通過WebViewClient復寫shouldOverrideUrlLoading ()
public class MainActivity extends AppCompatActivity {
WebView mWebView;
// Button button;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mWebView = (WebView) findViewById(R.id.webview);
WebSettings webSettings = mWebView.getSettings();
// 設置與Js交互的權限
webSettings.setJavaScriptEnabled(true);
// 設置允許JS彈窗
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
// 步驟1:加載JS代碼
// 格式規(guī)定為:file:///android_asset/文件名.html
mWebView.loadUrl("file:///android_asset/javascript.html");
// 復寫WebViewClient類的shouldOverrideUrlLoading方法
mWebView.setWebViewClient(new WebViewClient() {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
// 步驟2:根據協議的參數,判斷是否是所需要的url
// 一般根據scheme(協議格式) & authority(協議名)判斷(前兩個參數)
//假定傳入進來的 url = "js://webview?arg1=111&arg2=222"(同時也是約定好的需要攔截的)
Uri uri = Uri.parse(url);
// 如果url的協議 = 預先約定的 js 協議
// 就解析往下解析參數
if ( uri.getScheme().equals("js")) {
// 如果 authority = 預先約定協議里的 webview度陆,即代表都符合約定的協議
// 所以攔截url,下面JS開始調用Android需要的方法
if (uri.getAuthority().equals("webview")) {
// 步驟3:
// 執(zhí)行JS所需要調用的邏輯
Toast.makeText(MainActivity.this, "js調用了Android的方法", Toast.LENGTH_SHORT).show();
// 可以在協議上帶有參數并傳遞到Android上
HashMap<String, String> params = new HashMap<>();
Set<String> collection = uri.getQueryParameterNames();
}
return true;
}
return super.shouldOverrideUrlLoading(view, url);
}
}
);
}
}