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

问题症状

初学鸿蒙开发,按照官方文档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)

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

MuMu模拟器12如何连接adb?

一、MuMu模拟器12端口查看 MuMu模拟器12现已支持adb同时连接多个模拟器进行调试的操作,可以参考以下步骤操作,查看MuMu模拟器12本体以及多开模拟器的adb端口: 单开的MUMU模拟器12可通过模拟器右上角菜单-问题诊断,获取ADB调试端…

VM-Linux 桥接网络设置

VM-Linux 桥接网络设置 文章目录 VM-Linux 桥接网络设置什么是桥接网络环境工具关键配置VM设置CentOS7配置 什么是桥接网络 网络桥接是将两个或多个独立的网络进行连接的一种方法。它可以把两个网络的数据传输机制集成在一起,使得用户可以更顺畅地访问各个网络&…

Linux实操——安装Mysql

安装Mysql 一、检查是否已经安装了mariadb数据库,并卸载二、下载mysql包,并通过ftp上传到服务器三、解压安装包四、创建数据存储文件夹五、创建执行mysqld命令的用户,并初始化mysql六、启用传输安全七、启动mysql,验证是否安装成功 总结 博主…

stm32F407-GPIO的使用——点亮LED并且讲解各个寄存器

stm32F407-GPIO的使用——点亮LED并且讲解各个寄存器 本文为stm32GPIO的介绍与使用,例子是简单的LED点亮。 一、 GPIO GPIO(General Purpose I/O Ports)意思为通用输入/输出端口,通俗地说, 就是一些引脚,可…

数据结构第六课 -------迭代排序(快速排序和归并排序)

作者前言 🎂 ✨✨✨✨✨✨🍧🍧🍧🍧🍧🍧🍧🎂 ​🎂 作者介绍: 🎂🎂 🎂 🎉🎉&#x1f389…

linux 调试工具 GDB 使用

gdb是linux下常用的代码调试工具,本文记录常用命令。 被调试的应用需要使用 -g 参数进行编译,如不确定可使用如下命令查看是否支持debug readelf -S filename | grep "debug" 启动调试 gdb binFile 例如要调试sshd: 调试带参数…

【淘宝网消费类电子产品销售数据可视化】

淘宝网消费类电子产品销售数据可视化 引言数据爬取与处理数据可视化系统功能1. 总数据量分析2. 店铺总数据3. 店铺销售额排名4. 不同电子商品销售价格5. 单个商品价格排名6. 不同省份平均销量7. 不同地区的平均销售额8. 省份数量9. 每个省份有用的平均个数 创新点结语 引言 随…

平头哥玄铁 E902 编译与使用

玄铁 E902 是平头哥半导体有限公司自主研发的极低功耗、极低成本嵌入式 CPU 核,以 8 位 CPU 的成本获得 32 位嵌入式 CPU 的运行效率与性能。 E902 兼容 RISC-V 指令架构,采用 16/32 位混合编码系统,指令系统与流水线硬件结构精简高效&#x…

单片机的低功耗模式介绍

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

Visual Studio Code (Vscode)配置LaTeX

Visual Studio Code (Vscode)配置LaTeX 实操记录 第一步高效检索,找到官方的、靠谱的安装教程,最好多找几个,英文、中文教程都需要 LaTeX WorkshopInstallation and basic settingsHow to install LaTeX (with previews & autocomplete…

RK3568全国产化多网口板卡带poe供电,支持鸿蒙麒麟系统

信迈XM-3568-01主板采用瑞芯微RK3568四核Cortex-A55 处理器,主频最高可达2.0GHz,效能有大幅提升最高可配8GB内存容量,频率高达1600MHz;支持全链路ECC,让数据更安全可靠配置双千兆自适应RJ45以太网口,并扩展…

ArkTS的状态管理机制(State)

什么是ArkTS的状态管理机制 声明式UI中,是以状态(State)来驱动视图更新的(View)。 状态是指驱动视图更新的数据(被装饰器标记的变量)。 视图是指UI描述渲染得到的用户页面。 互动事件可以改变状态的值。状态改变以后,又会触发事件,渲染页面。…

电子取证中Chrome各版本解密Cookies、LoginData账号密码、历史记录

文章目录 1.前置知识点2.对于80.X以前版本的解密拿masterkey的几种方法方法一 直接在目标机器运行Mimikatz提取方法二 转储lsass.exe 进程从内存提取masterkey方法三 导出SAM注册表 提取user hash 解密masterkey文件(有点麻烦不太推荐)方法四 已知用户密…

QT作业4

实现一个闹钟&#xff0c;当输入时间后&#xff0c;点击启动到达时间后循环播报三遍&#xff0c;便签内容 头文件&#xff1a; #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include <QTextToSpeech> //文本转语言类 #include <QTimerEvent> //定…

国产数据库适配-达梦(DM)

1、通用性 达梦数据库管理系统兼容多种硬件体系&#xff0c;可运行于X86、X64、SPARC、POWER等硬件体系之上。DM各种平台上的数据存储结构和消息通信结构完全一致&#xff0c;使得DM各种组件在不同的硬件平台上具有一致的使用特性。 达梦数据库管理系统产品实现了平台无关性&…

机器视觉系统选型-线光源分类及应用场景

标准线光源 从线性LED的发光面照射漫射光 玻璃划痕检测印刷字符检测手机屏幕检测PCB板检测 高亮线光源 从线性LED的发光面照射高亮度漫射光高速流水线检测表面印刷检测表面缺陷检测 集光型线光源 从线性LED的发光面照射直射光划痕缺陷检测印刷字符检测布料检测 同轴线光源 与相…

基于深度学习的人脸测距&社交距离过近警报系统

1.研究背景与意义 项目参考AAAI Association for the Advancement of Artificial Intelligence 研究背景与意义 近年来&#xff0c;随着深度学习技术的快速发展&#xff0c;人脸识别技术在各个领域得到了广泛应用。其中&#xff0c;人脸测距和社交距离过近警报系统成为了人们…

Leetcode刷题笔记题解(C++):328. 奇偶链表

思路&#xff1a;遍历链表生成奇链表和偶链表&#xff0c;然后拼接两个链表生成新的链表。 /*** Definition for singly-linked list.* struct ListNode {* int val;* ListNode *next;* ListNode() : val(0), next(nullptr) {}* ListNode(int x) : val(x), ne…

链路追踪详解(四):分布式链路追踪的事实标准 OpenTelemetry 概述

目录 OpenTelemetry 是什么&#xff1f; OpenTelemetry 的起源和目标 OpenTelemetry 主要特点和功能 OpenTelemetry 的核心组件 OpenTelemetry 的工作原理 OpenTelemetry 的特点 OpenTelemetry 的应用场景 小结 OpenTelemetry 是什么&#xff1f; OpenTelemetry 是一个…

ubuntu20.04在noetic下编译orbslam2

ubuntu20.04在noetic下编译orbslam2 参考链接1&#xff1a;https://blog.csdn.net/qq_58869016/article/details/128660588 参考链接2&#xff1a;https://blog.csdn.net/dong123456789e/article/details/129693837 在noetic下的安装环境 1.库安装 sudo apt-get update sudo …