files/zh-tw/web/api/indexeddb_api/index.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80

---
title: IndexedDB
slug: Web/API/IndexedDB_API
tags:
  - Database
  - IndexedDB
  - bug-840092
translation_of: Web/API/IndexedDB_API
---
<div>{{SeeCompatTable}}</div>

<p>IndexedDB 為用戶端的儲存用 API，可用於大量的結構化資料，並透過索引功能而高效率搜尋資料。<a href="https://developer.mozilla.org/zh-TW/docs/DOM/Storage" title="DOM/Storage">DOM Storage</a> 適合儲存較少量的資料；IndexedDB 則適合大量結構化資料的儲存方案。</p>

<p>本篇文章僅為 API 物件的入門技術說明。若需進一步了解，則請參閱 <a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB" title="IndexedDB/Basic_Concepts_Behind_IndexedDB">IndexedDB 基本概念</a>。更多細節則可參閱<a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/Using_IndexedDB" title="IndexedDB/Using_IndexedDB">使用 IndexedDB</a>。</p>

<p>IndexedDB 提供不同 APIs 用於同步與非同步的存取作業。同步 API 僅能用於<a href="https://developer.mozilla.org/zh-TW/docs/DOM/Worker" title="Worker">Web Workers</a> 之中，但尚未有瀏覽器支援同步API。非同步 API 則用於 Web Workers 內外均可，但 Firefox 目前尚未建構。</p>

<h2 id="非同步_API">非同步 API</h2>

<p>非同步API不會阻塞呼叫它的執行緒。若要非同步存取資料庫，可於 <a href="https://developer.mozilla.org/zh-TW/docs/DOM/window" title="DOM/window">window</a> 物件的 <a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/IDBEnvironment#attr_indexedDB" title="IndexedDB/IDBEnvironment#attr indexedDB">indexedDB</a> 屬性上呼叫 <a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/IDBFactory#open" title="IndexedDB/IDBFactory#open">open</a>()。此函式將回傳 IDBRequest 物件 (IDBOpenDBRequest)，開始非同步存取資料庫；呼叫端程式利用IDBRequest物件上的事件來進行非同步溝通。</p>

<div class="note">
<p><strong>注意：</strong>在舊版瀏覽器 (Gecko 16 版之前的 indexedDB 屬性；Chrome 中的 webkitIndexedDB；IE 10 中的 msIndexedDB) 中的 indexedDB 物件，均具備前綴屬性。</p>
</div>

<ul>
 <li><a href="/zh-TW/docs/IndexedDB/IDBFactory" title="IndexedDB/IDBFactory"><code>IDBFactory</code></a> 可存取資料庫。此介面是透過全域物件 <code>indexedDB</code> 所建構，因此成為 API 的切入點。</li>
 <li><a href="/zh-TW/docs/IndexedDB/IDBCursor" title="IndexedDB/IDBCursor"><code>IDBCursor</code></a> 將依序存取物件與索引。</li>
 <li><a href="/zh-TW/docs/IndexedDB/IDBCursorWithValue"><code>IDBCursorWithValue</code></a> 將依序存取物件與索引，並回傳指標 (Cursor) 的目前數值。</li>
 <li><a href="/zh-TW/docs/IndexedDB/IDBDatabase" title="IndexedDB/IDBDatabase"><code>IDBDatabase</code></a> 代表到資料庫的連線。這也是能與資料庫互動的唯一方式。</li>
 <li><a href="/zh-TW/docs/IndexedDB/IDBEnvironment" title="IndexedDB/IDBEnvironment"><code>IDBEnvironment</code></a> 可存取用戶端的資料庫。此介面是透過 <a href="https://developer.mozilla.org/en-US/docs/DOM/window" title="../en-US/docs/DOM/window">window</a> 物件所建構。</li>
 <li><a href="/zh-TW/docs/IndexedDB/IDBIndex" title="IndexedDB/IDBIndex"><code>IDBIndex</code></a> 可存取索引的Metadata。</li>
 <li><code><a href="/zh-TW/docs/IndexedDB/IDBKeyRange" title="IndexedDB/KeyRange">IDBKeyRange</a></code> 定義資料鍵範疇。</li>
 <li><a href="/zh-TW/docs/IndexedDB/IDBObjectStore" title="IndexedDB/IDBObjectStore"><code>IDBObjectStore</code></a> 代表物件存檔。</li>
 <li><a href="/zh-TW/docs/IndexedDB/IDBOpenDBRequest" title="IndexedDB/IDBOpenDBRequest"><code>IDBOpenDBRequest</code></a> 代表「開啟資料庫」的請求。</li>
 <li><a href="/zh-TW/docs/IndexedDB/IDBRequest" title="IndexedDB/IDBRequest"><code>IDBRequest</code></a> 代表向非同步資料庫和資料庫物件發出之請求，也就是呼叫非同步方法後回傳值。</li>
 <li><a href="/zh-TW/docs/IndexedDB/IDBTransaction" title="IndexedDB/IDBTransaction"><code>IDBTransaction</code></a> 代表一個交易。我們可以和資料庫進行交易，例如要求存取某一個物件存檔，以及決定要執行讀或寫的存取作業。</li>
 <li><a href="/zh-TW/docs/IndexedDB/IDBVersionChangeEvent" title="IDBVersionChangeEvent"><code>IDBVersionChangeEvent</code></a> <code>則代表資料庫所變更的版本。</code></li>
