web-dev-qa-db-ja.com

localStorageを表示または編集する方法

Chrome拡張機能を作成し、データの保存にlocalStorageを使用しています。

私は "background_page"を通してlocalStorageにアクセスしています。

うまく機能しますが、手動で値を表示するにはどうすればよいですか。 FirefoxではFirebugを使うことができます。

何か提案がありますか?

232
Joe Doe

それは簡単です。を押して開発者ツールに移動するだけです。 F12次にアプリケーションタブに行きます。 Storageセクションで、Local Storageを展開します。その後、ブラウザのローカルストレージがすべてそこに表示されます。

240
user1613294

を押してDeveloper Toolsを開くだけです。 F12

アプリケーション(以前のリソース)タブをクリックすると、localStorageのコンテンツが表示されます。そこから、手動でキー/値エントリを追加/編集/削除することができます。

localStorage resources tab

OS Xでは、キーは次のとおりです。  +  + i

別の組み合わせ Ctrl + Shift + i


編集:Chrome 56では、このようになります:

enter image description here

160
Simone

私は現在クロムバージョン52.0.2743.82メートルを使用しています。現在の最新バージョンのchromeでは、 "Developer Tools"を起動して "Application"タブを見ることで、ローカルストレージの値を確認できます。

16
Luke P. Issac

あなたはchrome:// chrome/extensionsに行くことができます、そしてあなたが起動したらあなたがlocalStorageのものを見るために開発ツールを使うことができるあなたの背景ページへのリンクがあるでしょう。

15
Ryan S

私がここにいる人々が何をしようとしているのか理解していない、そしてそれは私がしていることではない、そして/またはChrome開発者ツールが変更され、この点で壊れている。

私の拡張のcontent-scriptはこのようなデータを保存します:

chrome.storage.local.set(packet);

拡張機能の背景ページの[アプリケーション]タブを表示し、[ストレージ]> [ローカルストレージ]の順に展開すると、拡張機能が一覧表示されますが、クリックしてもデータが表示されません。

私が見つけた唯一の解決策は、バックグラウンドページのコンソールでこれを実行することです。

chrome.storage.local.get(null, function(data) {console.log(data);})

これはエクステンションがそれを読む方法に似ています(私が欲しいものだけを得るためにキー名の代わりにすべてのキーを得るためにnullを渡すことを除いて)そしてそれはうまく動作します。私にはうまくいかないこれらすべての答えがここにあるのも奇妙なことです。

私は、Windows 10上でChrome 73.0.3683.103(Official Build)(64-bit)を使用しています。それが適切であれば、拡張機能はまだ解凍されていませんが、今度はこれをやりたい、つまり開発中です。

0
enigment