Android中WebView的基本配置与填坑记录大全

Android中WebView的基本配置与填坑记录大全

本文将详细介绍Android中WebView的基本配置和一些坑点记录。WebView是Android中经常用到的控件,它能够方便地显示Web页面或者本地HTML页面,同时也支持JavaScript交互。

1. 添加依赖

build.gradle的dependencies中添加如下依赖:

implementation 'androidx.webkit:webkit:1.4.0'

2. 添加网络权限

AndroidManifest.xml中添加如下权限:

<uses-permission android:name="android.permission.INTERNET" />

3. 布局文件中添加WebView

在布局文件中添加WebView:

<WebView
    android:id="@+id/web_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

4. 初始化WebView

在Activity的onCreate方法中,获取WebView实例并进行一些基本配置:

WebView webView = findViewById(R.id.web_view);
WebSettings settings = webView.getSettings();
settings.setJavaScriptEnabled(true); // 开启JavaScript支持
settings.setCacheMode(WebSettings.LOAD_NO_CACHE); // 不使用缓存

5. 加载Web页面

可以通过loadUrl方法加载Web页面:

webView.loadUrl("https://www.example.com");

也可以通过loadData方法加载HTML页面:

String html = "<html><h1>Hello world</h1></html>";
webView.loadData(html, "text/html", "UTF-8");

6. WebView与JavaScript交互

6.1 WebView调用JavaScript方法

通过evaluateJavascript方法调用JavaScript方法:

webView.evaluateJavascript("javascript:alert('hello')", null);

6.2 JavaScript调用WebView方法

在WebView中添加JavaScript接口:

public class WebViewJavaScriptInterface {
    @JavascriptInterface
    public void showMessage(String message) {
        Toast.makeText(MainActivity.this, message, Toast.LENGTH_SHORT).show();
    }
}

webView.addJavascriptInterface(new WebViewJavaScriptInterface(), "android");

在JavaScript代码中调用:

android.showMessage("hello");

填坑记录

1. WebView加载页面时如何统一携带请求头

在WebView加载页面时,可以通过WebViewClient的onPageStarted方法来统一携带请求头:

webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
        super.onPageStarted(view, url, favicon);
        Map<String, String> headers = new HashMap<>();
        headers.put("User-Agent", "Mozilla/5.0");
        view.loadUrl(url, headers);
    }
});

2. WebView页面缓存问题

在WebSettings中设置CacheMode为LOAD_NO_CACHE可以禁用WebView缓存。如果需要缓存,则需要设置缓存路径和缓存模式:

String cacheDirPath = getFilesDir().getAbsolutePath() + "/webcache";
settings.setAppCachePath(cacheDirPath);
settings.setAllowFileAccess(true);
settings.setAppCacheEnabled(true);
settings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);

同时,在WebViewClient中处理缓存:

webView.setWebViewClient(new WebViewClient() {
    @Override
    public WebResourceResponse shouldInterceptRequest(WebView view, WebResourceRequest request) {
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
            return super.shouldInterceptRequest(view, request);
        }
        String url = request.getUrl().toString();
        WebResourceResponse response = null;
        try {
            URLConnection connection = new URL(url).openConnection();
            InputStream inputStream = connection.getInputStream();
            Map<String, List<String>> headers = connection.getHeaderFields();
            String mimeType = connection.getContentType();
            String encoding = connection.getContentEncoding();
            response = new WebResourceResponse(mimeType, encoding, inputStream);
            response.setResponseHeaders(headers);
        } catch (IOException e) {
            e.printStackTrace();
        }
        return response;
    }
});

示例说明

示例1:WebView加载百度页面

在Activity中添加如下代码:

WebView webView = findViewById(R.id.web_view);
WebSettings settings = webView.getSettings();
settings.setJavaScriptEnabled(true);
settings.setCacheMode(WebSettings.LOAD_NO_CACHE);
webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
        super.onPageStarted(view, url, favicon);
        Map<String, String> headers = new HashMap<>();
        headers.put("User-Agent", "Mozilla/5.0");
        view.loadUrl(url, headers);
    }
});
webView.loadUrl("https://www.baidu.com");

示例2:WebView加载本地HTML页面

在Activity中添加如下代码:

