Android WebView通信

web方面

代碼如下

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Android WebView Test</title>
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script>
<script>
    function toClient() {
        var order = $("#val").val();
        alert(order)
    }

    function getInfoFromAndroid(){
        window.fover.clickonAndroid();
    }

    function fromClinet(str) {
        $("#fromclient").text("iemi :" + str.iemi + " wifiMac : " + str.wifiMac + " phoneName :" + str.phoneName + " androidVersion :" + str.androidVersion);
    }

</script>
</head>
<body>Android WebView傳遞數據Demo
<br/>
<input type="submit" value="從Android獲取信息" onclick="getInfoFromAndroid()"/>
<br/>
顯示返回:<label id="fromclient"></label><br/>
輸入一個字符串:<br/>
<input id="val"/>
<input type="submit" value="點擊提交給客戶端" onclick="toClient()"/>
<br/>

</body>
</html>

ANDROID 部分代碼

package cn.fover.webdemo;

import android.content.Context;
import android.content.SharedPreferences;
import android.net.wifi.WifiManager;
import android.os.Build;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.telephony.TelephonyManager;
import android.text.TextUtils;
import android.view.View;
import android.webkit.JavascriptInterface;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;

import com.google.gson.Gson;

import org.w3c.dom.Text;

public class MainActivity extends AppCompatActivity {

private WebView mWebView;
private String mJson;
private EditText mEdit;


@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    preInfo();

    mEdit = (EditText) findViewById(R.id.hostName);
    String host = getSharedPreferences("Fover", Context.MODE_PRIVATE).getString("host", "");
    mEdit.setText(host);

    mWebView = (WebView) findViewById(R.id.webView);
    WebSettings setting = mWebView.getSettings();
    setting.setJavaScriptEnabled(true);
    mWebView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);

    WebChromeClient myClient = new WebChromeClient() {
        @Override
        public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
            result.confirm();
            Toast.makeText(MainActivity.this, message, Toast.LENGTH_SHORT).show();
            return true;
        }
    };
    mWebView.addJavascriptInterface(new AndroidClick(), "fover");
    mWebView.setWebChromeClient(myClient);


    findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            String host = mEdit.getText().toString();
            if (TextUtils.isEmpty(host)) {
                Toast.makeText(MainActivity.this, "請輸入服務器地址", Toast.LENGTH_SHORT).show();
            } else {
                host = "http://" + host;
                mWebView.loadUrl(host);
                MainActivity.this.getSharedPreferences("Fover", Context.MODE_PRIVATE).edit().putString("host", host.substring(7, host.length())).commit();
            }
        }
    });
}

/**
 * 獲取各種信息
 */
private void preInfo() {
//        獲取IEMI
    String imei = ((TelephonyManager) getSystemService(TELEPHONY_SERVICE))
            .getDeviceId();
//        獲取WIFI的mac地址
    WifiManager wifi = (WifiManager) getSystemService(Context.WIFI_SERVICE);
    String wifiMac = wifi.getConnectionInfo().getMacAddress();
//        獲取Android版本

    String androidModel = Build.MODEL;
    String sdk = Build.VERSION.SDK;

    InfoEntity entity = new InfoEntity(imei, wifiMac, androidModel, sdk);
    mJson = new Gson().toJson(entity);

    System.out.println(mJson);

}


private class AndroidClick {
    @JavascriptInterface
    public void clickonAndroid() {
        mWebView.post(new Runnable() {
            @Override
            public void run() {
                mWebView.loadUrl("javascript:fromClinet(" + mJson + ")");
            }
        });
    }
}
}

說明

  • 從web給Android發送消息

從web給Android發送消息主要使用alert方法,直接alert(需要傳遞的數據),Android端重寫WebChromeClient的onJsAlert方法攔截事件,即可。

  • 從Android發送給webview

需要點擊網頁上的按鈕,然後觸發AndroidClick的clickonAndroid方法,當然這個方法名是可以自己定義的,在clickonAndroid的方法中使用webview的loadUrl指定js的方法,並傳入參數,傳入的參數可以是一個json格式的文件,在js訪問的時候可以直接使用obj.xxx這樣簡單的方式訪問,非常方便。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章