Skip to content

Commit

Permalink
added some new features and fixes
Browse files Browse the repository at this point in the history 
added `addAntiCacheParam` parameter to `getUrl` to add a random string to generated urls to prevent browser memory-caching
added `nullIfKeyNotExist` parameter to `getUrl`
added `defaultReturn` parameter to `getDataUri`
fixed `convertValue` in case of `null/undefined` returns
  • Loading branch information
@brainfoolong
brainfoolong committed Jan 31, 2023
1 parent c0e2bd6 commit 0863a4d
Show file tree
Hide file tree
Showing 6 changed files with 61 additions and 33 deletions.
8 changes: 7 additions & 1 deletion CHANGELOG.md
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,10 @@
## [1.3.0] 2023-01-31

* added `addAntiCacheParam` parameter to `getUrl` to add a random string to generated urls to prevent browser memory-caching
* added `nullIfKeyNotExist` parameter to `getUrl`
* added `defaultReturn` parameter to `getDataUri`
* fixed `convertValue` in case of `null/undefined` returns

## [1.2.0] 2022-08-02

* added `requestPersistentStorage` and `getStorageSpaceInfo`
Expand All @@ -8,7 +15,6 @@
* added `getDataUri` function
* fixed safari support for blob file storage by using ArrayBuffer instead


## [1.0.2] 2022-07-28

