webview开发中使用onShowFileChooser实现web页打开照相机或者图片浏览

迷南。 2022-02-01 05:15 1586阅读 0赞

转自[https://www.jianshu.com/p/48e688ce801f][https_www.jianshu.com_p_48e688ce801f]

最近公司项目需要在`WebView`上调用手机系统相册来上传图片，开发过程中发现在很多机器上无法正常唤起系统相册来选择图片。

解决问题之前我们先来说说`WebView`上传文件的逻辑：当我们在Web页面上点击选择文件的控件(`<input type="file">`)时，会回调`WebChromeClient`下的`openFileChooser()`（5.0及以上系统回调`onShowFileChooser()`）。这个时候我们在`openFileChooser`方法中通过`Intent`打开系统相册或者支持该`Intent`的第三方应用来选择图片。

最后我们在`onActivityResult()`中将选择的图片内容通过`ValueCallback`的`onReceiveValue`方法返回给`WebView`，然后通过js上传。

public class WebViewActivity extends AppCompatActivity\{   
   private WebView webView;  
   private WebSettings settings;  
   private ValueCallback<Uri> uploadMessage;  
   private ValueCallback<Uri\[\]> uploadMessageAboveL;  
   private final static int FILE\_CHOOSER\_RESULT\_CODE = 10000;  
   
   @Override  
   protected void onCreate(Bundle savedInstanceState) \{  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity\_web\_view);  
        webView = findViewById(R.id.webView);  
        settings = webView.getSettings();  
        settings.setJavaScriptEnabled(true);//支持JavaScript脚本  
        webView.setWebChromeClient(new MyWebChromeClient());  
        webView.setWebViewClient(new WebViewClient());  
        webView.loadUrl("file:///android\_asset/web.html");     
        \}  
   
      public class WebChromeClients extends WebChromeClient \{  
        // For Android < 3.0  
        public void openFileChooser(ValueCallback<Uri> valueCallback) \{  
            uploadMessage = valueCallback;  
            openImageChooserActivity();  
        \}  
   
        // For Android  >= 3.0  
        public void openFileChooser(ValueCallback valueCallback, String acceptType) \{  
            uploadMessage = valueCallback;  
            openImageChooserActivity();  
        \}  
   
        //For Android  >= 4.1  
        public void openFileChooser(ValueCallback<Uri> valueCallback, String acceptType,  String capture) \{  
            uploadMessage = valueCallback;  
            openImageChooserActivity();  
        \}  
   
        // For Android >= 5.0  
        @Override  
        public boolean onShowFileChooser(WebView webView, ValueCallback<Uri\[\]> filePathCallback, WebChromeClient.FileChooserParams fileChooserParams) \{  
            uploadMessageAboveL = filePathCallback;  
            openImageChooserActivity();  
            return true;  
        \}  
    \}  
   
   
   private void openImageChooserActivity() \{  
        //调用自己的图库  
        Intent i = new Intent(Intent.ACTION\_GET\_CONTENT);  
        i.addCategory(Intent.CATEGORY\_OPENABLE);  
        i.setType("image/\*");  
        startActivityForResult(Intent.createChooser(i, "Image Chooser"),     FILE\_CHOOSER\_RESULT\_CODE);  
    \}  
   
   
    @Override  
    protected void onActivityResult(int requestCode, int resultCode, Intent data) \{  
        super.onActivityResult(requestCode, resultCode, data);  
        if (requestCode == FILE\_CHOOSER\_RESULT\_CODE) \{ //处理返回的图片，并进行上传  
            if (null == uploadMessage && null == uploadMessageAboveL) return;  
            Uri result = data == null || resultCode != RESULT\_OK ? null : data.getData();  
            if (uploadMessageAboveL != null) \{  
                onActivityResultAboveL(requestCode, resultCode, data);  
            \} else if (uploadMessage != null) \{  
                uploadMessage.onReceiveValue(result);  
                uploadMessage = null;  
            \}  
        \}  
    \}  
   
   
   
    @TargetApi(Build.VERSION\_CODES.LOLLIPOP)  
    private void onActivityResultAboveL(int requestCode, int resultCode, Intent intent) \{  
        if (requestCode != FILE\_CHOOSER\_RESULT\_CODE || uploadMessageAboveL == null)  
            return;  
        Uri\[\] results = null;  
        if (resultCode == Activity.RESULT\_OK) \{  
            if (intent != null) \{  
                String dataString = intent.getDataString();  
                ClipData clipData = intent.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)\};  
            \}  
        \}  
        uploadMessageAboveL.onReceiveValue(results);  
        uploadMessageAboveL = null;  
    \}  
\}

[https_www.jianshu.com_p_48e688ce801f]: https://www.jianshu.com/p/48e688ce801f