web-dev-qa-db-ja.com

ローカルオフラインデータベースを作成する方法

私はHTML、CSS、JavaScriptを使用してTo Doリストアプリケーションを作成しています。データを保存する最善の方法はローカルデータベースだと思います。私はlocalStorageとsessionStorageの使用方法を知っています。また、オンライン MySQL データベースの使用方法も知っています。ただし、このアプリケーションはオフラインで実行できる必要があり、データをオフラインで保存する必要があります。
HTMLとJavaScriptだけでこれを行う方法はありますか？

コメントへの返答：

「あなたはlocalStorageの使い方を知っていると言ったので、何が問題なのでしょうか？」

@Lior localStorageについて知っているすべてのことは、単一の結果を変数として格納できることですが、オブジェクトに関するさまざまなデータを含む異なる列を持つ行を格納したいということです。しかし、localStorageはオブジェクトを保持できますか？その場合、通常のオブジェクト表記で参照されますか？

実装はおそらく、ユーザーが使用するブラウザーに依存します。

@paul chromeが最も人気があると思います。

さて、私が求めていたのは確かにJavaScriptとHTMLでこれを行うにはどうすればよいですかではなくHTMLとJavaScriptだけでこれを行う方法はありますか？。基本的に、オンラインではなくユーザーのマシンにコンテンツを保存できるタイプのSQLデータベースが必要でした。

私の問題を解決したのは、WebDBまたはWEBSQLを使用することでした（そのようなものと呼ばれていたと思います）。

javascripthtmlcssdatabaseoffline
15
samdy1

私はこれに答えるのに約3年遅れていますが、その時点で利用可能なオプションについての実際の議論がなかったこと、およびOPが最終的に選択したデータベース 現在は非推奨 であることを考慮して、私は考えました問題について私の2セントを投入します。

まず、実際にクライアント側のデータベースが必要かどうかを検討する必要があります。すなわち...

  • データ項目間の明示的または暗黙的な関係が必要ですか？
  • 上記のアイテムに対してクエリを実行する機能はどうですか？
  • または 5 MB 以上ですか？

上記のすべてに「いいえ」と答えた場合は、localStorageを使用して、WebSQL APIとIndexedDB APIの頭痛の種から身を守ってください。さて、前者は以前に述べたように非推奨になっているため、おそらく後者の頭痛だけかもしれません。

それ以外の場合、W3C標準トラックに残っているのはIndexedDBだけなので、ネイティブクライアント側データベースに関する限り、IndexedDBが唯一の選択肢です。

低レベルのストレージオペレーションコードを記述せずに、これらの機能などを利用したい場合は BakedGoods をチェックしてください。これにより、たとえば、クライアントでサポートされている最初に検出されたネイティブデータベースにデータを配置することは、次のように簡単です。

bakedGoods.set({
    data: [{key: "key1", value: "val1"}, {key: "key2", value: "val2"}],
    storageTypes: ["indexedDB", "webSQL"],

    //Will be polyfilled with defaults for equivalent database structures
    optionsObj: {conductDisjointly: false},

    complete: function(byStorageTypeStoredKeysObj, byStorageTypeErrorObj){}
});

ああ、そして完全な透明性のために、BakedGoodsはこの男がここで管理しています:)。

11
Kevin