Akan menggunakan Vue PWA untuk menyimpan video di luar talian dalam Vue.js 3

Question

Saya menggunakan Vue 3 dan Typescript. Saya cuba memainkan video dalam PWA. Ia berfungsi dengan baik dalam talian, tetapi apabila saya mencubanya di luar talian, video tidak akan dimuatkan. Saya menyimpan video dalam folder aset dan dalam versi siap video itu berada dalam folder media. terima kasih atas bantuan anda.

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

Answer 1

Saya jumpa sendiri penyelesaiannya.

Boleh dilakukan dengan mudah menggunakan localstorage atau indexedDB (untuk video). Ini hanya berfungsi untuk video kecil pada iOS kerana Safari mudah alih mempunyai had saiz 50MB (https://developers.google.com/web/ilt/pwa/live-data-in-the-service-worker#how_much_can_you_store )

Penyelesaian lain tanpa indexedDB boleh didapati di sini: https://stackoverflow.com/a/56337080/7439224