记录一下webview的使用过程，webview上传图片，调用原生方法

最新推荐文章于 2024-05-06 16:56:07 发布
最新推荐文章于 2024-05-06 16:56:07 发布
阅读量654 收藏
点赞数
分类专栏： android 文章标签： webview
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/a18737105569/article/details/83991914
版权

先记录一下我用webview时候setting的一些设置，这些设置我都是无脑粘贴：

WebSettings settings = webView.getSettings();
// 设置与Js交互的权限
settings.setJavaScriptEnabled(true);
// 设置允许JS弹窗
settings.setJavaScriptCanOpenWindowsAutomatically(true);
// 设置缩放级别
settings.setDefaultZoom(WebSettings.ZoomDensity.MEDIUM);
// 支持缩放
settings.setSupportZoom(true);
settings.setDomStorageEnabled(true);//开启DOM storage API功能
settings.setAllowFileAccess(true);
// 将网页内容以单列显示
settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);

然后后来遇到一个问题  就是加载的网页布局乱了，经过查资料需要设置这个

settings.setUseWideViewPort(false);//这里需要设置为true，才能让Webivew支持<meta>标签的viewport属性

接下来记录一下重写的Webview中的方法和作用

webView.setWebViewClient(new WebViewClient(){}；

以下重写的是WebViewClient中的方法：

@Override
public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
    super.onReceivedError(view, request, error);//错误提示，当网页断网加载失败我们可以做一些相关跳转，避免出现断网的不友好图示：
    LogUtils.LOG("ceshi","dsfa"+error,"断网");
    Intent intent=new Intent(MainActivity.this,KongActivity.class);
    startActivity(intent);
    finish();
}

webView.setWebChromeClient(new WebChromeClient(){}

以下是重写WebChromeClient中的方法

 @Override
            public void onProgressChanged(WebView view, int newProgress) {

                super.onProgressChanged(view, newProgress);
                if(newProgress==100){
                    mPrigressBer.setVisibility(View.GONE);//加载完网页进度条消失
                    LogUtils.LOG("ceshi",webView.getUrl(),"网址");
                    uuuu=webView.getUrl();//可以得到加载的网页，我们可以判断当加载的网页是主页时清除掉历史，有效防止循环后退
                    if(webView.getUrl().contains("https://www.baidu.com")
                            ){
                        webView.clearHistory();//清楚webview加载的历史，点击返回直接退出
                    }
                }
                else{
                    mPrigressBer.setVisibility(View.VISIBLE);//开始加载网页时显示进度条
                    mPrigressBer.setProgress(newProgress);//设置进度值
                }


            }

我的项目里还有一个需求上传图片，所以我在WebChromeClient中调用了这几个方法

public final static int FILECHOOSER_RESULTCODE = 1;
public final static int FILECHOOSER_RESULTCODE_FOR_ANDROID_5 = 2;
public ValueCallback<Uri> mUploadMessage;
private void openFileChooserImpl(ValueCallback<Uri> uploadMsg) {
    mUploadMessage = uploadMsg;
    Intent i = new Intent(Intent.ACTION_GET_CONTENT);
    i.addCategory(Intent.CATEGORY_OPENABLE);
    i.setType("image/*");
    startActivityForResult(Intent.createChooser(i, "File Chooser"), FILECHOOSER_RESULTCODE);
}

public ValueCallback<Uri[]> mUploadMessageForAndroid5;
private void onenFileChooseImpleForAndroid(ValueCallback<Uri[]> filePathCallback) {
    mUploadMessageForAndroid5 = filePathCallback;
    Intent contentSelectionIntent = new Intent(Intent.ACTION_GET_CONTENT);
    contentSelectionIntent.addCategory(Intent.CATEGORY_OPENABLE);
    contentSelectionIntent.setType("image/*");

    Intent chooserIntent = new Intent(Intent.ACTION_CHOOSER);
    chooserIntent.putExtra(Intent.EXTRA_INTENT, contentSelectionIntent);
    chooserIntent.putExtra(Intent.EXTRA_TITLE, "Image Chooser");

    startActivityForResult(chooserIntent, FILECHOOSER_RESULTCODE_FOR_ANDROID_5);
}

以及重写了

@Override
public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> filePathCallback, FileChooserParams fileChooserParams) {

    LogUtils.LOG("ceshi","图片选择","tupian");
    onenFileChooseImpleForAndroid(filePathCallback);
    return true;

}

