# データベースの利用方法

{% hint style="warning" %}
現在 (2023/12)、Web SQLはAndroidのWebViewで利用可能ですが、将来的にサポートされなくなる可能性があります。 localStorage、 sessionStorage、IndexedDB などの代替ストレージ技術をご検討ください。
{% endhint %}

## Web SQL Database

接続を行う前に、Database オブジェクトを新規作成します。ここでは、 *window\.openDatabase* を使用して、SQLite データベースを新規作成します。

```javascript
var db = window.openDatabase(database_name, database_version, database_displayname, database_size);
```

## データベースの作成 ( SQLite )

```markup
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, user-scalable=no">
    <script type="text/javascript" charset="utf-8" src="components/loader.js"></script>
    <script type="text/javascript" charset="utf-8">
      document.addEventListener("deviceready", onDeviceReady, false);
      function onDeviceReady() {
          var db = window.openDatabase("database", "1.0", "testdatabase", 1000000);
      }
    </script>
  </head>
  <body>
  <pre>Web SQL Database</pre>
  </body>
</html>
```

### openDatabase 関数の引数

| 指定する引数                 | 説明                   | 設定値 |
| ---------------------- | -------------------- | --- |
| `database_name`        | データベース名              | 文字列 |
| `database_version`     | データベースのバージョン         | 文字列 |
| `database_displayname` | データベースの表示名           | 文字列 |
| `database_size`        | データベースのサイズ ( バイト単位 ） | 整数  |

### Database オブジェクトのメソッド

| Function        | 説明                                    |
| --------------- | ------------------------------------- |
| `transaction`   | データベースのトランザクションの処理                    |
| `changeVersion` | データベースのバージョンの確認とスキーマのアップデート ( 必要な場合 ) |

SQL 文を実行するメソッドは、`SQLTransaction` オブジェクトの `executesql` です。`SQLTransaction` オブジェクトを取得するには、Database オブジェクトの transaction を実行します。`SQLTransaction` オブジェクトの `executeSql` の実行時に、コールバック関数が実行され、 `SQLResultSet` オブジェクトがコールバック関数に渡されます。

### SQLResultSet オブジェクトのプロパティ

| Function       | 説明                                             |
| -------------- | ---------------------------------------------- |
| `insertId`     | INSERT 文の成功時に、行番号を返します。                        |
| `rowsAffected` | SQL の実行により、影響を受けた行を返します。                       |
| `rows`         | `ResultSetRowList` オブジェクトを返します。SQL 実行時の処理結果です。 |

## SQL 文の実行 ( SQLite )

```markup
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no">
    <script type="text/javascript" charset="utf-8" src="components/loader.js"></script>
    <script type="text/javascript" charset="utf-8">

    document.addEventListener("deviceready", onDeviceReady, false);

    function onDeviceReady() {

        window.alert("Create a database and display the content");

    }


    function executeQuery(tx) {
        tx.executeSql('DROP TABLE IF EXISTS TestTable');
        tx.executeSql('CREATE TABLE IF NOT EXISTS TestTable (id unique, data)');
        tx.executeSql('INSERT INTO TestTable (id, data) VALUES (1, "あいうえお")');
        tx.executeSql('INSERT INTO TestTable (id, data) VALUES (2, "かきくけこ")');
        tx.executeSql('INSERT INTO TestTable (id, data) VALUES (3, "さしすせそ")');
        tx.executeSql('INSERT INTO TestTable (id, data) VALUES (4, "たちつてと")');        
        tx.executeSql('INSERT INTO TestTable (id, data) VALUES (5, "なにぬねの")');
        tx.executeSql('INSERT INTO TestTable (id, data) VALUES (6, "はひふへほ")');
        tx.executeSql('INSERT INTO TestTable (id, data) VALUES (7, "まみむめも")');

    }

    function queryDB(tx) {
        tx.executeSql('SELECT * FROM TestTable', [], querySuccess, errorCB);
    }

    function querySuccess(tx, results) {
        var len = results.rows.length;
        window.alert("There are " + len + " rows of records in the database.");
        for (var i=0; i<len; i++){
            document.writeln("row = " + i + " ID = " + results.rows.item(i).id + " Data = " + results.rows.item(i).data+"<br/>");
        }        
    }

    //Callback function when the transaction is failed.
    function errorCB(err) {
        console.log("Error occured while executing SQL: "+err.code);
    }

    // Callback function when the transaction is success.
    function successCB() {
        var db = window.openDatabase("Database", "1.0", "TestDatabase", 200000);
        db.transaction(queryDB, errorCB);
    }

    function createDB(){
        var db = window.openDatabase("Database", "1.0", "TestDatabase", 200000);
        db.transaction(executeQuery, errorCB, successCB);

    }      

    </script>
  </head>
  <body>
  <h1>Execute the SQL</h1>
  <input type="button" value="Execute SQL transactions" onclick="createDB()">
  </body>
</html>
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ja.docs.monaca.io/sampleapp/tips/database.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
