Android&H5-js通过jsbridge调用安卓相机/相册/通讯录

引文

是有这样一个需求 在vue里通过js可以直接调用安卓原生的照相机、相册和通讯录,并返回相应数据。当然前提是用webview来进行加载。

Android端处理

  • 在build.gradle引入(moudule:app)
dependencies {
   
    compile 'com.github.lzyzsd:jsbridge:1.0.4'
}
  • 在build.gradle引入(moudule:本项目)
allprojects {
   
    repositories {
   
        google()
        jcenter()
        maven {
    url "https://jitpack.io" }
    }
}
  • xml代码
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    android:orientation="vertical"
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.github.lzyzsd.jsbridge.BridgeWebView
        android:id="@+id/web"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </com.github.lzyzsd.jsbridge.BridgeWebView>

</LinearLayout>
  • java代码
/**
 * Webview
 * @author ace
 * @date 2020/4/16
 */

public class WebView extends AppCompatActivity {
   
    private final static int PHOTO_REQUEST = 100;
    private final static int PHOTO_STORY_REQUEST = 101;
    private final static int CONTACT_REQUEST = 102;
    private BridgeWebView mBridgeWebView;
    private Uri imageUri;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
   
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_web_view);
        findViewById();
        init();
    }

    private void findViewById() {
   
        mBridgeWebView = findViewById(R.id.web);
    }

    private void init() {
   
        WebSettings mSettings = mBridgeWebView.getSettings();
        mSettings.setUseWideViewPort(true);
        mSettings.setLoadWithOverviewMode(true);
        mSettings.setDomStorageEnabled(true);
        mSettings.setDefaultTextEncodingName("UTF-8");
        // 是否可访问Content Provider的资源,默认值 true
        mSettings.setAllowContentAccess(true);
        // 是否可访问本地文件,默认值 true
        mSettings.setAllowFileAccess(true);
        mSettings.setJavaScriptEnabled(true);

        mBridgeWebView.setWebChromeClient(new MyWebChromeClient());
        mBridgeWebView.loadUrl("http://10.3.102.129:8080/#/?time=1000015576");

        mBridgeWebView.setDefaultHandler(new BridgeHandler() {
   
            @Override
            public void handler(String data, CallBackFunction function) {
   
                function.onCallBack("DefaultHandler收到Web发来的数据,回传数据给你");
            }
        });

        mBridgeWebView.registerHandler("scan", new BridgeHandler() {
   
            @Override
            public void handler(String data, CallBackFunction function) {
   
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
   
                    if (!checkPermission()) {
   
                        requestPermissions();
                    } else {
   
                        takePhoto();//拍照逻辑
                    }
                } else {
   
                    takePhoto();//拍照逻辑
                }
                function.onCallBack("正在调用相机");
            }
        });

        mBridgeWebView.registerHandler("contact", new BridgeHandler() {
   
            @Override
            public void handler(String data, CallBackFunction function) {
   
                PhotoUtils.takeContact(WebView.this, CONTACT_REQUEST);
                function.onCallBack("正在调用通讯录");
            }
        });


    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
   
        super.onActivityResult(requestCode, resultCode, data);
        if (requestCode == PHOTO_REQUEST) {
   
            //照相回调
            try {
   
                Bitmap bitmap = PhotoUtils.getBitmapFormUri(this, imageUri);
                mBridgeWebView.callHandler("scanResult", PhotoUtils.bitmapToBase64(bitmap), new CallBackFunction() {
   
                    @Override
                    public void onCallBack(String data) {
   
                        Toast.makeText(WebView.this, data, Toast.LENGTH_SHORT).show();
                    }
                });
            } catch (IOException e) {
   
                e.printStackTrace();
            }
        } else if (requestCode == PHOTO_STORY_REQUEST) {
   
            //相册回调
            Uri[] results = null;
            if (data == null) {
   
                results = null;
            } else {
   
                String dataString = data.getDataString();
                ClipData clipData = data.getClipData();
                if (clipData != null) {
   
                    results = new Uri[clipData.getItemCount()];
                    for (int i = 0; i < clipData.getItemCount(); i++) {
   
                        ClipData.Item item = clipData.getItemAt(i);
                        results[i] = item.getUri();
                    }
                }
                if (dataString != null) {
   
                    results = new Uri[]{
   Uri.parse(dataString)};
                }
            }
            try {
   
                Bitmap bitmap = PhotoUtils.getBitmapFormUri(this, results[0]);
                mBridgeWebView.callHandler("scanResult", PhotoUtils.bitmapToBase64(bitmap), new CallBackFunction() {
   
                    @Override
                    public void onCallBack(String data) {
   
                        Toast.makeText(WebView.this, data, Toast.LENGTH_SHORT).show();
                    }
          

你可能感兴趣的:(android,前端,android,vue,js)