如何在firefox中查看IndexedDB内容

时间:2012-03-23 20:20:15

标签: firefox indexeddb

我一直在使用Firefox(Ubuntu)中的IndexedDB

有没有办法可视化IndexedDB数据库内容? 或者我必须以程序化的方式进行吗?

7 个答案:

答案 0 :(得分:18)

据报道, Bleeding edge Chromium版本允许您在Chrome devtools的“资源”面板中查看IndexedDB内容,但我只知道一种非编程方式查看Firefox IndexedDB内容的方法,即直接加载.sqlite文件。

Firefox的IndexedDB .sqlite文件位于OS X上的/Users/{USER}/Library/Application Support/Firefox/Profiles/{PROFILE}/indexedDB,在Windows上应为C:\Users\{USER}\AppData\Roaming\Mozilla\Firefox\Profiles\{PROFILE}

我使用优秀的(和免费的)Firefox工具SQLite Manager,它是跨平台的。

which looks like this

但要记住的一件事是,内容通常存储为二进制blob,并且可能不是人类可读的。密钥存储为文本,但是应该可以手动读取。

更新虽然本地文件仍然是查看IDB数据库和商店的绝佳方式,但Chrome现在在“资源”面板中提供了很好的工具。

答案 1 :(得分:9)

我刚下载了Firefox的IndexedDB Browser插件。它运作良好。下载后,它位于:

工具> Web开发人员> IndexedDB浏览器

https://addons.mozilla.org/en-US/firefox/addon/indexeddb-browserupdated-fix/

编辑: 自Firefox 26以来,IndexedDB的文件已从

{PROFILE}/indexedDB/
移至
{PROFILE}/storage/persistent/
当前版本(0.1.4)无法处理此更改。但是,它可以通过符号链接轻松解决。

答案 2 :(得分:3)

Ubuntu上的Firefox indexedDB位置是:

~/.mozilla/firefox/*.default/storage/persistent/

~/.mozilla/firefox-trunk/*.default/storage/persistent/

答案 3 :(得分:2)

您可以尝试我的indexeddbviewer,它位于http://linq2indexeddb.codeplex.com

您需要做以下事情: - 将以下引用添加到您的页面:

<script type="text/javascript" src="../Scripts/jquery-1.7.2.js"> </script>
<script type="text/javascript" src="../Scripts/jquery-ui-1.8.20.js"> </script>
<script type="text/javascript" src="../Scripts/Linq2IndexedDB.js"> </script>
<script type="text/javascript" src="../Scripts/IndexedDBViewer.js"> </script>

这意味着你需要获得jQuery + jQuery UI 和linq2indexedDB(这是我的lib,你也可以在http://linq2indexeddb.codeplex.com上得到它。)

要使其正常工作,请在正文中添加以下内容:

<body>
    <p><label id="lblDatabaseName" for="txtDatabaseName">Database name:</label> <input type="text" id="txtDatabaseName" /><input type="button" id="btnViewDatabase" value="View database" /></p>
    <div id="tabs">
        <ul>
        </ul>
    </div>
</body>

我会尽快找到一种更简单的方法。

另一种方法是使用我的linq2indexeddb库,并像这样创建一个新实例:

var db = window.linq2indexedDB("Database name", null, true)

如果你这样做了,你可以调用一个属性查看器,它将为你提供有关indexeddb数据库的所有信息。

db.viewer

答案 4 :(得分:2)

在新版本的firefox中,开发人员工具附带了一个方便的Storage Inspector。

https://developer.mozilla.org/en-US/docs/Tools/Storage_Inspector

目前你必须使用每晚构建的firefox来获取它

https://nightly.mozilla.org/

答案 5 :(得分:0)

let db;
function createDB() {    
    let dbName = "Jokes";
    let dbVersion = 5;
    let request = indexedDB.open(dbName, dbVersion);
    request.onupgradeneeded = e => {
      db = e.target.result
      console.log(db);
      let jstore = db.createObjectStore("JokeStore", {keyPath: "title"});
      let mstore = db.createObjectStore("MockStore", {keyPath: "title"});
      alert("upgrade");
    }
    request.onsuccess = e => {
      db = e.target.result
      console.log(db);
      alert("success");
    }
    request.onerror = e => {
      alert("error"+e.target.error);
    }
}
function addRecord(title, text) {
    let tx = db.transaction("JokeStore","readwrite");
    tx.onerror = e => alert(e.target.error);
    let jstoretx = tx.objectStore("JokeStore");
    jstoretx.add({title: title, text: text});
}
function viewNotes() {
    let tx = db.transaction("JokeStore", "readonly");
    let jstore = tx.objectStore("JokeStore");
    let request = jstore.openCursor();
    request.onsuccess = e => {
        let cursor = e.target.result;
        if (cursor) {
            console.log(cursor.key, cursor.value.text);
            cursor.continue();
        }
    }
}
createDB(); // Creates db if not there or opens an existing one
addRecord("Joke 1", "Knock Knock"); // Adds record
addRecord("Joke 2", "Elephant and the ant"); // Adds record
viewNotes(); // Displays all records in console

答案 6 :(得分:0)

我不得不从WhatsApp Web会话中读取indexedDB,而我是这样进行的:

function readDB() {
    let dbName = "wawc";
    let dbVersion = 70;
    let request = indexedDB.open(dbName, dbVersion);
    request.onsuccess = e => {
      let db = e.target.result
      let tx = db.transaction("user", "readonly");
      let jstore = tx.objectStore("user");
      let request = jstore.openCursor();
      request.onsuccess = e => {
        let cursor = e.target.result;
        if (cursor) {
          console.log(cursor.key, cursor.value);
          cursor.continue();
        }
      }
    }
    request.onerror = e => {
      console.log("error"+e.target.error);
    }
}
readDB();

控制台日志将显示'wawc'数据库中表'user'的内容。