Javascript Safari BlobUrl 30mb限制

我目前正在构建一个媒体播放器web应用程序，它需要将音频和视频存储在客户端。要求还避免流媒体，并且它必须在Safari中工作

为此，我选择了IndexedDb，并将所有内容都存储在浏览器中。我通过网络音频api获取音频和播放没有问题，但是，我很快就遇到了视频问题

我目前的方法是从indexeddb获取视频，并为src属性创建blob url：

const objectUrl = createObjectURL(record.videoData);
this.video.src = objectUrl;

这种方法适用于小视频（任何低于30mb的视频），但对于较大的视频，播放会出现停顿，我注意到web inspector中对blob url的几个错误请求（见图）：

尽管“错误”请求加载和播放视频。唯一的问题是口吃。我还注意到，随着文件大小的增加，这种情况变得越来越糟糕

我环顾四周，但没有找到任何替代方法来实现无流播放。我看了一下Safari发行说明，注意到以下内容（来源：）：

更改了内存处理，以在帧的总内存大小低于30MB（从5MB增加到30MB）时保留动画图像的所有解码帧

这看起来很可能是口吃的原因——我假设safari正在尝试下载bloburl的片段

对于我试图实现的目标，是否有其他方法？这在chrome中表现得更好（没有口吃），但是，这必须在Safari中起作用

---

非常感谢您的帮助。

我认为有三件事可能会对您有所帮助

首先，您是否每次不再使用时都会撤销所有Bloburi？
从indexedDB检索Blob实际上会复制内存中的数据，这与input[file]不同，这意味着当您从这些Blob创建blobURI时，这些blobURI不会指向磁盘上的文件，而是会将Blob的数据绑定到内存中，直到blobURI被撤销或会话过期。因此，当您刷新页面时，内存中可能会多次保存相同的数据

然后，您可以尝试将大文件拆分为较小的块，并在需要时合并它们。如果您认为5MB文件工作正常，可以在循环中使用它来生成较小的Blob，您可以将其与

新Blob（[chunks]）

合并，并仅从合并的Blob创建blobURI。
这是一本书

---

虽然合并的blob解决方案在我这方面已经足够消除这些结巴的渲染，但在内存较少的设备上可能会失败，因此作为最后一种方法，您可以使用chunks思想，但不合并它们。相反，您可以使用，并向流提供从块中获得的arrayBuffers（通过

FileReader.readAsArrayBuffer

）。

您最终找到了解决方案吗？不幸的是，没有。因为口吃还不算太糟，所以我们只会选择较小的视频。恼人的请求错误仍然存在。开发者控制台打开时，这种口吃似乎更严重，但当控制台未打开时，它肯定仍然可见。是的，我还发现打开控制台窗口会降低性能。试试iOS 11.3 Beta版-我注意到我的应用程序在该版本的Mobile Safari中表现得更好。