IndexedDB API

IndexedDB เป็น API ระดับต่ำสำหรับการจัดเก็บข้อมูลจำนวนมากของโครงสร้างข้อมูลรวมถึงไฟล์ / blobs API นี้ใช้ดัชนีเพื่อให้สามารถค้นหาข้อมูลนี้ได้อย่างมีประสิทธิภาพสูง แม้ว่าที่เก็บข้อมูลเว็บจะเป็นประโยชน์สำหรับการจัดเก็บข้อมูลจำนวนน้อย แต่จะไม่ค่อยมีประโยชน์ในการจัดเก็บข้อมูลที่มีโครงสร้างจำนวนมาก IndexedDB มีวิธีแก้ปัญหา นี่คือหน้า Landing Page หลักสำหรับความครอบคลุม IndexedDB ของ MDN - ที่นี่เรามีลิงก์ไปยังคู่มืออ้างอิงและคู่มือการใช้งาน API แบบเต็มรูปแบบรายละเอียดการสนับสนุนเบราเซอร์และคำอธิบายเกี่ยวกับแนวคิดหลัก ๆ

Note: This feature is available in Web Workers.

หมายเหตุ : IndexedDB API มีประสิทธิภาพ แต่อาจดูเหมือนซับซ้อนเกินไปสำหรับกรณีง่ายๆ ถ้าคุณต้องการ API แบบธรรมดาลองใช้ไลบรารีเช่น localForage , dexie.js , ZangoDB และJsStoreที่ทำให้ IndexedDB เป็นโปรแกรมเมอร์ที่เป็นมิตรมากขึ้น

แนวคิดหลักและการใช้งาน

IndexedDB เป็นระบบฐานข้อมูลการทำธุรกรรมเช่น RDBMS แบบ SQL แต่แตกต่างจาก RDBMSes ที่ใช้ SQL ซึ่งใช้ตารางคอลัมน์ถาวร IndexedDB เป็นฐานข้อมูลเชิงวัตถุที่ใช้ JavaScript IndexedDB ช่วยให้คุณสามารถจัดเก็บและดึงวัตถุที่มีการสร้างดัชนีด้วยที่สำคัญ ; วัตถุใด ๆ ที่สนับสนุนโดยอัลกอริทึมโคลนที่มีโครงสร้างสามารถจัดเก็บได้ คุณต้องระบุคีมาฐานข้อมูลเปิดการเชื่อมต่อกับฐานข้อมูลของคุณและจากนั้นดึงข้อมูลและปรับปรุงข้อมูลภายในชุดของการทำธุรกรรม

อ่านเพิ่มเติมเกี่ยวกับแนวคิดที่อยู่เบื้องหลัง IndexedDB
เรียนรู้การใช้ IndexedDB แบบอะซิงโครนัสจากหลักการแรกด้วยคู่มือการใช้ IndexedDBของเรา
ดูคำแนะนำสำหรับนักพัฒนาซอฟต์แวร์ที่ทำให้แอปพลิเคชันเว็บทำงานแบบออฟไลน์ได้ที่หน้าแอปแบบออฟไลน์

หมายเหตุ : เช่นเดียวกับโซลูชันการจัดเก็บข้อมูลเว็บส่วนใหญ่ IndexedDB จะใช้นโยบายแหล่งกำเนิดเดียวกัน ดังนั้นในขณะที่คุณสามารถเข้าถึงข้อมูลที่เก็บไว้ภายในโดเมนคุณจะไม่สามารถเข้าถึงข้อมูลในโดเมนต่างๆได้

Synchronous และ Asynchronous

การดำเนินงานที่ดำเนินการโดยใช้ IndexedDB ทำแบบอะซิงโครนัสเพื่อไม่ให้บล็อกแอพพลิเคชัน IndexedDB เดิมรวม APIs แบบซิงโครนัสและ แบบอะซิงโครนัส API ซิงโครนัสมีไว้สำหรับใช้กับWeb Workersเท่านั้น แต่ถูกนำออกจาก spec เนื่องจากไม่ชัดเจนว่าจำเป็นหรือไม่ อย่างไรก็ตาม API แบบซิงโครนัส อาจได้รับคำแนะนำใหม่หากมีความต้องการเพียงพอจากนักพัฒนาเว็บ

