一句话WebView 是一个可以嵌在 App 里面的浏览器窗口但它没有地址栏、没有标签页也没有前进后退按钮。App 用它直接显示网页。游戏里的公告、活动页、客服、用户协议、广告落地页、部分登录和支付页面很多都是 WebView 显示的。上一篇提到WebView 崩溃是 SDK 的重灾区原因也在这里。一、一个直观的比喻完整的浏览器Chrome / Safari WebView ┌──────────────────────────┐ ┌──────────────────────────┐ │ ← → ⟳ https://xxx.com ⋮ │ │ │ ├──────────────────────────┤ │ 网页内容 │ │ │ │ │ │ 网页内容 │ │ 外壳是你的 App │ │ │ │ │ └──────────────────────────┘ └──────────────────────────┘ 浏览器 外壳 网页引擎 WebView 只有网页引擎可以把浏览器拆成两部分部分作用WebView 有没有浏览器外壳地址栏、书签、标签页、设置没有由 App 自己决定网页引擎解析 HTML、执行 JavaScript、排版、绘制有这就是 WebView 的核心所以 WebView 就是把浏览器的内核借过来塞进自己的 App 里。二、各平台的 WebView平台组件内核特点Androidandroid.webkit.WebViewChromium独立于系统更新通过应用商店升级Android System WebView不同手机上版本差异很大iOS / iPadOSWKWebViewWebKitSafari 同款随系统升级网页在独立进程中运行iOS已淘汰UIWebViewWebKit性能差、单进程苹果已不再接受使用它的 App 提交WindowsWebView2ChromiumEdgePC 游戏启动器、桌面工具常用macOSWKWebViewWebKit同 iOS还有两种半个 WebView的方案经常被拿来替代它方案说明AndroidCustom Tabs/ iOSSFSafariViewController在 App 内弹出系统浏览器的界面共享浏览器的登录状态和 CookieApp 无法控制页面、无法注入 JS但更安全、更省事直接打开系统浏览器跳出 App最简单体验割裂游戏引擎本身Unity、Unreal没有内置跨平台的 WebView一般靠插件或 SDK 调用上面这些系统组件。三、它是怎么工作的1. 加载流程App 调用 loadUrl(https://game.com/notice) │ ├─ 网络请求 HTML、CSS、JS、图片 ├─ 解析 HTML → DOM 树解析 CSS → 样式 ├─ 执行 JavaScript ├─ 排版计算每个元素的位置和大小 └─ 绘制合成到屏幕上和浏览器打开网页的过程完全一样。2. 多进程现代 WebView 为了安全和稳定网页的渲染通常在另一个进程里进行你的 App 进程 渲染进程网页在这里跑 ┌──────────────┐ 通信 ┌─────────────────┐ │ 游戏、UI │ ◀──────▶ │ HTML / JS / 绘制 │ │ WebView 控件 │ └─────────────────┘ └──────────────┘好处网页崩了理论上不会把 App 一起带走。但要注意如果 App 没有处理渲染进程挂了这个事件结果可能是白屏甚至 App 被系统一起杀掉见后面的案例。3. JS Bridge网页和 App 互相通话WebView 最有用的能力之一网页里的 JS 可以调用 App 的原生代码原生代码也可以调用网页里的 JS。网页活动页 App游戏 点击领取奖励 ──── JS 调用原生 ────▶ 发放道具、刷新背包 ◀─── 原生调用 JS ────── 把玩家 ID、语言、Token 传给页面Android 示例classGameBridge{JavascriptInterface// 只有加了这个注解的方法才能被 JS 调用funclaimReward(id:String){mainHandler.post{Game.claim(id)}// JS 回调不在主线程要切回去}}webView.settings.javaScriptEnabledtruewebView.addJavascriptInterface(GameBridge(),Game)// 网页里window.Game.claimReward(daily_01)webView.evaluateJavascript(onPlayerInfo(${json}),null)// 原生调用 JSiOSWKWebView示例config.userContentController.add(self,name:game)// 网页里window.webkit.messageHandlers.game.postMessage({action: claim, id: daily_01})funcuserContentController(_c:WKUserContentController,didReceive msg:WKScriptMessage){// 处理消息}webView.evaluateJavaScript(onPlayerInfo(\(json)))四、游戏为什么要用 WebView用途为什么用网页而不是原生 UI公告、活动页不用发版就能改运营改网页玩家立刻看到用户协议、隐私政策法律文本经常更新网页最方便客服、问卷、社区第三方系统本身就是网页广告很多广告素材是 HTML5可试玩广告、落地页登录、支付部分第三方登录、海外支付通道提供网页流程H5 小游戏、活动玩法一套代码多端运行核心优势一句话内容在服务器上改了就生效不用重新提交审核。代价是性能、稳定性、体验都不如原生 UI。五、为什么 WebView 是重灾区1. 版本不可控Android 上 WebView 是独立更新的系统组件有的手机是最新版有的停在几年前的版本某些国内定制系统使用厂商自己修改过的内核某天 WebView 推送了一个有问题的更新所有 App 一起崩历史上真实发生过大规模事件。你的游戏代码一行没改崩溃率却突然涨了很可能就是它。2. 很重指标量级因设备而异首次创建几十到几百毫秒需要加载内核内存一个页面常见几十 MB复杂页面上百 MB额外进程渲染进程、GPU 进程游戏本身就吃内存再打开一个复杂的活动页低端机很容易被系统杀掉。3. 和游戏引擎的配合不好在 Unity 等引擎中WebView 是一个盖在游戏画面上面的原生窗口不是游戏里的一张图不能被游戏 UI 遮挡也不能做游戏里的特效、缩放、半透明过渡和游戏抢触摸事件、键盘焦点、返回键横竖屏切换、刘海屏适配要单独处理打开时游戏如果还在全速渲染会额外耗电发热。4. 安全风险风险说明JS Bridge 被滥用如果 WebView 加载了不受信任的网页例如广告跳转这个网页也能调用你暴露的原生方法老版本注入漏洞Android 4.2 之前addJavascriptInterface可以被 JS 通过反射执行任意代码本地文件访问打开allowFileAccess等设置可能让网页读取 App 私有文件明文 HTTP页面内容可被中间人篡改Token 泄露把登录凭证拼在 URL 里可能出现在日志、Referer 中5. 合规风险网页里的 JS 也可能埋了统计、广告追踪代码同样属于采集个人信息同样需要在隐私政策里说明。部分平台还明确限制Google 登录不允许在嵌入式 WebView 中进行需要使用系统浏览器或 Custom Tabs苹果对 App 内通过网页销售虚拟商品有严格规定游戏道具一般必须走 App 内购。六、使用建议1. 先问真的需要 WebView 吗场景推荐方案纯展示、不需要与游戏交互协议、外部链接Custom Tabs / SFSafariViewController或系统浏览器需要和游戏交互领奖、传玩家信息WebView JS Bridge高频、对体验要求高主界面公告、商城原生 UI 服务器下发配置OAuth 第三方登录系统浏览器 / Custom Tabs或官方 SDK2. 性能延迟创建不要在启动时创建 WebView用到再创建预热如果某页面必须秒开可在空闲时提前创建一个 WebView 实例用完销毁关闭页面时彻底释放避免内存泄漏打开时降低游戏负载暂停游戏渲染或降低帧率页面本身要轻压缩资源、使用缓存、避免大量动画和大图。overridefunonDestroy(){webView.apply{stopLoading()loadUrl(about:blank)(parentas?ViewGroup)?.removeView(this)removeAllViews()destroy()}super.onDestroy()}3. 稳定性处理渲染进程崩溃否则可能导致 App 退出或长时间白屏overridefunonRenderProcessGone(view:WebView,detail:RenderProcessGoneDetail):Boolean{// 渲染进程挂了移除并销毁这个 WebView提示用户或重新创建destroyWebView(view)returntrue// 返回 true 表示已处理App 不会被一起杀掉}funcwebViewWebContentProcessDidTerminate(_webView:WKWebView){webView.reload()// iOS网页进程被系统回收时会白屏需要重新加载}加载超时与降级网络差时显示重试按钮而不是一直转圈远程开关某些机型或 WebView 版本有问题时可以关闭入口或切换到系统浏览器监控崩溃平台上按 WebView 版本号统计崩溃率。4. 安全URL 白名单只允许加载自己的域名跳转到其他域名时交给系统浏览器JS Bridge 只对可信页面开放在处理调用时检查当前页面的 URL最小化暴露只暴露必要的方法参数做校验敏感操作发奖由服务器校验而不是相信客户端关闭不需要的能力webView.settings.apply{allowFileAccessfalseallowContentAccessfalsejavaScriptCanOpenWindowsAutomaticallyfalse}全程 HTTPS不要忽略证书错误onReceivedSslError中直接proceed()是常见的高危写法Token 不放在 URL 里通过 JS Bridge 或请求头传递。七、案例案例 1一夜之间崩溃率暴涨现象没有发版Android 崩溃率突然翻倍崩溃栈都在 WebView 的 native 库里。原因用户设备上的 Android System WebView 推送了有问题的更新。处理确认崩溃按 WebView 版本聚集通过远程开关暂时关闭 WebView 入口等待官方修复版本推送。案例 2打开活动页后游戏闪退现象低端机打开图片很多的活动页回到游戏时发现游戏已经被杀掉。原因游戏 WebView 渲染进程内存总和超过系统限制。修复精简活动页资源打开 WebView 时释放部分游戏资源或暂停渲染处理onRenderProcessGone。案例 3iOS 上活动页莫名白屏现象玩家打开活动页切到后台一会儿再回来页面一片空白。原因WKWebView 的网页进程在后台被系统回收App 没有处理。修复实现webViewWebContentProcessDidTerminate重新加载页面。案例 4Android 9 上一启动就崩现象接入新的广告 SDK 后Android 9 及以上设备启动崩溃提示 WebView 数据目录被多个进程使用。原因App 存在多个进程例如推送或广告 SDK 自带的进程多个进程同时使用 WebView。从 Android 9 开始这是不允许的。修复在非主进程中调用WebView.setDataDirectorySuffix()设置独立的数据目录或避免在其他进程中使用 WebView。案例 5广告页面调用了游戏接口现象安全审计发现从活动页跳转到第三方页面后第三方页面仍可以调用window.Game.xxx。原因JS Bridge 是绑定在 WebView 上的不管当前加载的是哪个网站都能调用。修复Bridge 方法中检查当前 URL 是否在白名单内非白名单域名直接用系统浏览器打开。案例 6Google 登录被拒绝现象海外版本在 WebView 中打开 Google 登录页面提示此浏览器或应用可能不安全。原因Google 禁止在嵌入式 WebView 中进行 OAuth 登录。修复使用 Google 官方登录 SDK或通过 Custom Tabs / 系统浏览器完成授权。案例 7网页回调导致游戏崩溃现象活动页点击领取后偶现闪退。原因JavascriptInterface方法运行在 WebView 的后台线程游戏代码在这里直接调用了引擎 API。修复Bridge 中统一切回游戏主线程处理。案例 8Unity 中 WebView 盖住了游戏弹窗现象打开公告后游戏里的确认弹窗被 WebView 挡住玩家无法点击。原因WebView 是原生视图层级永远在 Unity 画面之上。修复打开 WebView 时不要同时弹游戏 UI需要弹窗时在网页里实现或者先隐藏 WebView。八、总结问题答案WebView 是什么嵌在 App 里的浏览器内核没有浏览器外壳各平台Android WebViewChromium独立更新、iOS WKWebViewWebKit、Windows WebView2核心能力显示网页 JS Bridge 让网页和 App 互相调用游戏中用来做什么公告、活动、协议、客服、广告、部分登录支付最大优势内容在服务器上改了立刻生效不用发版为什么容易出问题版本不可控、内存重、渲染进程会崩、和引擎配合差安全要点URL 白名单、Bridge 校验来源、关闭文件访问、HTTPS、Token 不进 URL稳定性要点延迟创建、用完销毁、处理渲染进程崩溃、超时降级、远程开关替代方案Custom Tabs / SFSafariViewController、系统浏览器、原生 UI一句话WebView 是借来的浏览器好处是网页内容随改随用代价是你得替一个你控制不了的浏览器内核承担它的内存、崩溃和安全问题。能不用就不用要用就把它关进白名单、超时和远程开关的笼子里。