Wird Vue PWA verwenden, um Videos offline in Vue.js 3 zu speichern

Question

Ich verwende Vue 3 und Typescript. Ich versuche, ein Video in einer PWA abzuspielen. Online funktioniert es einwandfrei, aber wenn ich es offline versuche, wird das Video nicht geladen. Ich speichere das Video im Assets-Ordner und in der fertigen Version liegt das Video im Medienordner. Vielen Dank für Ihre Hilfe.

<video autoplay loop class="video">
    <source :src='require("@/assets/videos/test.mp4")' type='video/mp4'>
  </video>

Answer 1

我自己找到了解决方案。

可以使用 localstorage 或 indexedDB（用于视频）轻松完成。这仅适用于 iOS 上的小视频，因为移动 Safari 的大小限制为 50MB (https://developers.google.com/web/ilt/pwa/live-data-in-the-service-worker#how_much_can_you_store)

可以在这里找到另一个没有indexedDB的解决方案：https://stackoverflow.com/a/56337080/7439224