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;
    }
    
}

@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的照片上传时候，用于在网页打开android图库文件
	 */
	public OpenFileWebChromeClient mOpenFileWebChromeClient = new OpenFileWebChromeClient(
			this);
       mLJWebView.setWebChromeClient(mOpenFileWebChromeClient);

最后

以上就是神勇季节为你收集整理的Android webview与js交互上传图片的全部内容，希望文章能够帮你解决Android webview与js交互上传图片所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。