WebView中Video的缓冲爬坑志

背景

在自己研发的手机APP上（Android tbs x5webview/iOS wkwebview）打开H5页面，页面上使用了video播放视频，当进入其它页面或返回上级页面，又或者暂停播放的时候，视频的缓冲并未停止，还在持续下载。

初级解决方案

我们在页面退出的时候，把video节点的src属性设置为""，或者根据[MDN官方文档](!https://developer.mozilla.org/en-US/docs/Web/Guide/Audio_and_video_delivery) `Stopping the download of media`这一小节的描述，使用removeAttribute移除src属性。

此时在电脑的浏览器devtool里面inspect手机上的页面，看network栏，确实是停止下载视频数据了，万事大吉！

然后悲剧发生了，某人测试突然发现访问了几个页面之后，数据流量消耗了5.4G，于是问题爆发了。

使用抓包工具，发现确实无论在Android还是在iOS上，视频缓冲的下载都没有停止。

 爬坑

然后开始了爬坑之旅，折腾了近两天，被残酷的现实打败了，只能使用最初想到的一个弱弱的方案解决问题，这里记录一下以共勉

iOS

在H5层面折腾了很久，排除了各种vue组件的影响之后，仍然没有解决问题，只能回归到native去找原因。用纯净的wkwebview发现没有这种问题，然后逐步定位发现是拦截器造成的。

对于http服务器上的视频资源(mp4，m3u8等)

只要使用了

[N