ข้อ จำกัด ในการจัดเก็บและเกณฑ์การขับไล่

มีเทคโนโลยีเว็บจำนวนหนึ่งที่เก็บข้อมูลประเภทเดียวกันหรือแบบอื่นทางฝั่งไคลเอ็นต์ (เช่นบนดิสก์ภายในเครื่อง) IndexedDB เป็นเรื่องที่พูดถึงกันมากที่สุด กระบวนการที่เบราว์เซอร์ทำงานได้ว่าจะจัดสรรพื้นที่ในการจัดเก็บข้อมูลเว็บมากน้อยเพียงใดและจะลบอะไรเมื่อถึงขีด จำกัด นั้นไม่ง่ายและแตกต่างกันระหว่างเบราว์เซอร์ ขีด จำกัด ของพื้นที่เก็บข้อมูลเบราเซอร์และเกณฑ์การขับไล่พยายามอธิบายวิธีการทำงานนี้อย่างน้อยที่สุดในกรณีของ Firefox

อินเตอร์เฟซ

เมื่อต้องการเข้าถึงฐานข้อมูลให้เรียกopen()ใช้indexedDBแอ็ตทริบิวต์ของออบเจ็กต์หน้าต่าง เมธอดนี้ส่งกลับค่า IDBRequest object; การดำเนินการแบบอะซิงโครนัสจะสื่อสารกับแอพพลิเคชันการเรียกโดยการยิงเหตุการณ์บน IDBRequest วัตถุ

กำลังเชื่อมต่อกับฐานข้อมูล

IDBEnvironment: ให้การเข้าถึงฟังก์ชันการทำงาน IndexedDB มีการใช้งานโดย window และวัตถุ worker อินเทอร์เฟซนี้ไม่ใช่ส่วนหนึ่งของข้อกำหนด 2.0
IDBFactory: ให้การเข้าถึงฐานข้อมูล นี่คืออินเทอร์เฟซที่ใช้งานโดยอ็อบเจ็กต์ทั่วโลกindexedDBและเป็นจุดเริ่มต้นของ API
IDBOpenDBRequest: หมายถึงคำขอให้เปิดฐานข้อมูล
IDBDatabase: หมายถึงการเชื่อมต่อกับฐานข้อมูล เป็นวิธีเดียวที่จะได้รับธุรกรรมในฐานข้อมูล
กำลังเรียกและแก้ไขข้อมูล

IDBTransaction: หมายถึงธุรกรรม คุณสร้างธุรกรรมในฐานข้อมูลระบุขอบเขต (เช่นที่เก็บออบเจ็กต์ที่คุณต้องการเข้าถึง) และกำหนดชนิดของการเข้าถึง (อ่านอย่างเดียวหรือเขียน readwrite) ที่คุณต้องการ
IDBRequest: อินเทอร์เฟซทั่วไปที่จัดการคำขอฐานข้อมูลและให้การเข้าถึงผลการค้นหา
IDBObjectStore: หมายถึงเก็บออบเจ็กต์ที่อนุญาตให้เข้าถึงชุดข้อมูลในฐานข้อมูล IndexedDB โดยค้นหาคีย์หลัก
IDBIndex: นอกจากนี้ยังช่วยให้สามารถเข้าถึงชุดย่อยของข้อมูลในฐานข้อมูล IndexedDB ได้ แต่ใช้ดัชนีเพื่อดึงข้อมูลระเบียนแทนที่จะเป็นคีย์หลัก บางครั้งก็เร็วกว่าการใช้ IDBObjectStore
IDBCursor: Iterates มากกว่าเก็บวัตถุและดัชนี
IDBCursorWithValue: Iterates มากกว่าเก็บวัตถุและดัชนีและส่งกลับค่าปัจจุบันของเคอร์เซอร์
IDBKeyRange: กำหนดช่วงสำคัญที่สามารถใช้เพื่อดึงข้อมูลจากฐานข้อมูลในช่วงที่กำหนด
IDBLocaleAwareKeyRange: กำหนดช่วงที่สำคัญที่สามารถนำมาใช้เพื่อดึงข้อมูลจากฐานข้อมูลในช่วงที่กำหนดซึ่งจัดเรียงตามกฎของโลแคลที่ระบุสำหรับดัชนีที่ระบุ (โปรดดูที่createIndex()พารามิเตอร์ที่ไม่บังคับ ) อินเทอร์เฟซนี้ไม่ใช่ส่วนหนึ่งของข้อกำหนด 2.0

