Docs
- Getting Started
- SME Uploader
- Companion
- List of Plugins
- Common Plugin Options
- Custom Stores
- Locale Packs
UI Elements
Sources
- Drag & Drop
- File Input
- Webcam
- Provider Plugins
- ⓒ Dropbox
- ⓒ Google Drive
- ⓒ OneDrive
- ⓒ Zoom
- ⓒ Import From URL
Destinations
File Processing
- Image Editor
- Robodog Introduction
- Robodog File Picker
- Robodog Form
- Robodog Upload
- Robodog Dashboard
- Transloadit
Miscellaneous
Contributing
Golden Retriever
The @sme-uploader/golden-retriever
plugin saves selected files in your browser cache, so that if the browser crashes, SME Uploader can restore everything and continue uploading as if nothing happened.
The Golden Retriever uses LocalStorage to store file metadata and SME Uploader state, and IndexedDB for small files. It also uses a Service Worker for all files because, unlike IndexedDB, a Service Worker can keep very large files. Service Worker storage is very temporary though, and doesn’t persist across browser crashes or restarts. It works very well, however, for accidental refreshes or closed tabs.
Installation
This plugin is published as the @sme-uploader/golden-retriever
package.
Install from NPM:
npm install @sme-uploader/golden-retriever |
In the CDN package, it is available on the SmeUploader
global object:
const GoldenRetriever = SmeUploader.GoldenRetriever; |
Usage
1. Bundle your own service worker sw.js
file with SME Uploader GoldenRetriever’s service worker. If you are using Browserify, just bundle it separately. For Webpack, there is a plugin serviceworker-webpack-plugin.
// sw.js require('@sme-uploader/golden-retriever/lib/ServiceWorker'); |
2. Register it in your app entry point:
// you app.js entry point const GoldenRetriever = require('@sme-uploader/golden-retriever'); uploader.use(GoldenRetriever, {serviceWorker: true}); if ('serviceWorker' in navigator) { navigator.serviceWorker .register('/sw.js') // path to your bundled service worker with GoldenRetriever service worker .then((registration) => { console.log('ServiceWorker registration successful with scope: ', registration.scope); }) .catch((error) => { console.log('Registration failed with ' + error); }) } |
Voilà, that’s it. Happy retrieving!