Android开发填坑之Bilibili视频页（移动版）的scheme跳转支持

最新推荐文章于 2024-04-22 21:23:55 发布

原创最新推荐文章于 2024-04-22 21:23:55 发布 · 8.2k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#android #webview #scheme

ANDROID 同时被 2 个专栏收录

37 篇文章

订阅专栏

工具效率

31 篇文章

订阅专栏

本文介绍了解决Bilibili视频播放页加载后出现白屏的问题，详细分析了问题的根本原因在于B站视频页面的JS脚本尝试跳转到一个特定的bilibili APP scheme地址，最终给出了在WebView中正确处理此类链接的解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题现象

打开Bilibili视频播放页，如https://m.bilibili.com/video/av23921215.html，正常打开该页面，但过一二秒后页面白屏。

根本原因

Bilibili视频放页的JS脚本会尝试跳转到一个地址，关键代码如下
这里写图片描述
该href的一个实例如下：

bilibili://video/23921215?h5awaken=cHZpZD0zOTY3NzhCMC03QjI4LTRDRjctOEQyNC1BNThBMDgwQ0Y1QUQxMDE1NzNpbmZvY18yMzkyMTIxNV8xNTI4ODU5NDE2NTAwJnVhPU1vemlsbGElMkY1LjAlMjAoTGludXglM0IlMjBVJTNCJTIwQW5kcm9pZCUyMDYuMC4xJTNCJTIwemhfQ04lM0IlMjBOZXh1cyUyMDUlM0IlMjBCdWlsZCUyRk00QjMwWiklMjBjbi5uaW5lZ2FtZS5nYW1lbWFuYWdlciUyRjExNDAlM0IlMjBOaW5lR2FtZUNsaWVudCUyRmFuZHJvaWQlMjB2ZSUyRjUuMS4yLjI1MSUyMHNpJTJGMWIxYmE3YzUtM2EwOS00MzdhLTllOWUtNmJjYmUzOGYxM2YzJTIwY2glMkZLRF8xJTIwc3MlMkYxMDgweDE3NzYlMjBuZyUyRmViNmU0NWE4YTY2N2E0MTczY2RiZjhlZGVhZDBlNjhmZGYlMjB1dCUyRldjaHBiS2JrbkZrREFLWlBLNGJwbVpTOCUyMG50JTJGd2lmaSUyMFVDQnJvd3NlciUyMFVDQlMlMkYyLjEzLjEuMTUmaXNBdXRvT3Blbj10cnVlJmJzb3VyY2U9dWNfYnJvd3Nlcl9hcHA%3D

其实该uri是bilibili APP的所支持的scheme之一，通过反编译其apk后，查看其AndroidManifest.xml，可以找到对应的Intent-filter定义，如下所示
这里写图片描述
如果没有对该uri作任何的拦截处理，WebView会默认加载该链接，出现找不到页面（白屏）。

解决方案

在WebViewClient的实现的shouldOverrideUrlLoading中支持bilibili://video/ uri的拦截，发起相应的intent，拉起Bilibili APP

TIPS分享

查找这类问题可以直接用Chrome的Web Inspector功能，另外借助能更改UA的插件。更改UA的插件能更正实的模拟自己的WebView组件，尽可能的在Chrome上重现问题。我目前使用的是 User-Agent Switcher for Chrome
Chrome的Web Inspector的网页（网站）代码的全局搜索功能是 (mac上是cmd + alt + F)，方便搜索与定位“问题”代码
排查Android WebView相关的排版问题，善用WebViewClient的shouldOverrideUrlLoading的回调（shouldOverrideUrlLoading在网页加载任何子页面，页面跳转都会回调），同时对页面的加载逻辑做拦截也是它的实现中。