在IndexedDB中存儲圖像文件

我在試圖在IndexedDB本地存儲中存儲和映像文件時出現問題，我抓住文件對象並嘗試將它推入IndexedDB，但它似乎拋出並出錯：DOM異常：DATA_CLONE_ERR（ 25）在IndexedDB中存儲圖像文件

如何將文件對象（如下所示）轉換爲我可以存儲在indexedDB中的內容，並在以後從indexedDB中檢索？

attribute: 32 
contentType: "image/png" 
displayName: "image1" 
displayType: "PNG File" 
fileType: ".png" 
name:  "image1.png" 
path:  "C:\pictures\image1.png"

來源

2012-05-14 CLiown

你可以看看這個優秀的文章：http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/，看看是否有什麼相似之處，你是什麼試圖實現。 –

這是一篇很好的文章，但圖像存儲在本地而不是遠程 - 所以我沒有從用戶那裏得到一個blob。或者我得到一個blob，但它在文件對象內部 - 需要從那裏提取出來以後使用。 – CLiown

我相信有可能是一些與你的對象，使它看起來比將由鍵/值對你上面所列內容創建的對象字面不同的事情。我建議console.log在通過JSON.stringify後對物體進行剔除，以確保它與您的意圖一一對應。

IndexedDB使用HTML5 structured clone algorithm將對象複製到對象存儲中。根據the spec，錯誤和函數對象不能被克隆，並拋出一個DATA_CLONE_ERR，所以看作爲一個可能的解釋。

來源

2012-05-15 00:45:57 buley

該Mozilla黑客文章應該幫助 - http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/

來源

2012-08-10 20:41:58 axemclion

還要注意的是Chrome瀏覽器（至少到版本23）還不支持存儲在IndexedDB的斑點，並且將拋出你描述的，如果你想保存它們的錯誤直。在此期間，您將不得不使用FileSystem API。

來源

2012-09-05 04:02:41 alecf

只想指向[ticket]（https://code.google.com/p/chromium/issues/detail?id=108012）另請參閱[this]（https://groups.google.com/a /chromium.org/forum/#!msg/chromium-html5/8C-NWF2FajA/emHnikPpm3oJ） – user1460015

IndexedDB支持在Firefox和Chrome中存儲Blob。有關於將圖像存儲到IndexedDB的可用example。該代碼適用於最新版本的Chrome和Firefox。希望它有幫助。

來源

2012-12-19 00:56:13 stefan

你確定嗎？截至2013年10月10日，chrome仍然不支持在IndexedDB中存儲Blob，除非我缺少https://code.google.com/p/chromium/issues/detail?id=108012。您發佈的示例在Chrome中也不起作用，原因有很多，其中只有1個是blob問題。 –

我更新了該示例以在Chrome中工作。它在寫入數據庫時將blob轉換爲base64字符串，並在從數據庫讀取時返回blob。 https://gist.github.com/tantaman/6921973 –

您可以使用ydn-db API。

請參閱以下鏈接的「存儲文件和Blob數據」一節。

http://dev.yathit.com/ydn-db/transaction.html

乾杯。

來源

2013-12-09 19:47:32 jcs

在IndexedDB中存儲圖像文件

回答

相關問題