鸿蒙ArkTS Web组件加载空白的问题原因及解决方案

news2024/9/30 13:26:23

问题症状

初学鸿蒙开发,按照官方文档Web组件文档《使用Web组件加载页面》示例中的代码照抄运行后显示空白,纠结之余多方搜索后扔无解决方法。

运行代码

import web_webview from '@ohos.web.webview'

@Entry
@Component
struct Index {
  controller: web_webview.WebviewController = new web_webview.WebviewController()

  build() {
    Column() {
      // 组件创建时,加载www.baidu.com
      Web({ src: 'www.baidu.com', controller: this.controller })
    }
  }
}

症状原因

无意间gitee搜索鸿蒙web组件项目代码时看到 Web组件抽奖案例(ArkTS) Readme文档中有一句话,如下:

本篇Codelab使用了在线网页,需要在配置文件module.json5文件里添加网络权限:ohos.permission.INTERNET

回头再看官方Web组件文档,同样有一句“页面加载过程中,若涉及网络资源获取,需要配ohos.permission.INTERNET网络访问权限。”如若改成“页面加载过程中,若涉及网络资源获取,需要在module.json5中配置ohos.permission.INTERNET网络访问权限。”岂不是更友好。

在这里插入图片描述

顿觉豁然开朗,原来是 module.json5配置文件 疏忽了,谨记勿忘。

在这里插入图片描述

解决方案

修改src/main/module.json5文件,在requestPermissions中增加ohos.permission.INTERNET权限配置项,保存运行,一切正常!

"requestPermissions": [
      {
        "name": "ohos.permission.INTERNET"
      }
    ],

附注

这里有个坑,官方文档没有说明清楚Web组件需要配置module.json5,而且requestPermissions 标签在module.json5文件中又缺省为空,小白用户看文档操作容易一脸懵。
在这里插入图片描述

参考文档

使用Web组件加载页面
module.json5配置文件
Web组件抽奖案例(ArkTS)

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

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

相关文章

企业计算机服务器中了halo勒索病毒怎么解密,勒索病毒解密数据恢复

在网络技术飞速发展的今天,越来越多的企业开始意识到企业数据安全的重要性,很多企业都会依赖数字化办公系统软件,并且通过系统软件将企业的重要数据存储在数据库中,为企业的生产运营提供了极大便利,但网络威胁一直存在…

关于在Java中打印三角形图形的汇总

