您的位置:首页 > 移动开发 > Android开发

Android webview与js交互上传图片

2016-08-12 15:54 459 查看
最近项目中用到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);希望能对你有所帮助,谢谢!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  android webview javascript