IDBOpenDBRequest: blocked イベント
blocked
ハンドラーは、データベースへのオープン中の接続が同じデータベースの versionchange
トランザクションをブロックしているとき実行されます。
このイベントはキャンセルできず、バブリングしません。
構文
addEventListener()
のようなメソッドでイベント名を用いるか、イベントハンドラープロパティを設定します。
js
addEventListener("blocked", (event) => {});
onblocked = (event) => {};
イベント型
IDBVersionChangeEvent
です。Event
を継承します。
イベントプロパティ
親の Event
インターフェイスからもプロパティを継承します。
IDBVersionChangeEvent.oldVersion
読取専用-
データベースの古いバージョンを返します。
IDBVersionChangeEvent.newVersion
読取専用-
データベースの新しいバージョンを返します。
例
addEventListener()
を用いた例:
js
// データベースを開きます
const DBOpenRequest = window.indexedDB.open("toDoList", 4);
DBOpenRequest.onupgradeneeded = (event) => {
const db = event.target.result;
db.onerror = () => {
console.log("データベースの作成中にエラー発生");
};
// このデータベース用の objectStore を作成します
const objectStore = db.createObjectStore("toDoList", {
keyPath: "taskTitle",
});
// objectStore に保存するデータアイテムを定義します
objectStore.createIndex("hours", "hours", { unique: false });
objectStore.createIndex("minutes", "minutes", { unique: false });
objectStore.createIndex("day", "day", { unique: false });
objectStore.createIndex("month", "month", { unique: false });
objectStore.createIndex("year", "year", { unique: false });
};
DBOpenRequest.onsuccess = (event) => {
// 同じデータベースをより高いバージョンで開いてみましょう
const req2 = indexedDB.open("toDoList", 5);
// この場合、onblocked ハンドラーが実行されます
req2.addEventListener("blocked", () => {
console.log("要求がブロックされました");
});
};
onblocked
プロパティを用いた例:
js
// データベースを開きます
const DBOpenRequest = window.indexedDB.open("toDoList", 4);
DBOpenRequest.onupgradeneeded = (event) => {
const db = event.target.result;
db.onerror = () => {
console.log("データベースの作成中にエラー発生");
};
// このデータベース用の objectStore を作成します
const objectStore = db.createObjectStore("toDoList", {
keyPath: "taskTitle",
});
// objectStore に保存するデータアイテムを定義します
objectStore.createIndex("hours", "hours", { unique: false });
objectStore.createIndex("minutes", "minutes", { unique: false });
objectStore.createIndex("day", "day", { unique: false });
objectStore.createIndex("month", "month", { unique: false });
objectStore.createIndex("year", "year", { unique: false });
};
DBOpenRequest.onsuccess = (event) => {
// 同じデータベースをより高いバージョンで開いてみましょう
const req2 = indexedDB.open("toDoList", 5);
// この場合、onblocked ハンドラーが実行されます
req2.onblocked = () => {
console.log("要求がブロックされました");
};
};
ブラウザーの互換性
BCD tables only load in the browser