最后重写了onactivityresult方法

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    super.onActivityResult(requestCode, resultCode, data);
    if (requestCode == FILECHOOSER_RESULTCODE) {
        if (null == mUploadMessage)
            return;
        Uri result = data == null || resultCode != RESULT_OK ? null: data.getData();
        mUploadMessage.onReceiveValue(result);
        mUploadMessage = null;

    } else if (requestCode == FILECHOOSER_RESULTCODE_FOR_ANDROID_5){
        if (null == mUploadMessageForAndroid5)
            return;
        Uri result = (data == null || resultCode != RESULT_OK) ? null: data.getData();
        if (result != null) {
            mUploadMessageForAndroid5.onReceiveValue(new Uri[]{result});
        } else {
            mUploadMessageForAndroid5.onReceiveValue(new Uri[]{});
        }
        mUploadMessageForAndroid5 = null;
    }
   
}

完整代码：

webView.setWebChromeClient(new WebChromeClient(){
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                super.onProgressChanged(view, newProgress);
                if(newProgress==100){
                    mPrigressBer.setVisibility(View.GONE);//加载完网页进度条消失
                    LogUtils.LOG("ceshi",webView.getUrl(),"网址");
                    uuuu=webView.getUrl();
                    if(webView.getUrl().contains("https://eosmytoken.io/app/index/index.html")||
                            webView.getUrl().contains("https://eosmytoken.io/app/news/index.html")||
                                    webView.getUrl().contains("https://eosmytoken.io/app/user/index.html")
//                    ||webView.getUrl().contains("http://app.ete-coin.com/app/user/index.html")
                            ){
                        webView.clearHistory();
                    }
                }
                else{
                    mPrigressBer.setVisibility(View.VISIBLE);//开始加载网页时显示进度条
                    mPrigressBer.setProgress(newProgress);//设置进度值
                }


            }

            @Override
            public void onReceivedTitle(WebView view, String title) {
                super.onReceivedTitle(view, title);
                LogUtils.LOG("ceshi",title,"网址网址网址");
                if (Build.VERSION.SDK_INT < Build.VERSION_CODES.M) {
                    if(title.contains("找不到")){
                        Intent intent=new Intent(MainActivity.this,KongActivity.class);
                        startActivity(intent);
                        finish();
                    }
                }

            }

            //扩展浏览器上传文件
            //3.0++版本
            public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType) {
                openFileChooserImpl(uploadMsg);
            }

            //3.0--版本
            public void openFileChooser(ValueCallback<Uri> uploadMsg) {
                openFileChooserImpl(uploadMsg);
            }

            public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType, String capture) {
                openFileChooserImpl(uploadMsg);
            }


            @Override
            public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> filePathCallback, FileChooserParams fileChooserParams) {

                LogUtils.LOG("ceshi","图片选择","tupian");
                onenFileChooseImpleForAndroid(filePathCallback);
                return true;

            }

            @Override//这里是js交互。和web协商可以做调用原生操作  注意：重写这个方法后，web的alert不会弹出来
            public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
                Uri uri = Uri.parse(message);
                if ( uri.getScheme().equals("mytoken")) {

                    // 如果 authority  = 预先约定协议里的 webview，即代表都符合约定的协议
                    // 所以拦截url,下面JS开始调用Android需要的方法
                    Log.i("ceshi",uri.getAuthority()+".....2");
//                    webView.stopLoading();
                    if(uri.getAuthority().equals("scan")){
                       //做相关操作
                    }else {
                      //做相关操作
                    }

                    result.cancel();
                    return true;
                }
                return true;
            }
        });
public final static int FILECHOOSER_RESULTCODE = 1;
public final static int FILECHOOSER_RESULTCODE_FOR_ANDROID_5 = 2;
public ValueCallback<Uri> mUploadMessage;
private void openFileChooserImpl(ValueCallback<Uri> uploadMsg) {
    mUploadMessage = uploadMsg;
    Intent i = new Intent(Intent.ACTION_GET_CONTENT);
    i.addCategory(Intent.CATEGORY_OPENABLE);
    i.setType("image/*");
    startActivityForResult(Intent.createChooser(i, "File Chooser"), FILECHOOSER_RESULTCODE);
}

