Menggunakan @capgo/capacitor-asset-cache

@capgo/capacitor-asset-cache Mengarsipkan gambar dan video CDN besar di penyimpanan persisten milik aplikasi, kemudian mengembalikan URL sumber lokal untuk Capacitor webviews.

Instal

npm install @capgo/capacitor-asset-cache
npx cap sync

Apa yang Dibuka oleh Plugin Ini

bind - Menghubungkan elemen gambar atau video ke sumber asset lokal dan memperbarui ketika sudah siap.
src - Mengembalikan string sumber lokal setelah asset ada di lokasi.
resolve - Kembalikan sumber lokal bersama metadata cache.
configure - Atur perilaku CDN dan revalidasi default.
get, list, remove, clear, dan getCacheSize - Kelola cache secara eksplisit ketika dibutuhkan.

Contoh Penggunaan

Konfigurasi CDN sekali, kemudian ikat elemen dengan jalur relatif:

import { AssetCache } from '@capgo/capacitor-asset-cache';

AssetCache.configure({
  cdnUrl: 'https://cdn.example.com/assets/',
  revalidate: {
    strategy: 'ttl',
    maxAgeSeconds: 86400,
  },
});

const hero = document.querySelector<HTMLImageElement>('#hero');

if (hero) {
  AssetCache.bind(hero, 'images/hero.jpg');
}

Elemen mendapatkan data-asset-cache-state="loading" sambil fetch asli berjalan, kemudian menerima URL sumber lokal dan berpindah ke ready.

img[data-asset-cache-state='loading'],
video[data-asset-cache-state='loading'] {
  opacity: 0.45;
}

Aset Terlindung

Kepala dikirim oleh plugin ketika fetch atau revalidasi file remote. Elemen web masih menerima hanya URL sumber lokal.

const src = await AssetCache.src('private/videos/intro.mp4', {
  cdnUrl: 'https://cdn.example.com/assets/',
  headers: {
    Authorization: `Bearer ${token}`,
  },
});

Tanpa URL CDN Dasar

Kirim URL absolut ketika Anda tidak ingin mengonfigurasi cdnUrl.

const src = await AssetCache.src('https://cdn.example.com/assets/videos/intro.mp4');

Jalur relatif memerlukan baik konfigurasi cdnUrl atau panggilan per-keluhan cdnUrl.

Catatan Penyimpanan

Pada iOS, file hidup di bawah Support Aplikasi dan dikecualikan dari backup iCloud. Pada Android, file hidup di bawah direktori file internal aplikasi. Sistem tidak menganggap file ini sebagai file cache yang dapat dibuang, tetapi uninstall, hapus data aplikasi, dan clear()masih menghapusnya. remove() Referensi Lengkap

__CAPGO_KEEP_0__:

https://GitHub.com/Cap-go/__CAPGO_KEEP_1__-asset-cache/ https://github.com/Cap-go/capacitor-asset-cache/
Lanjutkan dari Menggunakan @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-asset-cache

Keep going from Using @capgo/capacitor-asset-cache

Penggunaan Menggunakan @capgo/capacitor-asset-cache untuk merencanakan muatan media yang persisten, hubungkannya dengan @capgo/capacitor-asset-cache untuk detail implementasi, Mulai untuk detail implementasi, @capgo/capacitor-downloader untuk download latar belakang yang eksplisit, dan @capgo/capacitor-file untuk akses file lokal umum.

Cache Asset

Tutorial tentang Cache Asset