Android和JavaScript相互调用初学_andorid execjavascript-CSDN博客

本文链接：https://blog.csdn.net/u010360371/article/details/50267727

前言

由于最近接触cordova开发，也就是webapp的开发，这是一种基于h5的一种开发的模式，也就是在原生态android和h5的混合开发。由于h5开发的速度比原生态的快，所以这个框架最大的好处是能帮助提高开发效率，框架的缺点，只能说现在的原生态比h5的效果和流畅度更好，随着手机的发展，h5的展示肯定会随之变好。

代码学习

在学习cordova之前呢，必须要先了解最基本的android和javascript的调用的方式，可以更好的了解cordova的代码。
在android中调用javascript主要是通过webview的实现，通过向WebView中注入一个对象，来提供给js一个入口，js可以调用到注入类的方法。下面通过实例来展示。

示例

1.在布局main_activity.xml中，定义一个WebView以及其他的需要的控件。
2.在Manifest.xml中加入INTERNET的permission。
3.在工程的main/src/assets下新建一个index.html ，其中要写入javascript的代码。

<html>
<body>
    <h4>我是一个webview</h4>
    <p >打开相机</p>
    <input id="btnClick" type="button" value="Open Camera" />
    <script type="text/javascript">
        var btnClick = document.getElementById('btnClick');
        btnClick.onclick = function showMessage() {
            <!--andriod暴露给js的方法-->
            JsBridge.exec("test");
        };
        <!--js方法，android可以调用-->
        function func(string) {
            alert(string);
        }
    </script>
</body>
</html>

4.在MainActivity中，需要设置WebView的参数，以及添加一个将要注入的类为JsObject。
首先是JsObject.java：

public class JsObject {
    private Context mContext;

    public JsObject(Context context) {
        this.mContext = context;
    }

    // js通过此方法进行调用android本地方法
    // android4.4后需要加入@JavascriptInterface注解,主要是为了防止恶意程序通过暴露的方法让JS代码控制宿主程序，
    // 这是一个非常有力的特性，但是同时也存在一些安全问题，因为进一步JS代码可以通过反射访问到注入对象的公有域。
    // 攻击者可能会在HTML和JavaScript中包含了有威胁性的代码。
    @JavascriptInterface
    public void exec(String str) {
        showCamera();
    }
    // 打开照相机
    public void showCamera(){
        Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
        mContext.startActivity(intent);
    }
}

接着是MainActivity.java

public class MainActivity extends AppCompatActivity {
    private Button mSendBtn;
    private WebView mWebView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mSendBtn = (Button) findViewById(R.id.send_btn);
        mWebView = (WebView) findViewById(R.id.webview);
        mSendBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // android调用js的方法
             mWebView.loadUrl("javascript:func('android调用js')");
            }
        });
        initWebView();
    }


    private void initWebView(){
        // 设置编码格式
        mWebView.getSettings().setDefaultTextEncodingName("utf-8");
        // 支持js
        mWebView.getSettings().setJavaScriptEnabled(true);
        // 设置透明背景
        mWebView.setBackgroundColor(Color.argb(102, 0, 50, 0));
        // 向WebView中注入Object,方便JS的调用,也就是暴露方法给JS
        mWebView.addJavascriptInterface(new JsObject(this), "JsBridge");
        // Sets the chrome handler. This is an implementation of WebChromeClient
        // for use in handling JavaScript dialogs, favicons, titles, and the
        // progress. This will replace the current handler
        // 通过webchromeclient,js可以有丰富的UI操作，如果没有这一步，则js中的alert没有办法弹出dialog
        mWebView.setWebChromeClient(new WebChromeClient());
        // 加载本地呢的html页面
        mWebView.loadUrl("file:///android_asset/index.html");
    }
}