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
|
<!doctype html>
<meta charset="utf-8">
<script>
const dbName = "users";
// Create the database at v1 and detect success via `onsuccess`.
function createDatabase() {
return new Promise((resolve, reject) => {
var dbRequest = window.indexedDB.open(dbName, 1);
dbRequest.onblocked = () => reject();
dbRequest.onerror = () => reject();
dbRequest.onsuccess = (e) => {
e.target.result.close();
resolve();
}
});
}
// Open the database at v2 and detect existance via `onupgradeneeded`.
function doesDatabaseExist() {
let didExist = false;
return new Promise((resolve, reject) => {
var dbRequest = window.indexedDB.open(dbName, 2);
dbRequest.onblocked = () => reject();
dbRequest.onerror = () => reject();
dbRequest.onsuccess = (e) => {
e.target.result.close();
deleteDatabase().then(() => resolve(didExist));
};
dbRequest.onupgradeneeded = (e) => {
didExist = e.oldVersion != 0;
};
});
}
// Delete the database and detect success via `onsuccess`.
function deleteDatabase() {
return new Promise((resolve, reject) => {
var dbRequest = window.indexedDB.deleteDatabase(dbName);
dbRequest.onblocked = () => reject();
dbRequest.onerror = () => reject();
dbRequest.onsuccess = () => resolve();
});
}
window.addEventListener("load", () => {
if (!parent.opener) {
// Step 2
createDatabase().then(() => {
parent.postMessage(
{message: "same-site iframe loaded"},
parent.origin,
);
});
} else {
// Step 4
doesDatabaseExist().then((result) => {
parent.opener.postMessage(
{
message: "cross-site iframe loaded",
doesDatabaseExist: result,
},
parent.opener.origin,
);
});
}
});
// Step 6
window.addEventListener("message", (e) => {
if (e.data.message == "delete database") {
deleteDatabase().then(() => {
e.source.postMessage(
{message: "database deleted"},
e.source.origin,
);
});
}
});
</script>
|