public ValueCallback<Uri[]> mUploadMessageForAndroid5;
private void onenFileChooseImpleForAndroid(ValueCallback<Uri[]> filePathCallback) {
    mUploadMessageForAndroid5 = filePathCallback;
    Intent contentSelectionIntent = new Intent(Intent.ACTION_GET_CONTENT);
    contentSelectionIntent.addCategory(Intent.CATEGORY_OPENABLE);
    contentSelectionIntent.setType("image/*");

    Intent chooserIntent = new Intent(Intent.ACTION_CHOOSER);
    chooserIntent.putExtra(Intent.EXTRA_INTENT, contentSelectionIntent);
    chooserIntent.putExtra(Intent.EXTRA_TITLE, "Image Chooser");

    startActivityForResult(chooserIntent, FILECHOOSER_RESULTCODE_FOR_ANDROID_5);
}
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    super.onActivityResult(requestCode, resultCode, data);
    if (requestCode == FILECHOOSER_RESULTCODE) {
        if (null == mUploadMessage)
            return;
        Uri result = data == null || resultCode != RESULT_OK ? null: data.getData();
        mUploadMessage.onReceiveValue(result);
        mUploadMessage = null;

    } else if (requestCode == FILECHOOSER_RESULTCODE_FOR_ANDROID_5){
        if (null == mUploadMessageForAndroid5)
            return;
        Uri result = (data == null || resultCode != RESULT_OK) ? null: data.getData();
        if (result != null) {
            mUploadMessageForAndroid5.onReceiveValue(new Uri[]{result});
        } else {
            mUploadMessageForAndroid5.onReceiveValue(new Uri[]{});
        }
        mUploadMessageForAndroid5 = null;
    }}

 