* Initial release
28 changes: 18 additions & 10 deletions dist/browstorjs.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
// BrowstorJS v1.2.0 @ https://github.com/NullixAT/browstorjs
// BrowstorJS v1.3.0 @ https://github.com/NullixAT/browstorjs
/**
* BrowstorJS
* Persistent key/value data storage for your Browser and/or PWA, promisified, including file support and service worker support, all with IndexedDB.
Expand Down Expand Up @@ -32,10 +32,11 @@ class BrowstorJS {
if (!msg || !msg.browstorJsGetFileUrl)
return false;
// @ts-ignore
const urlData = msg.browstorJsGetFileUrl;
event.source.postMessage({
'browstorJsFileUrl': {
'key': msg.browstorJsGetFileUrl.key,
'url': fileUrlPrefix + msg.browstorJsGetFileUrl.key + '/' + msg.browstorJsGetFileUrl.dbName
'url': fileUrlPrefix + urlData.key + '/' + urlData.dbName + (urlData.addAntiCacheParam ? '?c=' + Math.random() : '')
}
});
break;
Expand All @@ -47,7 +48,7 @@ class BrowstorJS {
}
const urlSplit = url.split('/');
const key = urlSplit[urlSplit.length - 2];
const dbName = urlSplit[urlSplit.length - 1];
const dbName = urlSplit[urlSplit.length - 1].split('?')[0];
// @ts-ignore
event.respondWith(new Promise(async function (resolve) {
const value = await (await BrowstorJS.open(dbName)).get(key);
Expand Down Expand Up @@ -206,9 +207,13 @@ class BrowstorJS {
/**
* Get file url to given storage key
* @param {string} key
* @return {Promise<string>}
* @param {boolean} nullIfKeyNotExist Return null when the key not exist in db (default is return the url anyway)
* @param {boolean} addAntiCacheParam Add ?c=randomnumber to the generated to prevent browser memory-caching
* @return {Promise<string|null>} Null if key does not exist and option is enabled
*/
async getUrl(key) {
async getUrl(key, nullIfKeyNotExist = false, addAntiCacheParam) {
if (nullIfKeyNotExist && !(await this.get(key)))
return null;
const self = this;
// is undefined in private browsing mode in some browsers or in ancient browsers
if (typeof navigator.serviceWorker === 'undefined') {
Expand All @@ -235,21 +240,21 @@ class BrowstorJS {
// send message to service worker to request the file url
navigator.serviceWorker.ready.then(function (serviceWorker) {
serviceWorker.active.postMessage({
'browstorJsGetFileUrl': { 'dbName': self.dbName, 'key': key }
'browstorJsGetFileUrl': { 'dbName': self.dbName, 'key': key, 'addAntiCacheParam': addAntiCacheParam }
});
});
});
}
/**
* Get a data uri that can be used as href or src for images
* If value in this key is not a file/blob than this will return a blank 1x1 pixel image data uri
* @param {string} key
* @param {string|null} defaultReturn The default value that is returned in case the key does not exist
* @return {Promise<string>}
*/
async getDataUri(key) {
async getDataUri(key, defaultReturn = 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=') {
const value = await this.convertValue(await this.get(key), 'blob');
if (!(value instanceof Blob))
return 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=';
return defaultReturn;
return new Promise(function (resolve) {
const reader = new FileReader();
// @ts-ignore
Expand Down Expand Up @@ -401,7 +406,10 @@ class BrowstorJS {
* @private
*/
async convertValue(value, to) {
if (value instanceof Blob && to === 'data') {
if (value === null || value === undefined) {
return null;
}
else if (value instanceof Blob && to === 'data') {
return this.blobToBlobDataObject(value);
}
else if (to === 'blob' && typeof value === 'object' && typeof value.type !== 'undefined' && value.type === 'browstorJsBlobData') {
Expand Down
28 changes: 18 additions & 10 deletions docs/scripts/browstorjs.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
// BrowstorJS v1.2.0 @ https://github.com/NullixAT/browstorjs
// BrowstorJS v1.3.0 @ https://github.com/NullixAT/browstorjs
/**
* BrowstorJS
* Persistent key/value data storage for your Browser and/or PWA, promisified, including file support and service worker support, all with IndexedDB.
Expand Down Expand Up @@ -32,10 +32,11 @@ class BrowstorJS {
if (!msg || !msg.browstorJsGetFileUrl)
return false;
// @ts-ignore
const urlData = msg.browstorJsGetFileUrl;
event.source.postMessage({
'browstorJsFileUrl': {
'key': msg.browstorJsGetFileUrl.key,
'url': fileUrlPrefix + msg.browstorJsGetFileUrl.key + '/' + msg.browstorJsGetFileUrl.dbName
'url': fileUrlPrefix + urlData.key + '/' + urlData.dbName + (urlData.addAntiCacheParam ? '?c=' + Math.random() : '')
}
});
break;
Expand All @@ -47,7 +48,7 @@ class BrowstorJS {
}
const urlSplit = url.split('/');
const key = urlSplit[urlSplit.length - 2];
const dbName = urlSplit[urlSplit.length - 1];
const dbName = urlSplit[urlSplit.length - 1].split('?')[0];
// @ts-ignore
event.respondWith(new Promise(async function (resolve) {
const value = await (await BrowstorJS.open(dbName)).get(key);
Expand Down Expand Up @@ -206,9 +207,13 @@ class BrowstorJS {
/**
* Get file url to given storage key
* @param {string} key
* @return {Promise<string>}
* @param {boolean} nullIfKeyNotExist Return null when the key not exist in db (default is return the url anyway)
* @param {boolean} addAntiCacheParam Add ?c=randomnumber to the generated to prevent browser memory-caching
* @return {Promise<string|null>} Null if key does not exist and option is enabled
*/
async getUrl(key) {
async getUrl(key, nullIfKeyNotExist = false, addAntiCacheParam) {
if (nullIfKeyNotExist && !(await this.get(key)))
return null;
const self = this;
// is undefined in private browsing mode in some browsers or in ancient browsers
if (typeof navigator.serviceWorker === 'undefined') {
Expand All @@ -235,21 +240,21 @@ class BrowstorJS {
// send message to service worker to request the file url
navigator.serviceWorker.ready.then(function (serviceWorker) {
serviceWorker.active.postMessage({
'browstorJsGetFileUrl': { 'dbName': self.dbName, 'key': key }
'browstorJsGetFileUrl': { 'dbName': self.dbName, 'key': key, 'addAntiCacheParam': addAntiCacheParam }
});
});
});
}
/**
* Get a data uri that can be used as href or src for images
* If value in this key is not a file/blob than this will return a blank 1x1 pixel image data uri
* @param {string} key
* @param {string|null} defaultReturn The default value that is returned in case the key does not exist
* @return {Promise<string>}
*/
async getDataUri(key) {
async getDataUri(key, defaultReturn = 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=') {
const value = await this.convertValue(await this.get(key), 'blob');
if (!(value instanceof Blob))
return 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=';
return defaultReturn;
return new Promise(function (resolve) {
const reader = new FileReader();
// @ts-ignore
Expand Down Expand Up @@ -401,7 +406,10 @@ class BrowstorJS {
* @private
*/
async convertValue(value, to) {
if (value instanceof Blob && to === 'data') {
if (value === null || value === undefined) {
return null;
}
else if (value instanceof Blob && to === 'data') {
return this.blobToBlobDataObject(value);
}
else if (to === 'blob' && typeof value === 'object' && typeof value.type !== 'undefined' && value.type === 'browstorJsBlobData') {
Expand Down
4 changes: 2 additions & 2 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "browstorjs",
"version": "1.2.0",
"version": "1.3.0",
"description": "Persistent key/value data storage for your Browser and/or PWA, promisified, including file support and service worker support, all with IndexedDB.",
"scripts": {
"dist": "node ./node_modules/typescript/bin/tsc --project tsconfig.json && node build/dist.js"
Expand Down
24 changes: 15 additions & 9 deletions src/browstorjs.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,10 +47,11 @@ export default class BrowstorJS {
const msg = event.data
if (!msg || !msg.browstorJsGetFileUrl) return false
// @ts-ignore
const urlData = msg.browstorJsGetFileUrl
event.source.postMessage({
'browstorJsFileUrl': {
'key': msg.browstorJsGetFileUrl.key,
'url': fileUrlPrefix + msg.browstorJsGetFileUrl.key + '/' + msg.browstorJsGetFileUrl.dbName
'url': fileUrlPrefix + urlData.key + '/' + urlData.dbName + (urlData.addAntiCacheParam ? '?c=' + Math.random() : '')
}
})
break
Expand All @@ -63,7 +64,7 @@ export default class BrowstorJS {

const urlSplit = url.split('/')
const key = urlSplit[urlSplit.length - 2]
const dbName = urlSplit[urlSplit.length - 1]
const dbName = urlSplit[urlSplit.length - 1].split('?')[0]

// @ts-ignore
event.respondWith(new Promise<Response>(async function (resolve) {
Expand Down Expand Up @@ -226,9 +227,12 @@ export default class BrowstorJS {
/**
* Get file url to given storage key
* @param {string} key
* @return {Promise<string>}
* @param {boolean} nullIfKeyNotExist Return null when the key not exist in db (default is return the url anyway)
* @param {boolean} addAntiCacheParam Add ?c=randomnumber to the generated to prevent browser memory-caching
* @return {Promise<string|null>} Null if key does not exist and option is enabled
*/
async getUrl (key: string): Promise<string> {
async getUrl (key: string, nullIfKeyNotExist = false, addAntiCacheParam: false): Promise<string | null> {
if (nullIfKeyNotExist && !(await this.get(key))) return null
const self = this
// is undefined in private browsing mode in some browsers or in ancient browsers
if (typeof navigator.serviceWorker === 'undefined') {
Expand All @@ -255,21 +259,21 @@ export default class BrowstorJS {
// send message to service worker to request the file url
navigator.serviceWorker.ready.then(function (serviceWorker) {
serviceWorker.active.postMessage({
'browstorJsGetFileUrl': { 'dbName': self.dbName, 'key': key }
'browstorJsGetFileUrl': { 'dbName': self.dbName, 'key': key, 'addAntiCacheParam': addAntiCacheParam }
})
})
})
}

/**
* Get a data uri that can be used as href or src for images
* If value in this key is not a file/blob than this will return a blank 1x1 pixel image data uri
* @param {string} key
* @param {string|null} defaultReturn The default value that is returned in case the key does not exist
* @return {Promise<string>}
*/
async getDataUri (key: string): Promise<string> {
async getDataUri (key: string, defaultReturn: string | null = 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='): Promise<string> {
const value = await this.convertValue(await this.get(key), 'blob')
if (!(value instanceof Blob)) return 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='
if (!(value instanceof Blob)) return defaultReturn
return new Promise<string>(function (resolve) {
const reader = new FileReader()
// @ts-ignore
Expand Down Expand Up @@ -426,7 +430,9 @@ export default class BrowstorJS {
* @private
*/
private async convertValue (value: any, to): Promise<any> {
if (value instanceof Blob && to === 'data') {
if (value === null || value === undefined) {
return null
} else if (value instanceof Blob && to === 'data') {
return this.blobToBlobDataObject(value)
} else if (to === 'blob' && typeof value === 'object' && typeof value.type !== 'undefined' && value.type === 'browstorJsBlobData') {
return this.blobDataObjectToBlob(value)
Expand Down

0 comments on commit 0863a4d

Please sign in to comment.