Android入门之路 - WebView加载数据的几种方式

news2024/12/23 0:43:27

之前客户端加载H5时遇到了一些问题,我为了方便解决问题,所以将对应场景复刻到了Demo中,从之前的网络加载模拟为了本地加载Html的方式,但是没想到无意被一个基础知识点卡了一些时间,翻看往昔笔记发现未曾记录这种基础场景,故补不足,记录于此

关于 WebView 加载数据的几种方式,可以算是基础内容,相信大家都耳熟于心了,直接开讲

    • 基础配置
    • 加载方式
      • 经常使用
      • 较少遇到
    • 实战场景
      • 本地加载
      • 远程加载
    • 所遇问题
      • 加载本地数据报 Not Found...
      • 加载网络资源报 404、500、Not Found... 等

基础配置

关于 WebView 基础配置主要是对 WebSettings 相关属性的设置

简化版

 WebView webView = (WebView) findViewById(R.id.webView);
 WebSettings mWebSettings = webView.getSettings();
 mWebSettings.setJavaScriptEnabled(true);

因为后续我们需要加载网络资源,所以有必要 添加一下网络权限

Tip:如果仅加载本地资源,可不添加该权限… 但一个项目中不可能没有 INTERNET权限

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

通用 xml 布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />
</LinearLayout>

加载方式

关于以下所有方式有的是经常使用的,也有的很少使用,当然还有一些我基本都没用过,没想到AI直接一起归总了,故我整合解释了一下,希望对你我有所帮助

WebView 加载数据的方式很多,但是我从业以来 用的最多的还是本地加载和网络加载,所以这也是我们主讲的内容,关于其他加载方式先做记录,以后如果我遇到了类似场景再来补充实战感受

经常使用

插一句:在项目中有些富文本的样式也可以通过 Html实现,如果主要是看WebView,请忽略此句

本地加载 (加载本地 html文件)- 项目中会遇到一些组件需要固定的数据,有的成品数据就是html文件,所以有时候会用到这种方式

使用 loadUrl(String path) 方法加载本地文件,如 file:///android_asset/test.html(自行定义html 文件名)

 webView.loadUrl("file:///android_asset/test.html");

网络加载 (加载H5的URL)- 主流方式,项目中基本90%都用这种方式

使用 loadUrl(String url) 方法加载网络或本地文件的URL

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

WebView 实际使用中,我们经常会通过 WebViewClient 监听一些加载情况,以下是比较常用的两个重载监听方法

通过设置 WebViewClient 并重写 shouldOverrideUrlLoading 方法来控制URL加载行为

webView.setWebViewClient(new WebViewClient() {
    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        view.loadUrl(url);
        return true;
    }
});

使用 WebResourceRequest:在Android N(API 24)及以上版本,可以在 WebViewClient 中重写 shouldOverrideUrlLoading 方法的重载版本,接收 WebResourceRequest 参数

webView.setWebViewClient(new WebViewClient() {
    @Override
    public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
        view.loadUrl(request.getUrl().toString());
        return true;
    }
});

较少遇到

加载HTML字符串感觉这种方式相当于把html文件提到了代码内部,如果html比较多的话,可能不太适用

使用 loadData(String data, String mimeType, String encoding) 方法加载HTML字符串

 String htmlData = "<html><head><title>Page Title</title></head><body>Hi, WebView!</body></html>";
 webView.loadData(htmlData, "text/html; charset=UTF-8", "UTF-8");

加载JavaScript代码 (双端交互时调用H5的Js方法,前提的和H5确定过交互需求,否则无效,且有可能报错)

使用 loadUrl(String js) 方法执行 JavaScript 代码。

 String jsCode = "javascript:alert('Hello, world!');";
 webView.loadUrl(jsCode);

加载数据并设置基础URL可能类似URL组装效果,未使用过)
使用 loadDataWithBaseURL(String baseUrl, String data, String mimeType, String encoding, String historyUrl) 加载HTML字符串,并可以设置基础URL

 String baseUrl = "https://www.example.com";
 String htmlData = "<html>...</html>";
 webView.loadDataWithBaseURL(baseUrl, htmlData, "text/html", "UTF-8", null);

加载POST请求数据可能类似URL组装效果,未使用过)

使用 postUrl(String url, byte[] postData) 方法通过POST请求加载数据。

 String url = "https://www.example.com/post";
 byte[] postData = ...; // 你的POST数据
 webView.postUrl(url, postData);