WebView webView = findViewById(R.id.web_view);
WebSettings settings = webView.getSettings();
settings.setJavaScriptEnabled(true);
String html = "<html><h1>Hello world</h1></html>";
webView.loadData(html, "text/html", "UTF-8");

总结

本文介绍了Android中WebView的基本配置和一些坑点记录。希望本文能够帮助你更好地使用WebView。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:Android中WebView的基本配置与填坑记录大全 - Python技术站

(0)
上一篇 2023年6月11日
下一篇 2023年6月11日

相关文章

  • JS中节流和防抖函数的实现及区别示例

    JS中的节流和防抖函数是常见的性能优化方案,它们可以有效减少大量事件触发时造成的性能浪费。接下来我将详细讲解它们的实现方法及区别,并提供两个示例说明。 一、防抖函数 防抖函数是指在事件触发n秒后,才会执行回调函数,如果在n秒内又触发了该事件,则重新计算时间。这个操作就像是“弹簧被压下去后在n秒后才能弹起来”。 防抖函数的实现方法如下: function de…

    JavaScript 2023年6月10日
    00
  • 详解JavaScript ES6中的Generator

    详解JavaScript ES6中的Generator Generator是ES6中一种新的函数类型,其最显著的特点就是可以暂停执行,后续又可以从暂停的位置继续执行。本文将介绍Generator的语法、使用方法和常见应用场景。 语法 Generator函数可以使用function*语法定义,函数内部使用yield关键字可以暂停函数的执行,返回yield后面的…

    JavaScript 2023年5月28日
    00
  • JS实现网络请求的三种方式梳理

    JS实现网络请求的三种方式梳理 在JavaScript开发中,网络请求是不可或缺的一部分,下面是三种常用的实现网络请求的方式: 1. XMLHttpRequest请求 XMLHttpRequest是一个原生JavaScript对象,它是一个浏览器提供的api,用来在浏览器和服务器之间发送HTTP请求和接收服务器数据。XMLHttpRequest请求的基本流程…

    JavaScript 2023年6月11日
    00
  • JavaScript关于某元素点击事件的监听和触发

    下面是关于JavaScript中某元素点击事件的监听和触发的完整攻略: 监听点击事件 在JavaScript中,可以通过addEventListener方法监听元素的点击事件,方法需要两个参数,第一个参数是事件名称,第二个参数是要触发的回调函数。例如: // 获取元素 const btn = document.getElementById(‘btn’); /…

    JavaScript 2023年6月10日
    00
  • js页面跳转常用的几种方式

    下面是关于“js页面跳转常用的几种方式”的完整攻略。 一、背景 在web应用中,页面跳转是非常常见的操作。而在前端开发中,我们通常使用JavaScript来实现页面的跳转功能。本文将介绍js页面跳转的常用几种方式。 二、常用的几种方式 1.通过window.location.href实现页面跳转 代码形式如下: window.location.href = …

    JavaScript 2023年6月11日
    00
  • 关于ES6中的箭头函数超详细梳理

    关于ES6中的箭头函数超详细梳理 箭头函数的概述 ES6中新增的箭头函数,是一种新的函数表达式,可以简化函数的创建过程,提高代码的可读性。它具有以下几个特点: 采用箭头符号“=>”作为函数定义符号。 函数体中只有一句代码时,可以省略花括号和return。 箭头函数没有自己的this,它的this由外部的上下文决定。 箭头函数不可以作为构造器使用,也不能…

    JavaScript 2023年6月11日
    00
  • JS获取一个表单字段中多条数据并转化为json格式

    要获取一个表单字段中多条数据并转化为JSON格式,可以按如下步骤进行: 获取表单字段的值 首先,需要获取表单字段的值。可以使用document.getElementsByName()方法来获取表单字段的所有值。 例如,表单中有一个名称为“fruit”的checkbox列表,它包含多个不同的水果,可以使用以下代码获取所选水果的值: var fruit = do…

    JavaScript 2023年5月27日
    00
  • javascript实现数字时钟效果

    下面是详细讲解 JavaScript 实现数字时钟效果的完整攻略。 1. HTML 结构 首先需要在 HTML 文件中添加用于展示时间的结构。 <div id="clock"> <span id="hours"></span> : <span id="minutes&…

    JavaScript 2023年5月27日
    00
合作推广
合作推广
分享本页
返回顶部