webview 站点
是随着小程序一同发布的静态文件站点，减轻开发者部署静态 html 文件负担，支持离线模式的技术。开发者可以在小程序中使用 webview 组件加载 webview 站点，实现小程序与 webview 站点的无缝衔接。
webview 站点的特性
支持离线模式，提高访问速度支持与小程序逻辑层通信webview 站点的使用
1. 声明 webview 站点文件目录
通过在 app.json 中声明 webviewRoot 字段，指定 webview 站点文件目录，如下：
// app.json{ "pages": [ "pages/index/index" ], "webviewRoot": "my-webview"}则小程序会以 webviewRoot 字段指定的目录进行部署，加载 webview 站点文件。
目录结构如下：
├── app.json└── pages ├── index │ ├── index.js │ ├── index.json │ ├── index.tyml │ └── index.tyss └── my-webview ├── index.html └── index.js注意：webviewRoot 字段只能在 app.json 中声明一次，且只能声明一次，使用相对路径，不支持绝对路径。注意目录的关系。
2. 使用 webview 组件加载 webview 站点
站点协议为 webview://，在小程序页面中使用 webview 组件，如下：
<!-- pages/index/index.tyml --><web-view id="yourId" src="webview://my-webview/index.html" bind:message="message" bind:load="load" bind:error="error" />其中 src 属性的值为 webview:// 开头，后面跟着 webviewRoot 字段指定的目录，以及 webview 站点文件的路径。
bind:message 事件：webview 站点与小程序逻辑层通信bind:load 事件：webview 站点加载成功bind:error 事件：webview 站点加载失败 ? 立即免费领取开发资源，体验涂鸦 MiniApp 小程序开发。
3. webview 站点与小程序逻辑层通信
webview 站点与小程序逻辑层通信，通过 @tuya-miniapp/jssdk 实现。
<!-- my-webview/index.html --><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>webview 站点</title></head><body> <script src="index.js"></script></body></html>// my-webview/index.js// 发送消息到逻辑层window.ty.miniProgram.postMessage({ data: { msg: '发到逻辑层 -> ' + Date.now() }}) // 接受来自逻辑层的消息window.ty.miniProgram.onMessage(function(event){ const messageData = event.data; // messageData = {msg: '发到 h5 里 -> 13991818111'}})// pages/index/index.jsPage({ onReady() { if (ty.createWebviewContext) { this.webviewContext = ty.createWebviewContext('yourId'); } }, // 接受来自 webview 站点的消息 message(event) { const messageData = event.detail // messageData = { msg: '发到逻辑层 -> 13891819819'} }, // 发送消息到 webview 站点 sendMessage() { this.webviewContext.postMessage({ data: { msg: '发到 h5 里 -> ' + Date.now(), }, }); }})
webview 站点文件类型
支持的文件后缀： .jpg .jpeg .png .gif .bmp .ico .tiff .svg .ttf .woff .woff2 .json .html .htm .js .css .mp3 .mp4
虽然 webview 站点支持的文件类型较多，并不意味着所有文件都可以放在 webview 站点中，开发者需要根据实际情况，选择合适的文件类型，以及文件大小。过大的文件会导致小程序加载速度变慢，影响用户体验。或无法上传到小程序平台。
使用条件
Tuya MiniApp Tools>= 0.5.10基础库版本 >= 2.14.2容器版本 >= 3.12.0@tuya-miniapp/jssdk >= 0.1.2
注意事项
webview 站点文件目录中的文件，不支持使用小程序的组件，如view、scroll-view 等，只支持静态 html 标签；开发者需保障 webview 站点文件的合法性，不得包含违法、色情、暴力等内容，否则将会被小程序平台封禁；js 脚本需保障安全性，不得包含恶意代码，否则将会被小程序平台封禁；js 脚本需保障兼容性，例如: 使用 es5 语法，不使用 es6 语法。否则可能移动端浏览器上出现兼容性问题； ? 立即免费领取开发资源，体验涂鸦 MiniApp 小程序开发。