加载XML或HTML文件:可以将其作为字符串加载,然后解析(未见过该类需求,未使用过


实战场景

本地加载

 WebView mWebView = (WebView) findViewById(R.id.wv1);
 WebSettings mWebSettings = mWebView.getSettings();
 mWebSettings.setJavaScriptEnabled(true);
 mWebView.loadUrl("file:///android_asset/test.html");//工程目录assets test.html文件
 
 mWebView.loadUrl("file:///android_asset/icon.png");//工程目录assets图片文件(未尝试过)

示例全码

package com.example.webviewproject

import android.annotation.SuppressLint
import android.os.Bundle
import android.view.View
import android.webkit.WebSettings
import android.webkit.WebView
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {

    private val mWebView: WebView by lazy {
        findViewById<WebView>(R.id.webView)
    }

    @SuppressLint("MissingInflatedId")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        initWebView(mWebView)
        //加载本地资源
        mWebView.loadUrl("file:///android_asset/test.html");
//        mWebView.loadUrl("file:///android_asset/web/test.html")
    }

    /**
    * 初始化WebSettings配置
    * */
    private fun initWebView(mWebView: WebView) {
        mWebView.clearCache(true)
        mWebView.clearHistory()
        val webSettings = mWebView.settings
        webSettings.cacheMode = WebSettings.LOAD_DEFAULT
        webSettings.domStorageEnabled = true
        webSettings.javaScriptEnabled = true
        webSettings.useWideViewPort = true
        webSettings.loadWithOverviewMode = true
        webSettings.builtInZoomControls = true
        webSettings.displayZoomControls = false
        webSettings.setSupportZoom(false)
        webSettings.javaScriptCanOpenWindowsAutomatically = true
        webSettings.allowFileAccess = true
        webSettings.layoutAlgorithm = WebSettings.LayoutAlgorithm.NARROW_COLUMNS
//        webSettings.setAppCacheEnabled(true);
//        webSettings.setAppCacheMaxSize(1024 * 1024 * 8);
//        webSettings.setAppCachePath(this.getApplicationContext().getCacheDir().getAbsolutePath());
//        webSettings.setUserAgentString(webSettings.getUserAgentString() + " ECTASR/1");
//        mWebView.setWebChromeClient(new CustomerActivity.WebChromeClient());
//        mWebView.webViewClient = WebViewClient()
        mWebView.isFocusable = true
        mWebView.isVerticalScrollBarEnabled = false
        mWebView.isHorizontalScrollBarEnabled = false
        mWebView.setOnLongClickListener { v: View? -> true }
    }
}

远程加载

相比加载本地文件,远程加载 url 除了添加授权和加载数据源不同之外,示例层面没变动,主要还是功能方面有了更多的可能性和交互性

 mWebView.loadUrl("http://www.baidu.com");

示例全码

package com.example.webviewproject

import android.annotation.SuppressLint
import android.os.Bundle
import android.view.View
import android.webkit.WebSettings
import android.webkit.WebView
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {

    private val mWebView: WebView by lazy {
        findViewById<WebView>(R.id.webView)
    }

    @SuppressLint("MissingInflatedId")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        initWebView(mWebView)
        //加载本地资源
		mWebView.loadUrl("http://www.baidu.com")
    }

    /**
    * 初始化WebSettings配置
    * */
    private fun initWebView(mWebView: WebView) {
        mWebView.clearCache(true)
        mWebView.clearHistory()
        val webSettings = mWebView.settings
        webSettings.cacheMode = WebSettings.LOAD_DEFAULT
        webSettings.domStorageEnabled = true
        webSettings.javaScriptEnabled = true
        webSettings.useWideViewPort = true
        webSettings.loadWithOverviewMode = true
        webSettings.builtInZoomControls = true
        webSettings.displayZoomControls = false
        webSettings.setSupportZoom(false)
        webSettings.javaScriptCanOpenWindowsAutomatically = true
        webSettings.allowFileAccess = true
        webSettings.layoutAlgorithm = WebSettings.LayoutAlgorithm.NARROW_COLUMNS
//        webSettings.setAppCacheEnabled(true);
//        webSettings.setAppCacheMaxSize(1024 * 1024 * 8);
//        webSettings.setAppCachePath(this.getApplicationContext().getCacheDir().getAbsolutePath());
//        webSettings.setUserAgentString(webSettings.getUserAgentString() + " ECTASR/1");
//        mWebView.setWebChromeClient(new CustomerActivity.WebChromeClient());
//        mWebView.webViewClient = WebViewClient()
        mWebView.isFocusable = true
        mWebView.isVerticalScrollBarEnabled = false
        mWebView.isHorizontalScrollBarEnabled = false
        mWebView.setOnLongClickListener { v: View? -> true }
    }
}

所遇问题