</ul>

<p>以下API在早期規範中有定義，但現已移除。這邊列出僅供參考:</p>

<ul>
 <li><a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/IDBVersionChangeRequest" title="IndexedDB/IDBVersionChangeRequest">IDBVersionChangeRequest</a> 代表「更改資料庫版本」的請求。更改資料庫版本的方法已有不同 (呼叫 <a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/IDBFactory#open" title="IndexedDB/IDBFactory#open">IDBFactory.open()</a> 而不需同時呼叫  <a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/IDBDatabase#setVersion%28%29" title="IndexedDB/IDBDatabase#setVersion()">IDBDatabase.setVersion()</a>)；而且<a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/IDBOpenDBRequest" title="IndexedDB/IDBOpenDBRequest">IDBOpenDBRequest</a>已經整合了從IDBVersionChangeRequest中所移除之功能。</li>
 <li><a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/IDBDatabaseException" title="IndexedDB/DatabaseException">IDBDatabaseException </a> {{obsolete_inline}} 在執行資料庫作業時，代表可能遭遇的例外狀況。</li>
</ul>

<p>除了非同步API，也有應用在<a href="https://developer.mozilla.org/zh-TW/docs/DOM/Using_web_workers" title="Using_web_workers">WebWorkers</a>內的同步API，但請注意目前還沒有瀏覽器支援同步API。這裡也提供 <a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/Syncronous_API" title="IndexedDB/SyncronousAPI">API 的同步版本</a>。</p>

<h2 id="儲存限制">儲存限制</h2>

<p>單一資料庫項目的容量/大小並沒有任何限制，但是各個 IndexedDB資料庫的容量就有限制。此限制，還有使用者介面的斷言 (Assert) 方式，又將因瀏覽器而有所不同：</p>

<ul>
 <li>
  <p>Firefox：對 IndexedDB 資料庫的容量並無限制。但若要儲存的 Blobs 超過 50 MB，使用者介面將會要求權限。若要修改此容量，則可透過 dom.indexedDB.warningQuota (可至 <a href="http://mxr.mozilla.org/mozilla-central/source/modules/libpref/src/init/all.js" title="http://mxr.mozilla.org/mozilla-central/source/modules/libpref/src/init/all.js">http://mxr.mozilla.org/mozilla-central/source/modules/libpref/src/init/all.js</a> 中設定) 設定自己所需的限制。</p>
 </li>
 <li>Google Chrome：請參閱 <a class="link-https" href="https://developers.google.com/chrome/whitepapers/storage#temporary" rel="freelink">https://developers.google.com/chrome...rage#temporary</a></li>
</ul>

<h2 id="Example" name="Example">範例</h2>

<p>Web 上的 IndexedDB 使用範例，是由 Marco Castelluccio 所提供。Marco 是 IndexedDB Mozilla DevDerby 的優勝者，而該得獎 Demo 為 <a href="https://developer.mozilla.org/zh-TW/demos/detail/elibri" title="demos/detail/elibri">eLibri</a>，屬於函式庫與 eBook 閱讀器的 App。</p>


<h2 id="另可參閱">另可參閱</h2>

<ul>
 <li><a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB" title="IndexedDB/Basic Concepts Behind IndexedDB">IndexedDB 基本概念</a></li>
 <li><a href="https://developer.mozilla.org/zh-TW/docs/IndexedDB/Using_IndexedDB" title="IndexedDB/IndexedDB primer">使用 IndexedDB</a></li>
 <li><a href="http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/" title="http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/">在 IndexedDB 中儲存影像與檔案</a></li>
 <li><a href="http://www.html5rocks.com/tutorials/indexeddb/todo/" title="http://www.html5rocks.com/tutorials/indexeddb/todo/">使用 HTML5 IndexedDB 的簡易 TODO 清單</a><br>
  {{Note("此線上教學是根據較舊版本的規格所列，因此無法搭配最新版的瀏覽器。新版本已移除其中的 <code>setVersion()</code> 函式。")}}</li>
 <li><a href="http://www.w3.org/TR/IndexedDB/" title="http://www.w3.org/TR/IndexedDB/">Indexed Database API 規格</a></li>
 <li><a href="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx" title="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx">IndexedDB — 儲存於自己的瀏覽器中</a></li>
 <li><a href="http://nparashuram.com/IndexedDB/trialtool/index.html" title="http://nparashuram.com/IndexedDB/trialtool/index.html">IndexedDB 範例</a></li>
 <li>僅支援 WebSQL 的瀏覽器 (例如行動 WebKit)，可適用 <a href="https://github.com/axemclion/IndexedDBShim" title="https://github.com/axemclion/IndexedDBShim">IndexedDB Polyfill</a></li>
 <li><a href="http://nparashuram.com/IndexedDBShim/" title="http://nparashuram.com/IndexedDBShim/">JQuery IndexedDB 外掛程式</a></li>
</ul>