ホームページ  >  記事  >  ウェブフロントエンド  >  HTML5 ローカル ストレージ - Web SQL データベースの詳細

HTML5 ローカル ストレージ - Web SQL データベースの詳細

黄舟
黄舟オリジナル
2017-03-21 15:06:131180ブラウズ

HTML5 WebStorage では、HTML5 ローカル ストレージのローカル ストレージと Session ストレージが導入されています。これら 2 つは、少量のデータ構造を保存する場合には役立ちますが、大量のデータ構造を保存する場合には役に立ちません。構造化データは柔軟性があり、強力ではありません。

Web SQL データベース

私たちはデータベース内の大量の構造化データを処理することがよくあります。HTML5 では、SQL を使用してクライアント データベースの

API を操作するという概念が導入されています。仕様で使用されている言語は SQLlite です。Web SQL データベースの仕様ページにはこのような記述があります

HTML5 ローカル ストレージ - Web SQL データベースの詳細

この文書は W3C 勧告の段階にありましたが、仕様の作業は行き詰まっています。 : 関心のあるすべての実装者は同じ SQL バックエンド (Sqlite) を使用していますが、標準化パスに沿って進めるには複数の独立した実装が必要です

おそらく意味は

この文書はかつて W3C 推奨仕様に含まれていましたが、仕様作業は停止しました。現在のすべての実装は同じ SQL バックエンド (SQLite) に基づいていますが、標準化するにはさらに独立した実装が必要です。

言い換えれば、これは放棄された標準ですが、一部のブラウザではすでに実装されています。 。 。 。 。 。 。

3 つのコアメソッド

しかし、それを学んでおいて損はありません。現在 W3C によって推進されている IndexedDB と比較して、なぜこのソリューションが放棄されるべきなのかを理解することができます。 Web SQL Database 仕様で定義されている 3 つのコア メソッド:

    openDatabase: このメソッドは、既存のデータベースまたは新しいデータベースを使用して、
  1. データベースを作成します

    オブジェクト

  2. transaction: このメソッドにより、トランザクションの送信を制御できます。状況に応じてロールバックするかロールバックします
  3. executeSql: このメソッドは SQL を実行するために使用されます
  4. query

  5. openDatabase

このような単純なステートメントを使用してローカルデータベースオブジェクトを作成したり開くことができます

var db = openDatabase('testDB', '1.0', 'Test DB', 2 * 1024 * 1024);

openDatabase は 5 つを受け取りますパラメータ:

    データベース名
  1. データベースのバージョン番号
  2. 表示名
  3. データベースに保存されるデータのサイズ(バイト単位)
  4. コールバック関数

    (オプション)

  5. コールバック関数が提供されている場合、そのコールバック関数は、どのようなバージョン番号が指定されても、changeVersion() 関数を呼び出すために使用されます。コールバック関数はデータベースのバージョン番号を空に設定します。コールバック関数が指定されていない場合、データベースは指定されたバージョン番号で作成されます。

トランザクション

トランザクション メソッドは、ステートメントの実行に失敗した場合、トランザクション全体がロールバックされます。このメソッドには 3 つのパラメータがあります

    トランザクションの内容を含むメソッド
  1. 実行成功のコールバック関数 (オプション)
  2. 実行失敗のコールバック関数 (オプション)
  3. db.transaction(function (context) {
               context.executeSql('CREATE TABLE IF NOT EXISTS testTable (id unique, name)');
               context.executeSql('INSERT INTO testTable (id, name) VALUES (0, "Byron")');
               context.executeSql('INSERT INTO testTable (id, name) VALUES (1, "Casper")');
               context.executeSql('INSERT INTO testTable (id, name) VALUES (2, "Frank")');
             });
  4. この例では、テーブルを作成しました。 3 つのデータをテーブルに挿入します。4 つの実行ステートメントのいずれかでエラーが発生した場合、トランザクション全体がロールバックされます。このメソッドには 4 つのパラメーターがあります。

クエリ文字列内の疑問符を置換するために使用されるパラメータ

    実行成功コールバック関数 (オプション)
  1. 実行失敗コールバック関数 (オプション)

  2. 上の例ではinsert ステートメントを使用しました。クエリの例を見てみましょう
  3. db.transaction(function (context) {
               context.executeSql('SELECT * FROM testTable', [], function (context, results) {            
               var len = results.rows.length, i;
                console.log('Got '+len+' rows.');               
                for (i = 0; i < len; i++){
                  console.log(&#39;id: &#39;+results.rows.item(i).id);
                  console.log(&#39;name: &#39;+results.rows.item(i).name);
                }
             });
  4. 完全な例

    
        Web SQL Database
        

    最後に
  5. Web SQL データベースの仕様は廃止されたため、その理由は非常に明らかですが、現在の SQL 仕様では SQLite の SQL 方言が使用されています。これは標準では受け入れられません。各ブラウザには独自の実装があり、依然として標準を混乱させます。このように、ブラウザの互換性は重要ではなく、徐々に忘れられるでしょう。ただし、

    Chr
    ome のコンソールは非常に使いやすく、Shenma

    cookie
  6. 、ローカル ストレージ、セッション ストレージ、Web SQL、IndexedDB、アプリケーション
キャッシュ

、その他の html5

新しく追加された

コンテンツを明確に見ることができます。多くの

デバッグ

コード作業。

HTML5 ローカル ストレージ - Web SQL データベースの詳細

以上がHTML5 ローカル ストレージ - Web SQL データベースの詳細の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。