◆ インクルードした外部JavaScriptが自分が保存したデータを見ることができます
◆ いくら自分がインクルードしたファイルのみでも同じ所に書き込み・読み取りするのはイヤ
◆ 見るだけじゃなくて同じところに保存するので キーがかぶると……

Chromeの開発者ツールでリソースを見るとこうなってます

webstorage-view-01

LocalStorageとSessionStorageには複数ドメインがあります

この表示のせいで 外部のスクリプトで webstorage にアクセスするものを読み込んだら ソースコードが置いてるドメインの空間に保存されると思ってました

コードの取得元のドメインごとに保存するエリアが分けられるので 自分が好き名前でデータを保存しても大丈夫で 暗号化なんてせずそのまま分かりやすい形でJSONにしても 外部に見られることはないし安全で良い仕組み と思ってました


ですが 上の画像のいっぱいあるやつ フレームごとのです

実際は1つのページで10サイトからライブラリを読み込んでいれば 自分がストレージに保存したデータはその10サイトからは見放題です

え、ホントに?!

信じられなくて ローカル環境で適当にWebサーバをいくつか異なるドメインで立ち上げて試してみると 1つのページでは全部同じストレージを参照していました


ヒドイ仕組みだ………


自分でJavaScriptファイルを自分のページに読み込んでるんだから それくらいされることを覚悟して信頼してるものだけ読み込むようにしないのが悪い なんて意見もあると思いますけど JavaScriptの読み込みなんて気軽にするもので イチイチそれが安全なものかなんて確認しませんよ

jQueryのCDNと書いていて 本物のjQueryにストレージのデータ全部をこっそり外部に送る機能も付けられた偽jQueryが置かれてたとしても イチイチ「CDNのライブラリが本家のとハッシュ値が一緒だからこれは本物!」なんてやらないでしょう?

それに 今はちゃんとしたライブラリだったとしても 製作者が急に悪意あるファイルに置き換えて データ取られていても気づかないですよ
製作者が悪い人じゃなくても DNSとかJavaScriptファイルを公開してるサーバとか乗っ取って偽物ファイルに置き換えられる可能性だってあります
そもそも同じストレージ見ることなんて出来なければそんな心配いらないんです


JavaScriptファイルが置かれているドメインと保存空間が一緒だとして 1つのサイトが複数のライブラリ公開してるなら 保存するときにキーにそれぞれライブラリやサービスごとのプレフィックをつけるなどで対応できます
ですが 現実の HTMLファイルがあるドメインの空間にまとめて保存されるのなら data とか save みたいなシンプルなものだと キーがかぶって上書きされるかもしれず わざわざ他とかぶらないように難しく付ける必要があります
それだけでも手間なのにせっかく難しく付けても ライブラリ作る人も同じように難しく付けて 結局かぶるかもしれないです

ちゃんと確認してかぶってない名前を使うようにしても ライブラリが更新されたときに 新しいバージョンでキー変わったり追加される可能性だってあります
イチイチそんなの調べて かぶってないから安心 なんてやりたくないです

今はまだ webstorage がそこまで使われてないですが どんどん使うところが増えてくると絶対困ることが出てくるはずです

こういった良くないことが起きるかもしれないだけじゃなく 単純に自分のサイト用の保存空間に勝手にデータ置かれるのが気持ち悪いし すごく嫌です
でも ライブラリで使ってるんだから勝手に消すと 影響は出るはずですしそういうわけにはいかないです


JavaScriptのソースコードごとのドメインに保存するようにしたとしても 簡単にストレージ扱うためのライブラリがあちこちのサイトで使われると キーがかぶってしまうかもしれません
ですが あのシンプルで使いやすい webstorage に ストレージ操作するだけのライブラリなんて必要に思えません
なにかの独自の機能を提供してくれて それの保存するためなら ソースのドメインで分けるのが正しいに思います

eval系も場所不定になりそうですが それはeval系を実行した場所でいいと思います


エラー起きた時に どのファイルの何行目 のような情報まで 保持してるわけですし ストレージアクセスしたファイルで保存空間変えることなんて やろうと思えばすぐにできるはずです
特に技術的に無理でもないのになぜこうなってるのか 理解できないです

本当嫌です
webstorage に気軽にデータ入れたくなくなります


将来的には クライアント側で保存しておけば良いデータは全部クライアントで持って 例えば ショッピングサイトなら 使ったことある住所などの入力情報を LocalStorage にもたせて 普段はクライアント側だけでよく使う住所を選択できて 別のPC使っているなどの必要なときにだけサーバから取得するボタンを押すくらいでいいと思うんですけど こういう保存場所がオープン気味なら個人情報的なのを保存してるサービスやプレインなテキストで保存してるサイトはむしろ使いたくないです

同じドメイン内なら共有なので 「このページは信頼済みか自作しか置いてないから安全だし分かりやすい形で保存」 というのも危険です
同じドメイン内で よくわからないライブラリのテストページや安全かわからないライブラリ使ってるページがあるとそのページでは暗号化して保存していても 分かりやすい形で保存したデータもそのページから漏れてしまいます

webstorage すごく便利なのにこの仕様が普通に通ってるということは 仕様考えてる人は 見られても問題ないフラグのようなものしか保存しない前提か 外部ライブラリがストレージに保存なんて基本的にすることがないって想定なんでしょうか



ついでにですが ストレージのアクセス方法がどっちだったとしても ブログみたいなドメインは一緒で 最初の 「/」 までがユーザ名になっていて それ以下が個人のスペースになってると そのブログサービスユーザみんなで同じところを共有してるんですよね

ゲームを作って自サイトで公開してる人が データを LocalStorage の data というキーに保存していたとして また別の人もゲーム作っていて同じく data というキーに保存するようにしてると 「関係ないサイトでゲームしたらセーブデータ消えた!」 となるんですね
ブログなどサービスの運営側がドメインをユーザごとに作ってほしいものです