사용자 가이드
Capacitor에서 __CAPGO_KEEP_1__-캐시 사용 방법
capgo/capacitor-캐시 사용
@capgo/capacitor-asset-cache Capacitor에서 큰 CDN 이미지를 비디오를 앱 소유의 영구 저장소에 저장하고, Capacitor 웹뷰에서 지역 소스 URL을 반환합니다.
설치
npm install @capgo/capacitor-asset-cache
npx cap sync
이 플러그인이 노출하는 항목
bind- 로컬 자산 소스에 이미지 또는 비디오 요소를 연결하고 준비되면 업데이트합니다.src- 자산이 로컬로 존재하는 후에 로컬 소스 문자열을 반환합니다.resolve- 로컬 소스에 캐시 메타데이터를 포함한 로컬 소스를 반환합니다.configure- 기본 CDN 및 재검증 동작을 설정합니다.get,list,remove,clear, andgetCacheSize- 예시 사용법
- CDN을 한 번만 구성하고 상대 경로로 요소를 바인딩하세요.
- 요소는
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');
}
- 네이티브 fetch가 실행되는 동안, 그리고 로컬 소스 URL을 받고 data-asset-cache-state="loading" - 보호된 자산 ready.
img[data-asset-cache-state='loading'],
video[data-asset-cache-state='loading'] {
opacity: 0.45;
}
- 플러그인은 원격 파일을 가져오거나 재검증할 때 헤더를 전송합니다. 웹 요소는 여전히 로컬 소스 URL만 받습니다.
- 플러그인은 원격 파일을 가져오거나 재검증할 때 헤더를 전송합니다. 웹 요소는 여전히 로컬 소스 URL만 받습니다.
const src = await AssetCache.src('private/videos/intro.mp4', {
cdnUrl: 'https://cdn.example.com/assets/',
headers: {
Authorization: `Bearer ${token}`,
},
});
CDN URL이 없을 경우
설정하지 않으려면 절대 URL을 전달하세요 cdnUrl.
const src = await AssetCache.src('https://cdn.example.com/assets/videos/intro.mp4');
상대 경로는 설정된 CDN URL이 있거나 cdnUrl 또는 cdnUrl.
저장소 설명
iOS에서 파일은 Application Support 하위에 존재하고 iCloud 백업에서 제외됩니다. Android에서 파일은 앱 내부 파일 디렉토리 하위에 존재합니다. 시스템은 이러한 파일을 임시 캐시 파일로 취급하지 않으며, 앱을 삭제하거나, 앱 데이터를 초기화하면 clear(), remove() 그리고
삭제됩니다.
- GitHub: https://github.com/Capgo/capacitor-asset-cache/
- https://__CAPGO_KEEP_0__.com/Cap-go/__CAPGO_KEEP_1__-asset-cache/Docs: /docs/plugins/asset-cache/
Using @capgo/capacitor-asset-cache
만약에 Using @capgo/capacitor-asset-cache 영구적인 미디어 로딩을 계획하기 위해 사용하는 경우 @capgo/capacitor-자산 캐시 implementation details를 참조하세요. Getting Started implementation details를 참조하세요. @capgo/capacitor-다운로더 explicit background downloads를 위해 @capgo/capacitor-파일 일반적인 로컬 파일 접근을 위해