อินเทอร์เฟซเหตุการณ์ที่กำหนดเอง

ข้อกำหนดนี้จะเริ่มต้นกิจกรรมด้วยอินเทอร์เฟซที่กำหนดเองต่อไปนี้:

IDBVersionChangeEvent: IDBVersionChangeEventอินเตอร์เฟซแสดงให้เห็นว่ารุ่นของฐานข้อมูลที่มีการเปลี่ยนแปลงเป็นผลมาจากการ IDBOpenDBRequest.onupgradeneeded ฟังก์ชั่นจัดการเหตุการณ์

อินเตอร์เฟซล้าสมัย

เวอร์ชันก่อนหน้าของข้อกำหนดยังกำหนดการเชื่อมต่อที่ลบออกไปแล้วในขณะนี้ เอกสารเหล่านี้จะได้รับการจัดทำเป็นเอกสารไว้ในกรณีที่คุณจำเป็นต้องอัพเดตโค้ดที่เขียนไว้ก่อนหน้านี้:

IDBVersionChangeRequest: หมายถึงคำขอให้เปลี่ยนเวอร์ชันของฐานข้อมูล วิธีเปลี่ยนเวอร์ชันของฐานข้อมูลได้เปลี่ยนไปแล้ว (โดยเรียก IDBFactory.open โดยไม่ต้องเรียก IDBDatabase.setVersion) และอินเทอร์เฟซ IDBOpenDBRequest มีฟังก์ชันการทำงานของ IDBVersionChangeRequest ที่ถูกลบ
IDBDatabaseException: หมายถึงสภาวะข้อยกเว้นที่สามารถพบได้ในขณะดำเนินการฐานข้อมูล
IDBTransactionSync: ซิงค์เวอร์ชันของ IDBTransaction
IDBObjectStoreSync: ซิงค์เวอร์ชันของ IDBObjectStore
IDBIndexSync: ซิงค์เวอร์ชันของ IDBIndex
IDBFactorySync: ซิงค์เวอร์ชันของ IDBFactory
IDBEnvironmentSync: ซิงค์เวอร์ชันของ IDBEnvironment
IDBDatabaseSync: ซิงค์เวอร์ชัน IDBDatabase
IDBCursorSync: ซิงค์เวอร์ชันของ IDBCursor

ตัวอย่าง

eLibri:ห้องสมุดที่มีประสิทธิภาพและโปรแกรมอ่าน eBook ซึ่งเขียนโดย Marco Castelluccio ผู้ชนะ IndexedDB Mozilla DevDerby
การแจ้งเตือนสิ่งที่ต้องทำ ( ดูตัวอย่างสด ): แอ็พพลิเคชันอ้างอิงสำหรับตัวอย่างในเอกสารอ้างอิง
จัดเก็บภาพและไฟล์ใน IndexedDB

ข้อมูลจำเพาะ

สเปค	สถานะ	คิดเห็น
Indexed Database API	Recommendation	ความหมายเบื้องต้น
Indexed Database API 2.0	Recommendation

ความเข้ากันได้ของเบราเซอร์

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Desktop
Mobile

