web-dev-qa-db-ja.com

クライアント側のブラウザデータベースが必要です。私のオプションは何ですか

クライアント側のデータベースが必要だと思うウェブサイトを作成しています。もう1つのオプションは、複雑さの増加とスケーラビリティの低下を犠牲にして、サーバーにeverythingを固定することです。どのようなオプションがありますか?プラグインを作成する必要がありますか?全員がHTML5に準拠するまで待つ必要がありますか?


更新私が実際にこれを必要とする理由について多くのコメントがありました。ここに私の考えがあります。私が愚かかどうか教えてください:

  • クライアントには、大規模で複雑な状態があり、必要なデータ相互作用を提供するにはデータベースのようなものが必要になります。したがって、(私が思うに)クッキーは見えない。
  • このデータは一時的なものであるため、クライアントはセッションを閉じるとすぐに消去されるかどうかは気にしません。ただし、別のWebページに移動して戻ってきた場合、データを保持する必要があります。したがって(何らかの方法で)何らかのJavascript SQL実装のデータを保存するとうまくいきません。
  • 私は確かにサーバー上でやりたいことをすべて行うことができ、サーバーcan負荷を管理するためにスケールします(Facebook)。 しかし(私は思う)この負荷をサポートするためのインフラストラクチャにお金を払うよりも、プラグインを構築したい。これは、必要最低限​​のスタートアップ向けです。 (スタートアップの金持ちが豊かになるほど、私の骨はより悪くなるだろう。)
44
JnBrymn
29
Šime Vidas

私はこれに答えるのに約5年遅れていますが、既存の回答の一部にエラーと古いデータがあり、元の質問に対処されていない点があるので、私は2セントを投げると思いました。

まず、他の人がここで示唆していることとは反対に、 localStorage はデータベースではありません。これは、永続的な文字列ベースのキー値ストアです(または認識されるべきです)...

...それはあなたのニーズに完全に合っているかもしれません(そして私を2番目のポイントに連れて行きます)。

  • データ項目間に明示的または暗黙的な関係が必要ですか?
  • 上記のアイテムをクエリする機能はどうですか?
  • または、スペースで 5 MB を超えていますか?

上記のすべてに「いいえ」と答えた場合、localStorageを使用して、WebSQLおよびIndexedDB APIである頭痛から身を守ります。まあ、おそらく前者 廃止予定 なので、後者の頭痛だけかもしれません。

他にもいくつかのクライアント側のストレージファシリティ(ネイティブおよび非ネイティブ)があります。それらのいくつかは非推奨*ですが、一部のブラウザからはサポートされています:

低レベルのストレージ操作コードを記述することなく、これらの機能のいずれかを利用したい場合は、 BakedGoods を確認してください。たとえば、データを1つ(または複数)に配置するのは次のように簡単です。

bakedGoods.set({
    data: [{key: "key1", value: "val1"}, {key: "key2", value: "val2"}],
    storageTypes: ["silverlight", "fileSystem", "localStorage"],
    options: optionsObj,
    complete: function(byStorageTypeStoredKeysObj, byStorageTypeErrorObj){}
});

ああ、そして完全な透明性のために、BakedGoodsはこの男によってここで保守されています:)。

7
Kevin

JavaScriptデータベースに出会いました http://www.taffydb.com/ まだ自分で試してみましたが、これが役立つことを願っています。

5
DogBot

必要と思われる場合は、それをサポートするクライアントに使用し、サポートしないクライアントにサーバー側のフォールバックを実装します。

別の方法としては、Cookieよりもはるかに多くの情報を保存でき、Flashを使用するすべてのブラウザー(ほとんどすべてのブラウザー)で動作し、入力されたデータを保存できるFlashおよびローカル共有オブジェクトを使用できます。 Flashでアプリ全体を実行する必要はありません。LSOデータを読み書きするための小さなユーティリティを作成するだけです。これは、フレームワークなしで直接ActionScriptプロジェクトを使用して実行でき、5〜15 kbの小さなSWFを提供します。

主に必要な2つのAPIがあります。 SharedObject.getLocal()はLSOへのアクセスを取得し、そのデータの読み取り/書き込みを行い、ExternalInterface.addCallbackこれを使用して、読み取り/書き込みLSOメソッドを呼び出すコールバックとしてAS3メソッドを登録できます。

SharedObject

http://help.Adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/net/SharedObject.html?filter_flex=4.1&filter_flashplayer=10.1&filter_air=2

ExternalInterface

http://help.Adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/external/ExternalInterface.html

これらのリンクはFlex参照へのリンクですが、このためにFlexフレームワークを必要としないActionScriptプロジェクトを作成するだけで、swfサイズを大幅に削減できます。 FlashDevelopのような無料のオープンソースを含む、多くの優れたIDEがあります。

FlashDevelop

http://www.flashdevelop.org/

5
Samuel Neff

クライアントでNoSQLスタイルのデータベースを探している場合は、 http://www.forerunnerdb.com をチェックアウトできます。 MongoDBと同じクエリ言語をサポートし、DOMにデータの変更を自動的に反映させる場合はデータバインディングモジュールを備えています。

また、オープンソースであり、常に新しい機能で更新されており、周辺のコミュニティは急速に成長しています。

免責事項、私はプロジェクトの主任開発者です。

4
Rob Evans

PouchDBを使用

オンラインでもオフラインでも機能するアプリケーションの構築に役立ちます。

基本的に、最後にフェッチしたデータをブラウザー内データベースに格納し(内部でIndexedDB、WebSQLを使用)、ネットワークがアクティブになると再び同期します。

3

HTML5ローカルストレージをご覧ください。

http://people.w3.org/mike/localstorage.html

これも役立つかもしれません: HTML5データベースストレージ(SQL lite)-いくつかの質問

Windows 98が最初に登場したとき、まだ多くの人がMS-DOS 6.22にこだわっていました。当然、MS-DOSで実行されない、新しいオペレーティングシステムには本当にクールな機能がありました。

イノベーションの余地を作るために、いくつかのことを残さなければならない時が来ます。アプリケーションが本当に革新的であり、最新かつ最高のテクノロジーを使用するクールな新機能を提供する場合、一部の古いブラウザーは当然残される必要があります。

利点は、オペレーティングシステムのアップグレードとは異なり、IE7からChrome 8またはFirefox 3.6にアップグレードすることは、特に以下を提供する場合、アプリの平均的なユーザーにとって到達可能な目標です。リンクおよびアップグレード手順。

1
jmort253

MozillaのlocalForageを試してみます。 https://mozilla.github.io/localForage/

1
Dmitry