又见飞
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
移动端webview实现图片上传功能
07-02
用html写图片上传功能,在移动端点击选择文件没有效果,需要在WebChromeClient中增加openFileChooser方法.
android webview 执行js_web前端入门到实战：Js和原生相互调用总结
weixin_40009207的博客
11-29 187
一、前言现在市面上有一些app是通过原生ios、Android加载一个网页实现的，如图所示，这样的app我们称之为 Hybrid App那么为什么要用 hybrid app呢？ 个人认为的原因有两点：1.提高开发效率，以钉钉为例在涉及到一些OA操作比如打卡，请假等功能的时候，显然一个嵌入一个网页就能够满足需求，如果在让IOS和Android再去各自开发一套那么效率就很低了。2.提高迭代效率。以商城...
web页面与原生android通信，调用原生android方法
最新发布
qq_43201652的博客
05-06 459
注册初始化方法JsBridge。在main.js中引入注册。
从UIWebView中调用iOS相册，并选择图片上传到Linux Web服务器。
热门推荐
沸腾的泪水的专栏
09-23 1万+
转载自：http://blog.sina.com.cn/s/blog_a5610c5301014p94.html ＝＝＝＝＝＝首先看以下ios端＝＝＝＝＝＝＝ ViewController.h // //  ViewController.h //  Xcode_FileUpload // //  Created by KirSsu
android 原生webview,Android WebView实现原生与JavaScript的交互
weixin_34122532的博客
05-26 339
Android WebView实现原生与JavaScript的交互在现在的Android开发中，为了追求开发的效率以及移植的便利性，越来越多的开发者会在App中使用WebView作为部分业务内容展示与交互的主要载体。那么在这种Hybrid App中，难免就会遇到网页与Java原生的交互问题，比如说调用Java方法去做那部分网页不能完成的功能或者是通过Java原生代码来调用网页当中实现的一些功能，其...
flutter_inappwebview 中上传文件、图片闪退
qiaozi的博客
10-10 2153
解决flutter_inappwebview中上传图片APP闪退问题
android webview中使用Java调用JavaScript方法并获取返回值
01-20
通过这种方式，你可以在Android的WebView中调用JavaScript方法并获取返回值。请注意，为了安全起见，使用`addJavascriptInterface`时应该始终加上`@JavascriptInterface`注解，并对传入的数据进行适当的验证和清理，...
Android APP使用WebView调用H5页面完成摄像头扫描二维码软件源码.rar
05-10
在Android应用开发中，WebView是一个非常重要的组件，...以上就是Android APP使用WebView调用H5页面完成摄像头扫描二维码的关键技术点。通过这个示例，开发者可以学习到如何结合原生功能与H5页面，提升APP的用户体验。
Android原生WebView与网页js相互调用
04-09
本文将深入探讨如何在Android原生的WebView中与嵌入的JavaScript进行交互，使得两者可以相互调用方法，增强应用的功能和用户体验。 一、WebView基本使用 首先，我们需要在布局XML文件中添加WebView组件，并在Java...
Android webview和js互相调用实现方法
01-20
在Android Webview中，我们可以使用`loadUrl`方法加载一个特定的JavaScript命令，形如`"javascript:methodName()"`，这将在当前加载的网页中执行`methodName`函数。例如，在`WebViewActivity`的Java代码中，我们可以...
安卓webview js交互图片上传前后端代码
10-22
安卓webview js交互图片上传前后端代码，图片编码采用base64编码上传保存到服务器，亲测可以实现数据图片上传
Android使用WebView从相册/拍照中添加图片
05-04
解决这个问题花了很长时间搜索了解，网上大部分使用openFileChooser但都没解决一个存在的问题。就是当弹出选择图片/相机框之后，取消选择，就再也不能点击选择按钮了。这篇文章是为了记录这一点，为验证整个流程部署了后端，但是由于很久没接触后端，后端代码是网上的列子，所以后端代码和部署就不说了。单纯的说下Android端的解决方案。
解决react-native 的 webview 组件不支持android客户端上传图片文件问题
11-27
解决react-native 的 webview 组件不支持android客户端上传图片文件问题
WebView加载页面 页面上上传图片
yebingzi的专栏
07-23 109
private Object getHtmlObject() { Object insertObj = new Object() { // public void shlnk(final String site_url) { public void sharelink(final String site_url, final String image_ur...
关于Webview拍照或从相册上传图片处理总结
七号座先生的博客
11-25 3003
前言：各公司为了处理更多的业务流程， 一般都会加入H5与原生交互处理，方便快速开发，迭代项目。但，在Android中，H5与原生的交互处理的就没有iOS那么好。其中适配也是一个问题，Android系统版本众多，国内手机开发商都各自定制自家的系统，所以适配起来的话，也是一个不小的工作量。本文就总结一下我本人在公司项目使用到Webview中上传图片的处理。WebView 上传图片, 想必很多人都碰到过这
webview 调用相册权限和js地图权限
xianjiuxi3295的博客
01-02 1405
这2个功能。我实现了，但是却冲突了， 就是有2个setWebChromeClient冲突。单独放2个功能是可以实现的，但一起的话，就只能实现一个。 然后求广大CSDN的朋友们求解。 部分代码如下：  super.onCreate(savedInstanceState);         this.requestWindowFeature(Window.FEATURE_NO_TI
[Android] WebView中拍照或从相册上传图片
Alex Tam 的专栏
10-16 9568
WebView 上传图片, 想必很多人都碰到过这样的场景. 而且 WebView 在4.4前后的区别非常大, 比如对URL跳转的格式, 对JS的注入声明等等, 4.4以后的WebView 已经是chromium内核, 有多强大就无需我赘述. 说这些, 其实也是为了说明也因为WebView的前后变化太大了, 所以在低版本和版本上, WebView上传文件的方式都略有不同, 而且在安卓4.4.4的一些设
Android - WebView接入H5客服&照片/视频上传
czssltt的博客
04-20 1960
webView加载H5，主要是解决上传图片和视频的问题。 1）Activity定义一些常量变量 private static final int REQUEST_CODE_PERMISSION_CAMERA = 0x03; private static final int REQUEST_CODE_CAMERA = 0x02; private static final int REQUEST_CODE_ALBUM = 0x01; private ValueCallback<U
详解Android WebView：集成与JS交互方法
本文档详细介绍了Android WebView的使用方法以及其与JavaScript交互调用的重要技巧。Android WebView是Android平台上一种内置的组件，用于在应用程序中嵌入并显示Web页面，为开发者提供了丰富的功能和扩展性。 首先...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值