前面写过一些关于打印三角形图形代码的文章,这里进行了汇总,话不多说,直接上代码: /*** 关于打印三角形的汇总*/ public class Work1 {public static void main(String[] args) {int num 5;/** 打印如下图形:* ** …

基于单片机智能循迹小车仿真设计

**单片机设计介绍,基于单片机智能循迹小车仿真设计 文章目录 一 概要二、功能设计设计思路 三、 软件设计原理图 五、 程序六、 文章目录 一 概要 基于单片机的智能循迹小车是一种通过传感器检测地面情况,并根据设定的规则进行动作控制的机器人。它使用…

如何正确使用缓存来提升系统性能

文章目录 引言什么时候适合加缓存?示例1示例2:示例3: 缓存应该怎么配置?数据分布**缓存容量大小:**数据淘汰策略 缓存的副作用总结 引言 在上一篇文章IO密集型服务提升性能的三种方法中,我们提到了三种优化…

LeetCode Hot100 39.组合总数

题目: 给你一个 无重复元素 的整数数组 candidates 和一个目标整数 target ,找出 candidates 中可以使数字和为目标数 target 的 所有 不同组合 ,并以列表形式返回。你可以按 任意顺序 返回这些组合。 candidates 中的 同一个 数字可以 无限…

css3实现动态心电图折线

css3实现动态心电图折线 M(moveto):需要两个参数(x轴和y轴坐标,移动到的点的x轴和y轴的坐标L(lineto):需要两个参数(x轴和y轴坐标),它会在当前位置…

04.HTML其他知识

HTML其他知识 1.HTML实体 介绍 在 HTML 中我们可以用一种特殊的形式的内容&#xff0c;来表示某个符号&#xff0c;这种特殊形式的内容&#xff0c;就是 HTML 实体。比如小于号 < 用于定义 HTML 标签的开始。如果我们希望浏览器正确地显示这些字符&#xff0c;我们必须在…

CGAL的3D网格生成

1、介绍 该软件包致力于生成离散三维域的各向同性简化网格。要网格化的域是三维空间的子集&#xff0c;需要有界。域可以连接或由多个组件组成和/或细分为几个子域。 边界曲面和细分曲面是平滑曲面或分段平滑曲面&#xff0c;由平面或曲面面片形成。表面可能表现出一维特征&…

成都工业学院2021级操作系统专周课程设计FCFS,SSTF,SCAN,LOOK算法的实现

运行环境 操作系统&#xff1a;Windows 11 家庭版 运行软件&#xff1a;CLion 2023.2.2 源代码文件 #include <iostream> #include <vector> #include <algorithm> #include <random> using namespace std;// 生成随机数 int generateRandomNumber…

12.13_黑马数据结构与算法笔记Java

目录 098 堆 heapify 3 099 堆 增删替换 100 堆 e01 堆排序 100 堆e02 求数组第k大元素 100 堆e03 求数据流第k大元素 100 堆e04 求数据流中位数1 100 堆e04 求数据流中位数2 100 堆e04 求数据流中位数3 101 二叉树 概述 102 二叉树 深度优先遍历 103 二叉树 前中后…

2024年顶级的9个 Android 数据恢复工具(免费和付费)

不同的事情可能会损坏您的Android手机并导致您丢失数据。但大多数时候&#xff0c;您可以使用取证工具恢复部分或全部文件。 问题可能来自手机的物理损坏、磁盘的逻辑故障、完整的系统擦除&#xff0c;或者只是简单的粗心大意。 但是&#xff0c;无论数据丢失的原因是什么&am…

路由基本原理

目录 一、路由器概述 二、路由器的工作原理 三、路由表的形成 四、路由配置 1.连接设备 2.进入系统模式 3.进入接口模式 4.配置网络 5.下一跳的设置 6.设置浮动路由 7.设置默认路由 一、路由器概述 路由器&#xff08;Router&#xff09;是一种用于连接不同网络或子…

MySQL和Redis有什么区别?

目录 一、什么是MySQL 二、什么是Redis 三、MySQL和Redis的区别 一、什么是MySQL MySQL是一种开源的关系型数据库管理系统&#xff08;RDBMS&#xff09;&#xff0c;它是最流行的数据库之一。MySQL以其高性能、可靠性和易用性而闻名&#xff0c;广泛应用于各种Web应用程序…

单片机的低功耗模式介绍

文章目录 简介一、功耗来源说明1.1、芯片工作模式1.2、静态损耗1.3、I/O额外损耗1.4、动态损耗 二、功耗如何测量三、降低功耗有什么方法3.1、选取合适的芯片工作模式3.2、降低工作频率3.3、关闭不需要使用的外设3.4、 降低静态电流损耗3.5、 周期采集供电3.6、 设置IO口状态 四…

MYSQL各种日志

感谢B站up主的视频分享 黑马程序员 MySQL数据库入门到精通&#xff0c;从mysql安装到mysql高级、mysql优化全囊括_哔哩哔哩_bilibili

FMETP STREAM 2.0

FMETPSTREAM简化了Unity3D中的直播,无需编码。设置和测试仅需5分钟。 "编码器模块"将Unity游戏视图、网络摄像头、桌面、声音和麦克风输入转换为字节数据,使其完美适用于各种流媒体场景。 优化的网络模块支持Server-clients连接类型,并允许您使用单个命令向 Serve…

el-date-picker限制选择7天内禁止内框选择

需求&#xff1a;elementPlus时间段选择框需要满足&#xff1a;①最多选7天时间。②不能手动输入。 <el-date-picker v-model"timeArrange" focus"timeEditable" :editable"false" type"datetimerange" range-separator"至&qu…

六.聚合函数

聚合函数 1.什么是聚合函数1.1AVG和SUM函数1.2MIN和MAX函数1.3COUNT函数 2.GROUP BY2.1基本使用2.2使用多个列分组2.3GROUP BY中使用WITH ROLLUP 3.HAVING3.1基本使用3.2WHERE和HAVING的区别 4.SELECT的执行过程4.1查询的结构4.2SELECT执行顺序4.3SQL执行原理 1.什么是聚合函数…

微服务实战系列之MQ

前言 从今天起&#xff0c;席卷北国的雪&#xff0c;持续了一整天&#xff0c;北京也不例外。这场意外的寒潮&#xff0c;把整个冬天渲染的格外cool。当然你可以在外面打雪仗、堆雪人、拉雪橇&#xff0c;也可以静坐屋内&#xff0c;来一场围炉煮茶的party。此刻&#xff0c;冬…

在IDEA中配置Git的Push键

前言 笔者在重新安装IDEA过程中需要重新绑定了Git&#xff0c;发现提交代码过程中push键消失了&#xff0c;所以笔者就以这篇文章记录一下Git配置push键的详细过程。 注意笔者当前IDEA版本为2019&#xff0c;可能和读者有所区别&#xff0c;但是操作思路是差不多的。 操作步…