加载本地数据报 Not Found…

提前和你说一下,当你遇到这种问题,基本和我一样都是一个粗心的人儿!

  1. 关于 asserts 目录层级要求

关于通过对 WebView 加载本地Html的方式,这么多年来一直没有变过,但是我尝试多次,一直加载失败…

不清楚你是否也遇到了这样粗心的问题?关于存放html的文件需要放置于asserts目录内,而该目录是与 java、res 同级的目录文件,切勿放错了!

在这里插入图片描述

  1. 有心的朋友可能注意到了我在本地加载中注释了一行 mWebView.loadUrl("file:///android_asset/web/test.html") ,注意这里加载层级有没有多一层或者少一层之类的? 如下

在这里插入图片描述

加载网络资源报 404、500、Not Found… 等

  1. 首先将加载的链接放在游览器看是否可以正常加载?
  2. 是否添加了网络权限?
  3. 是否为https 的url?Android在9.0开始好像对安全有了提升,所以有此要求
  4. 项目中可以看一下另一端是否可正常加载,排除错误场景
  5. 项目中可以找返给你url的同事看看是否有错误地方,请教请教

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1973164.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

C语言初阶(10)

1.野指针 野指针就是指向未知空间的指针&#xff0c;有以下几种情况 &#xff08;1)指针未初始化 int main() {int a0;int*b;return 0; } 上面指针就是没有初始化&#xff0c;形成一种指向一个随机空间的地址的指针&#xff0c;我们可以修改成 int main() {int a0;int*bNU…

甘肃雀舌面:舌尖上的独特韵味

雀舌面&#xff0c;顾名思义&#xff0c;其面条形状如同雀舌般小巧精致。这一独特的形态并非偶然所得&#xff0c;而是源于精湛的手工技艺。制作雀舌面&#xff0c;对面粉的选择和面团的揉制有着极高的要求。经验丰富的师傅会精心挑选优质面粉&#xff0c;加入适量的水&#xf…

嵌入式学习---DAY17:共用体与位运算

