Android webview与js交互上传图片

最近项目中用到webview,并且有上传图片功能,iOS不用做任何处理,但Android就不行了,调不到相册,后百度才知道这是Android webview的局限性,需要自己扩展WebChromeClient来实现,话不多说直接上代码:

第一步:扩展WebChromeClient

import android.app.Activity;
import android.content.Intent;
import android.net.Uri;
import android.webkit.ValueCallback;
import android.webkit.WebChromeClient;
import android.webkit.WebView;

public class OpenFileWebChromeClient extends WebChromeClient {
    public static final int REQUEST_FILE_PICKER = 1;
    public ValueCallback<Uri> mFilePathCallback;
    public ValueCallback<Uri[]> mFilePathCallbacks;
    Activity mContext;
    public OpenFileWebChromeClient(Activity mContext){
        super();
        this.mContext = mContext;
    }
    // Android < 3.0 调用这个方法 
    public void openFileChooser(ValueCallback<Uri> filePathCallback) {
        mFilePathCallback = filePathCallback;
        Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
        intent.addCategory(Intent.CATEGORY_OPENABLE);
        intent.setType("*/*");
        mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
                REQUEST_FILE_PICKER);
    }
     // 3.0 + 调用这个方法  
    public void openFileChooser(ValueCallback<Uri> filePathCallback,
            String acceptType) {
        mFilePathCallback = filePathCallback;
        Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
        intent.addCategory(Intent.CATEGORY_OPENABLE);
        intent.setType("*/*");
        mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
                REQUEST_FILE_PICKER);
    }
//  / js上传文件的<input type="file" name="fileField" id="fileField" />事件捕获 
            // Android > 4.1.1 调用这个方法  
    public void openFileChooser(ValueCallback<Uri> filePathCallback,
            String acceptType, String capture) {
        mFilePathCallback = filePathCallback;
        Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
        intent.addCategory(Intent.CATEGORY_OPENABLE);
        intent.setType("*/*");
        mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
                REQUEST_FILE_PICKER);
    }
//显示文件浏览窗口
    @Override
    public boolean onShowFileChooser(WebView webView,
            ValueCallback<Uri[]> filePathCallback,
            WebChromeClient.FileChooserParams fileChooserParams) {
        mFilePathCallbacks = filePathCallback;
        Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
        intent.addCategory(Intent.CATEGORY_OPENABLE);
        intent.setType("*/*");
        mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
                REQUEST_FILE_PICKER);
        return true;
    }
    
}
第二步:调用webview的activity中实现

@Override
	public void onActivityResult(int requestCode, int resultCode, Intent intent) {
		if (requestCode == OpenFileWebChromeClient.REQUEST_FILE_PICKER) {
			if (mOpenFileWebChromeClient.mFilePathCallback != null) {
				Uri result = intent == null || resultCode != Activity.RESULT_OK ? null
						: intent.getData();
				if (result != null) {
					String path = getPhotoPathByLocalUri(ReginActivity.this,
							result);
					Uri uri = Uri.fromFile(new File(path));
					mOpenFileWebChromeClient.mFilePathCallback
							.onReceiveValue(uri);
				} else {
					mOpenFileWebChromeClient.mFilePathCallback
							.onReceiveValue(null);
				}
			}
			if (mOpenFileWebChromeClient.mFilePathCallbacks != null) {
				Uri result = intent == null || resultCode != Activity.RESULT_OK ? null
						: intent.getData();
				if (result != null) {
					String path = getPhotoPathByLocalUri(ReginActivity.this,
							result);
					Uri uri = Uri.fromFile(new File(path));
					mOpenFileWebChromeClient.mFilePathCallbacks
							.onReceiveValue(new Uri[] { uri });
				} else {
					mOpenFileWebChromeClient.mFilePathCallbacks
							.onReceiveValue(null);
				}
			}

			mOpenFileWebChromeClient.mFilePathCallback = null;
			mOpenFileWebChromeClient.mFilePathCallbacks = null;
		}
	}
/**
<span style="white-space:pre">	</span> * 获取从本地图库返回来的时候的URI解析出来的文件路径
<span style="white-space:pre">	</span> * 
<span style="white-space:pre">	</span> * @return
<span style="white-space:pre">	</span> */
<span style="white-space:pre">	</span>public static String getPhotoPathByLocalUri(Context context,
<span style="white-space:pre">			</span>Uri selectedImage) {
<span style="white-space:pre">		</span>// Uri selectedImage = data.getData();
<span style="white-space:pre">		</span>String[] filePathColumn = { MediaStore.Images.Media.DATA };
<span style="white-space:pre">		</span>Cursor cursor = context.getContentResolver().query(selectedImage,
<span style="white-space:pre">				</span>filePathColumn, null, null, null);
<span style="white-space:pre">		</span>cursor.moveToFirst();
<span style="white-space:pre">		</span>int columnIndex = cursor.getColumnIndex(filePathColumn[0]);
<span style="white-space:pre">		</span>String picturePath = cursor.getString(columnIndex);
<span style="white-space:pre">		</span>cursor.close();
<span style="white-space:pre">		</span>return picturePath;
<span style="white-space:pre">	</span>}

第三步:webview设置setWebChromeClient

/**
	 * 以下是webview的照片上传时候,用于在网页打开android图库文件
	 */
	public OpenFileWebChromeClient mOpenFileWebChromeClient = new OpenFileWebChromeClient(
			this);
       mLJWebView.setWebChromeClient(mOpenFileWebChromeClient);
希望能对你有所帮助,谢谢!


  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值