Dexie.js: Can't add File to database

[bkjohnson]

I've read issue https://github.com/dfahlander/Dexie.js/issues/172 and I've tried to be able to add a file using this code:

db = new Dexie('Test')
db.version(1).stores({
  items: "blob"
})

db.open().catch(function(error) {
  alert('Uh oh : ' + error)
})

// Do stuff, get file

db.items.add({
  blob: file
})

And I get errors:

Unhandled rejection: DataError: Failed to execute 'add' on 'IDBObjectStore': Evaluating the object store's key path yielded a value that is not a valid key.

I've tried items: "++id, blob" as well or including the key as a second parameter to .add() but I still get errors. Am I going about this the wrong way?

[nponiros]

Are you getting other errors when using an autoincrementing id or the same error?

[bkjohnson]

I get the same error. Using autoincrementing id while also specifying the id in .add() gives me this instead:

Unhandled rejection: DataError: Failed to execute 'add' on 'IDBObjectStore': The object store uses in-line keys and the key parameter was provided.

[bkjohnson]

If it helps, I'm trying to emulate this using Dexie

[nponiros]

Don't use the id parameter of add if you are using an autoincrement key. Indexeddb does not allow that.
It should work with autoincrement and add({blob: file}). So far the errors you posted are issues with the key..

[bkjohnson]

I understand the error that I get from using the id parameter as well the autoincrementing id, but I'm still unable to actually store the file object. If I use add( {blob: 'test' }) it works fine, so the issue seems to be with the file.

[nponiros]

Then I'm afraid I can't really help you. Perhaps try a different browser in case you haven't done that already.

[bkjohnson]

Good catch! It doesn't work on Chromium 60.0.3112.78, but it did work on Firefox 55.0.2 Since the native IndexedDB example worked on Chromium I'll probably to to implement it that way to see if the issue really is with Chromium or if it is how Dexie is wrapping IndexedDB.

[bkjohnson]

As an update, the native IndexedDB implementation did allow me to add files, so it looks like the issue is with Dexie and not the browser.

[dfahlander]

Dexie 2.x supports storing blobs, but not indexing them or using them as primary keys, as you are doing. That is not possible with IndexedDB, so it's not a Dexie issue. Using the blob as primary key is not allowed, even in IndexedDB 2.0.

It is important to distinguish the set of types allowed to store in IndexedDB from the set of types allowed to index. Pretty much any built-in type can be stored (blobs, files, intl types, sets, maps, ImageData, etc.). But there is a very limited number of types that can be used as primary key or being successfully indexed:

• string
• number
• Date
• Arra

IndexedDB 2.0 (supported by latest Chrome, Safari and Firefox(*) ) adds binary keys to the set of indexable keys:

• ArrayBuffer
• Uint8Array
• Int8Array
• Uint16Array
• Int16Array
• Uint32Array
• Int32Array
• Float32Array
• Float64Array

(*) Firefox has one issue when using binary key as primary key: get(), delete() wont work.

Blobs are not indexable, but in case you need them as primary key, you should first convert the blob to an ArrayBuffer and index that instead.