IndexedDB - 连接
数据库是存储在计算机系统中的结构化数据的有组织的集合。 要对数据执行操作，我们需要连接到数据库。 在本章中，我们将讨论如何创建/连接数据库、打开数据库和删除数据库。
创建数据库 − 您可以使用 open() 函数在 IndexedDB 中创建数据库。 以下是该函数的语法。
let openRequest = indexedDB.open(name, version);
这里，
- name是您需要创建的数据库的名称。
- version 是要创建的数据库的版本。 该参数默认值为1。如果省略该值，则版本被视为1。
传递给此函数的版本值不应小于（IndexedDB 的）当前版本。 如果数据库创建成功，该函数返回1；如果失败，该函数返回0。
示例
以下是在IndexedDB中创建数据库的示例
<!DOCTYPE html>
<html lang="en">
<head>
<title>Indexed db</title>
</head>
<body>
<script>
//Creating a database
const request = indexedDB.open("myDatabase", 1);
if(indexedDB){
document.write("Database Created......");
}
</script>
</body>
</html>
输出
如果将上述代码保存在文件"test.html"中并运行，浏览器上将显示以下消息 −
Database Created......
验证
由于 IndexedDB 是浏览器的内置数据库，因此您可以在浏览器本身中观察创建的数据库。
右键单击结果页面，单击"检查元素"并选择"应用程序"选项卡。 您可以在那里看到 IndexedDB 数据库，如果展开它，您可以看到创建的数据库文件，如下所示 −
生成处理程序
事件是对 HTML 元素执行的操作。 使用 JavaScript 我们可以处理这些事件。 从现在开始，我们使用 JavaScript 处理程序（以使这一点更清晰）。
如果请求成功，我们将使用 onsuccess 事件。
request.onerror = event => {
// Do something (ex: document.write("error");
};
如果请求失败，我们使用onerror事件。
request.onsuccess = event => {
// Do something (ex : document.write("success");
};
当您创建数据库或增加现有数据库的版本号时，我们使用 onupgradeneeded 事件。
request.onupgradeneeded = event => {
var db = event.target.result;
};
示例
以下示例显示消息"数据库创建成功"。 如果数据库创建成功。 在这里，我们使用 onsuccess 和 onerror 处理程序来显示这些消息。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Handlers</title>
</head>
<body>
<script>
const request = indexedDB.open("DATABASE", 1);
request.onsuccess = function (){
document.write("Database created successfully...")
}
request.onerror = function(){
document.write("database creation error");
}
request.onupgradeneeded = function(event){
var db = event.target.result;
}
</script>
</body>
</html>
输出
如果将上述代码保存在文件"test.html"中并运行，浏览器上将显示以下消息 −
Database created successfully...
连接到现有数据库
为了与 IndexedDB 交互，我们使用 JavaScript。 我们用 JavaScript 编写的代码并不直接与数据库交互。 我们需要使用连接对象来连接数据库来操作数据库的对象。
打开数据库直接创建连接。 一个数据库可以有多个连接。 当连接最初创建时，它处于打开状态。
您可以使用 open() 函数（我们用来创建数据库）连接到 IndexedDB 数据库。
语法
以下是连接到现有数据库的语法。
let openRequest = indexedDB.open(name, version);
示例
下面给出了使用连接对象与现有数据库交互的 JavaScript 示例 −
<!DOCTYPE html>
<html lang="en">
<head>
<title>OPENING A DATABASE</title>
</head>
<body>
<script>
const request = indexedDB.open("DATABASE", 1);
request.onsuccess = function (){
document.write("<br> Database created successfully")
}
const requestone = indexedDB.open("Database1",2);
requestone.onsuccess = function(){
document.write("<br> Database created successfully");
}
const requesttwo = indexedDB.open("DATABASE",1);
requesttwo.onsuccess = function(){
document.write("<br> Database opened successfully");
}
</script>
</body>
</html>
输出
上面的程序在浏览器上打印以下输出 −
Database created successfully Database opened successfully Database created successfully
如果请求成功，则会调用名为 onsuccess 的事件。
在浏览器中检查数据库的另一种方法
除了inspect元素之外，还有另一种方法可以在浏览器中检查IndexedDB数据库。
右上角会有一个自定义和控制按钮，点击它。
在列表中选择更多工具选项，然后选择开发人员工具。
在下一页上选择"应用程序"选项卡，您可以在其中看到 IndexedDB 数据库。
删除数据库
如果有多余的数据库不需要或者占用了不必要的空间，我们可以将其删除。 要删除数据库，我们可以使用deleteDatabase()函数。
以下是deleteDatabase()函数的语法 −
let deleteRequest = indexedDB.deleteDatabase(name)
这里，name参数是我们要删除的数据库的名称。
示例
以下示例创建一个名为 TestDatabase 的数据库，并使用 deleteDatabase() 函数删除它。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Indexed db</title>
</head>
<body>
<script>
const request = indexedDB.open("TestDatabase", 1);
request.onsuccess = function () {
document.write("Database Created Successfully");
};
var req = indexedDB.deleteDatabase("TestDatabase");
req.onsuccess = function () {
document.write("Database Deleted Successfully");
};
req.onerror = function () {
document.write("Couldn't delete the database");
};
</script>
</body>
</html>
直接从浏览器删除数据库
创建数据库后，您可以直接从浏览器中删除该数据库。 为此，请按照下面给出的步骤进行操作−
第 1 步 − 使用以下方式之一打开浏览器中可以看到IndexedDB数据库（存储）的页面
Inspect option − Right−click → Inspect → Application 或,
Developer tools − Customize and Control Options → More tools → Developers tools → Application
第 2 步 − 如果扩展 IndexedDB 存储，您可以观察到创建的数据库列表，如下所示。
第 3 步 − 单击要删除的数据库。 在右侧，您将找到删除数据库按钮。 如果您点击它，该数据库将被删除。
关闭数据库
要关闭数据库，我们需要使用函数IDBDatabase.close()
语法
IDBDatabase.close();
IDBDatabase 接口的 close() 方法立即返回并关闭连接。
在所有事务完成之前，连接不会关闭，但是，无法为此连接创建新事务，并且如果关闭操作处于挂起状态，方法会引发异常。
