​方法一:鸿蒙根据url访问显示本地的html原生网页
前置准备:
提供具有网页显示能力的Web组件,引入头文件import { webview } from '@kit.ArkWeb';
注意本地index.html文件放到rawfile文件夹下
index.html文件示例代码:

<!DOCTYPE html>
<html lang="zh-CN">
<head>

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>简单的 HTML 页面</title>

</head>
<body>
<h1>欢迎来到我的简单页面</h1>
<p>这是一个简单的 HTML 页面示例,展示了基本的 HTML 结构。</p>
访问示例网站
</body>
</html>
实现效果:
图片
ets效果实现示例代码如下:(含代码详细讲解)
// 从 '@kit.ArkWeb' 模块中导入 webview 对象
import { webview } from '@kit.ArkWeb'
@Entry
@Component
struct Lianxi {
// 创建一个 webview.WebviewController 实例,用于控制 Web 视图
// webview.WebviewController 可以用来管理 Web 内容的加载、交互等操作
webViewController: webview.WebviewController = new webview.WebviewController()
build() {

Column() {
  Web({
    // src 属性指定要加载的 Web 内容的源文件
    // $rawfile('index.html') 表示使用名为 'index.html' 的原始文件作为 Web 内容
    src: $rawfile('index.html'),
    // controller 属性关联之前创建的 webview.WebviewController 实例
    // 这样可以通过该控制器对 Web 内容进行控制
    controller: this.webViewController
  })
}

}
}
效果实现了,是不是很神奇,但是点击a标签访问示例网站(外部),发现不能跳转外部网站,这该如何实现呢,请看第方法二,添加网络权限。
方法二:访问在线网页
前置准备:添加网络权限:ohos.permission.INTERNET,在main目录的module.json5文件中,在module下添加下面代码获取网络权限

"requestPermissions": [

  {
    "name": "ohos.permission.INTERNET"
  }
]

 然后回到方法一,发现a标签可以访问到示例网站(外部)了
通过Web实现访问外部网站,示例代码如下:
// 从 '@kit.ArkWeb' 模块中导入 webview 对象
import { webview } from '@kit.ArkWeb'
@Entry
@Component
struct Lianxi {
// 创建一个 webview.WebviewController 实例,用于控制 Web 视图
// webview.WebviewController 可以用来管理 Web 内容的加载、交互等操作
webViewController: webview.WebviewController = new webview.WebviewController()
build() {

Column() {
  Web({
    // src 属性指定要加载的 Web 内容的源文件
    // 'https://www.example.com/'为我们要访问的外部网站
    src: 'https://www.example.com/',
    // controller 属性关联之前创建的 webview.WebviewController 实例
    // 这样可以通过该控制器对 Web 内容进行控制
    controller: this.webViewController
  })
}

}
}
大家看到了把,获取了网络权限后,只需要将Web中src改为外部网站,就能在模拟器app中显示外部网站了。
图片
适用HarmonyOS NEXT / API12或以上版本