>[success] # webview 初步 不论是手机或是电脑，连上网络后，必须使用浏览器（Browser）才能观看网页，除了手机内建浏览器以外，其实手机都有一个迷你浏览器，在Android被称为Webview，而iOS上则称为WKWebView，但作用是一样的：无须切换程序，就能快速观看网页内容。 值得一提的是Android上的Webview早期有安全问题，但Webview与Android捆绑在一起，导致安全问题更新困难，直到Android 5.0版本之后Webview正式成为独立项目，用户可以自行开启、关闭、更新Webview程序。 >[dabger] ##### webview 日常案例 1. 有时你开启游戏内的通知，会跳出一个网页贴在游戏画面前端 2. app点击开启网页链接时，往往不会直接跳到浏览器上，而是迅速的切换到一个窗口看到内容，这也是Webview的功劳 >[success] # webview 是什么 1. `WebView `用来展示网页的 view 组件，该组件是你运行自己的浏览器或者在你的线程中展示线上内容的基础。使用 `Webkit `渲染引擎来展示，并且支持前进后退等基于浏览历史，放大缩小，等更多功能。简单来说 `WebView `是手机中内置了一款高性能 `Webkit `内核浏览器，在 `SDK `中封装的一个组件。**不过没有提供地址栏和导航栏，只是单纯的展示一个网页界面。** 2. `WebView` 是一种嵌入式浏览器，可以在**移动应用程序中展示网页内容（理解为想在一个app 中让其可以打开一个网页）**。**它可以在应用中打开网页而不需要用户退出应用**。WebView 可以通过 HTML、CSS 和 JavaScript 来显示网页内容，并且支持与网页交互，例如点击链接或填写表单。WebView 主要用于移动应用程序开发，常用于安卓、IOS 和 Windows Phone 等移动平台。 3. `WebView `的原理是在移动应用程序中嵌入了一个浏览器引擎，这个引擎可以读取 `HTML、CSS 和 JavaScript` 代码，**并将其解析和渲染成网页内容** 4. `WebView` 可以为 JavaScript 提供一些特定的接口，这些接口可以让 JavaScript 访问手机的资源，例如相机、麦克风、GPS 等。JavaScript 可以调用这些接口来访问手机的资源，并与手机应用程序进行通信，`WebView` 也可以让 JavaScript 注册事件监听器，当手机应用程序发生特定事件时，JavaScript 可以接收到通知并执行相应的操作。 >[danger] ##### webview的好处 原生APP是将页面的布局设计，以及业务代码打包然后用户下载安装使用，而webview是通过加载html文件来进行页面的展示，当需要更新页面布局的或者业务逻辑变更时，如果是原生的APP就需要修改前端内容，升级打包，重新发布才可以使用最新的。 而通过webview方式的页面则只需要修改html代码或者js文件（如果是从服务器端获取，只要新的文件部署完成），用户重新刷新就可以使用更新后的，无需通过下载安装的方式完成升级。 >[danger] ##### 和原生app 通信 1. `WebView `所承载的页面，通过 `JS `与 `Native `进行通信，我们将这个通信**桥梁为 JSBridge **，**构建 Native 和非 Native 间消息通信的通道**，而且是 **双向通信的通道**。让混合开发中的『前端部分』可以方便地使用地址位置、摄像头甚至支付等 Native 功能。 * JS 向 Native 发送消息 : 调用相关功能、通知 Native 当前 JS 的相关状态等。 * Native 向 JS 发送消息 : 回溯调用结果、消息推送、通知 JS 当前 Native 的状态等。 2. JSBridge * 在**IOS**中，主要使用`WebViewJavascriptBridge`来注册 * 在**Android**中，需要通过`addJavascriptInterface`来注册 >[info] ## 参考 https://cloud.tencent.com/developer/article/1807367 [Webview是什么程序？ 为什么网站在Webview开启出了问题？ -iWare网页设计公司](https://www.iware.com.tw/qa-816.html) [schema 唤起app原理](https://zhuanlan.zhihu.com/p/58691238)