链表剩余的一些内容 一、共用体 union 共用体名 名称首字母大写 { 成员表列&#xff1b; }&#xff1b; union Demo {int i;short s;char c; }; int main(void) {union Demo d;d.i 10;d.s 100;d.c 200;printf("%d\n", sizeof(d)); /…

一起学习LeetCode热题100道(24/100)

24.回文链表(学习) 给你一个单链表的头节点 head &#xff0c;请你判断该链表是否为 回文链表 。如果是&#xff0c;返回 true &#xff1b;否则&#xff0c;返回 false 。 示例 1&#xff1a; 输入&#xff1a;head [1,2,2,1] 输出&#xff1a;true 示例 2&#xff1a; …

鸿蒙Scroll布局,横向与纵向

注意&#xff0c;当横向scroll时&#xff0c;直接子元素的宽&#xff0c;不能100%&#xff0c; 当纵向scroll时&#xff0c;直接子元素的高&#xff0c;不能100%​​​​​​​ 1、纵向代码&#xff1a; 方法1&#xff1a;用数值计算&#xff0c;来设置中间的高度&#xff1a; …

Django函数视图和类视图

函数视图 1.全局环境的urls.py引入映入应用的urls&#xff0c;避免后期开发路由过多而导致杂乱 from django.contrib import admin from django.urls import path, includeurlpatterns [path(account/, include(account.urls)),#使用include函数引入&#xff0c;表示account…

搜狗爬虫(www.sogou.com)IP及UA,真实采集数据

一、数据来源&#xff1a; 1、这批搜狗爬虫&#xff08;www.sogou.com&#xff09;IP来源于尚贤达猎头网站采集数据&#xff1b; ​ 2、数据采集时间段&#xff1a;2023年10月-2024年7月&#xff1b; 3、判断标准&#xff1a;主要根据用户代理是否包含“www.sogou.com”和IP核实…

我菜单为什么跟着滑动了?!!—— 固定定位为什么会失效?

背景&#xff1a;最近在写一个H5页面项目&#xff0c;头部有个菜单栏&#xff0c;需要固定在顶部不动&#xff0c;但是滑动之后设置并没有生效&#xff0c;之前开发中也遇到过类似的固定失效的情况&#xff0c;就去详细了解了下有哪些可能导致固定定位失效的情况。希望有些场景…

数据库文件管理

数据库文件与普通文件区别: 1.普通文件对数据管理(增删改查)效率低 2.数据库对数据管理效率高,使用方便 常用数据库: 1.关系型数据库&#xff1a; 将复杂的数据结构简化为二维表格形式 大型:Oracle、DB2 中型:MySql、SQLServer 小型:Sqlite 2.非关…

【传知代码】主动学习实现领域自适应语义分割(论文复现)

在当今计算机视觉和人工智能领域&#xff0c;语义分割技术的发展正日益成为实现智能系统感知和理解复杂场景的关键。然而&#xff0c;传统的语义分割模型往往面临着在新领域或不同环境下适应性不足的挑战。为了解决这一问题&#xff0c;主动学习作为一种强大的技术手段&#xf…

每日学术速递8.2

1.A Scalable Quantum Non-local Neural Network for Image Classification 标题&#xff1a; 用于图像分类的可扩展量子非局部神经网络 作者&#xff1a; Sparsh Gupta, Debanjan Konar, Vaneet Aggarwal 文章链接&#xff1a;https://arxiv.org/abs/2407.18906 摘要&#x…

echarts图表--雷达图(参数详解)

这是官网给出的几种雷达图&#xff1a; Examples - Apache ECharts 雷达图&#xff08;Radar Chart&#xff09;是一种用于展示多维数据的图表&#xff0c;尤其适合于比较不同样本或观测在多个相同变量上的表现。在使用ECharts或PyEcharts等可视化库绘制雷达图时&#xff0c;…

Prometheus 监控 Nginx

作者&#xff1a;琉璃 一、Nginx_exporter安装 下载链接&#xff1a; https://github.com/discordianfish/nginx_exporter 下载nginx_exporter的docker镜像。 ocker pull fish/nginx-exporter先run一下&#xff0c;执行之后&#xff0c;会hold住&#xff0c;先不要关闭窗口…

IP 地址处理模块IPy

IP 地址处理模块IPy 介绍安装基本操作多网络计算方法 介绍 IP 地址规划是网络设计中非常重要的一个环节&#xff0c;规划的好坏会直接影响路由协议算法的效率&#xff0c;包括网络性能、可扩展性等方面&#xff0c;在这个过程当中&#xff0c;免不了要计算大量的 IP 地址&…

【python】Linux升级版本

目的 迁移项目包路径到服务器上 查看服务器包是否和本地已有项目python版本相同然后发现~嗯不一样 项目上包时用的3.8~ 服务器用的2.7 查看方法&#xff1a; python -version解决方案 一&#xff1a;项目所有包重新下载 二&#xff1a;升级服务器python版本 第二种步骤&…

【虚拟仿真】Unity3D中实现2DUI显示在3D物体旁边

推荐阅读 CSDN主页GitHub开源地址Unity3D插件分享简书地址QQ群:398291828大家好,我是佛系工程师☆恬静的小魔龙☆,不定时更新Unity开发技巧,觉得有用记得一键三连哦。 一、前言 这篇文章来实现2DUI显示在3D物体旁边,当我们需要在3D模型旁边显示2DUI的时候,比如人物的对…

医疗AI新突破!多模态对齐网络精准预测X光生存,自动生成医疗报告!

PS&#xff1a;写在前面&#xff0c;近期感谢很多小伙伴关注到我写的论文解读&#xff0c;我也会持续更新吖~同时希望大家多多支持本人的公主号~ 想了解更多医学图像论文资料请移步公主&#x1f478;号哦~~~后期将持续更新&#xff01;&#xff01; 关注我&#xff0c;让我们一…

智能驾驶学习笔记,第一天

智能驾驶是智能汽车的核心&#xff0c;指基于先进的传感器和计算平台&#xff0c;通过人工智能技术,让汽车具备自主行驶的能力&#xff0c;旨在辅助驾驶员安全、便捷、高效地完成驾驶任务。智能驾驶有助于减少交通事故、改善交通拥堵&#xff0c;并提高行驶安全性和驾乘舒适性。…

LaTeX行间公式内部公式居中,以及行间公式整体居左

文章目录 多行公式居中行间公式整体居左(不靠谱版) 多行公式居中 行间公式默认整体居中&#xff0c;此处多行公式居中指使用$$ $$时内部公式对齐方式. 普通对齐&#xff1a; \begin{aligned}公式 \end{aligned}上述环境只能用&左对齐或右对齐&#xff08;默认右&#xff0…

【数据结构】排序算法(快速排序、归并排序、排序算法总结)

当你清楚的知道自己想要什么,并且意愿非常强烈的时候,你总会有办法得到的。💓💓💓 目录 ✨说在前面 🍋知识点一:快速排序 • 🌰1.快速排序介绍 • 🌰2.霍尔排序 •🔥三数取中优化 •🔥小区间优化 • 🌰3.前后指针法 • 🌰4.快排非递归方法 🍋…