ลักษณะ	โครเมียม	ขอบ	Firefox (ตุ๊กแก)	Internet Explorer	อุปรากร	Safari (WebKit)
การสนับสนุนขั้นพื้นฐาน	23 webkit 24 (ไม่เป็นที่รู้จัก) 38 (คำนำหน้าเลิกใช้แล้ว) 57 ( คำนำหน้านำออก)	(Yes)	10.0 (10.0) moz 16.0 (16.0)	10	15	7.1 ส่วนที่ 10
มีอยู่ในคนงาน	(Yes) (ไม่เป็นตัวเป็นตน) 38 (คำนำหน้าเลิกใช้แล้ว) 57 (นำหน้านำหน้าออก)	(Yes)	37.0 (37.0) ^[1]	(Yes)	(Yes)	10
ใช้ได้ในโหมดความเป็นส่วนตัว^[3]	(Yes)	No support	No support	No support	No support	No support
`IDBLocaleAwareKeyRange`	No support	No support	43.0 (43.0) ^[2]	No support	No support	No support
ฐานข้อมูลที่ทำดัชนี 2.0	58	?	?	?	45	?

ลักษณะ	Android Webview	Chrome สำหรับแอนดรอยด์	ขอบ	Firefox Mobile (ตุ๊กแก)	Firefox OS	โทรศัพท์ IE / Edge	Opera Mobile	Safari มือถือ
การสนับสนุนขั้นพื้นฐาน	(Yes) (ไม่เป็นตัวเป็นตน) 38 (คำนำหน้าเลิกใช้แล้ว) 57 (นำหน้านำหน้าออก)	(Yes) (ไม่เป็นตัวเป็นตน) 38 (คำนำหน้าเลิกใช้แล้ว) 57 (นำหน้านำหน้าออก)	(Yes)	22.0 (22.0)	1.0.1	10	22	8 บางส่วน 10
มีอยู่ในคนงาน	(Yes) (ไม่เป็นตัวเป็นตน) 38 (คำนำหน้าเลิกใช้แล้ว) 57 (นำหน้านำหน้าออก)	(Yes) (ไม่เป็นตัวเป็นตน) 38 (คำนำหน้าเลิกใช้แล้ว) 57 (นำหน้านำหน้าออก)	(Yes)	37.0 (37.0) ^[1]	(Yes)	(Yes)	(Yes)	10
ใช้ได้ในโหมดความเป็นส่วนตัว^[3]	No support	No support	No support	No support	No support	No support	?	?
`IDBLocaleAwareKeyRange`	No support	No support	No support	43.0 (43.0) ^[2]	2.5 ^[2]	No support	No support	No support
ฐานข้อมูลที่ทำดัชนี 2.0	58	58	?	?	?	?	45	?

[1] IDBCursorWithValue ไม่สามารถใช้งานได้จนกว่า Gecko 42.0 (Firefox 42.0 / Thunderbird 42.0 / SeaMonkey 2.39)
[2] คุณลักษณะนี้ซ่อนอยู่หลังธงเพื่อเปิดใช้งานและทดสอบไปที่ about: config และเปิดใช้งาน dom.indexedDB.experimental
[3] อาคา "โหมดการดูส่วนตัว" (Firefox) และ "ไม่ระบุตัวตน" (Chrome)

ดูสิ่งนี้ด้วย

localForage : Polyfill ให้ชื่อแบบง่าย: ไวยากรณ์ค่าสำหรับการจัดเก็บข้อมูลฝั่งไคลเอ็นต์ซึ่งใช้ IndexedDB ในเบื้องหลัง แต่จะกลับไปใช้ WebSQL และจากนั้นจัดเก็บในเครื่องในเบราว์เซอร์ที่ไม่สนับสนุน IndexedDB
dexie.js : wrapper สำหรับ IndexedDB ที่ช่วยให้สามารถพัฒนาโค้ดได้เร็วขึ้นโดยใช้ไวยากรณ์ที่ดีและเรียบง่าย
ZangoDB : อินเทอร์เฟซสำหรับ MongoDB สำหรับ IndexedDB ที่สนับสนุนการกรอง, การฉาย, การเรียงลำดับ, การอัพเดทและการรวมตัวของ MongoDB ที่คุ้นเคย
JsStore : เสื้อคลุม IndexedDB มีไวยากรณ์ SQL เหมือน