如何在我的 chrome 扩展中本地保存信息?

Posted

技术标签:

【中文标题】如何在我的 chrome 扩展中本地保存信息?【英文标题】:How can I save information locally in my chrome extension? 【发布时间】:2011-07-18 20:32:04 【问题描述】:

我希望我的 chrome 扩展程序保存一些信息,但我不确定如何启动代码... 我需要它来保存字符串。 例如 - 用户输入一个字符串(在弹出窗口上方的文本区域中),该字符串显示在弹出窗口中。当用户退出并返回时,我希望字符串保持不变。 (我相信它必须保存它) 我不想将它保存在我的服务器或类似的东西上,我希望它保存在用户缓存或其他东西上。

【问题讨论】:

当用户退出时,您的意思是关闭该弹出窗口还是关闭浏览器? 真的很重要吗?当他关闭浏览器时它应该可以工作。 好的,那么 localStorege 就是答案(否则你可以只在后台页面中存储值) 如果您要保存的内容来自一个表单(如 options),我建议webext-options-sync。它基于chrome.storage.sync,但也负责自动保存和自动恢复表单。 【参考方案1】:

您现在也可以利用 Google Chrome 的 storage API 来执行此操作。与 localStorage 不同,它也可以从内容脚本中访问。

//  Somewhere in your manifest...


    "permissions": [
        "storage"
    ]


//  Usage:

//  PERSISTENT Storage - Globally
//  Save data to storage across their browsers...

chrome.storage.sync.set( "yourBody": "myBody" , function()
    //  A data saved callback omg so fancy
);

chrome.storage.sync.get(/* String or Array */["yourBody"], function(items)
    //  items = [  "yourBody": "myBody"  ]
);

//  LOCAL Storage

// Save data to storage locally, in just this browser...

chrome.storage.local.set( "phasersTo": "awesome" , function()
    //  Data's been saved boys and girls, go on home
);

chrome.storage.local.get(/* String or Array */["phasersTo"], function(items)
    //  items = [  "phasersTo": "awesome"  ]
);

更多关于这些恶作剧如何运作的信息:https://developer.chrome.com/extensions/storage#type-StorageArea

以前的答案:

使用localStorage。谷歌浏览器实现了 html5 的一些特性,它就是其中之一。

//Pull text from user inputbox
var data = document.getElementById("this_input").value;
//Save it to the localStorage variable which will always remember what you store in it
localStorage["inputText"] = data; 

您应该注意,您只能从后台页面(无内容脚本)访问您的存储空间,因此您必须为此使用消息传递。

【讨论】:

谢谢!还有一件事 - 它保存在哪里? (我在哪里可以找到这个本地存储文件,基本上) 没问题。 :) 嗯...我不确定。如果它存在,那是你必须四处询问的东西。顺便说一句,如果我有帮助,请检查我的答案。 @BeauCielBleu 你是对的,谢谢。更新。检查一下? @mattsven 是的。并感谢同步/本地差异的解释;) @mattsven 也许这是一个愚蠢的问题,但我如何从 get 回调中取出项目?我正在尝试从那里返回一个变量或设置一个全局变量,但它不起作用。【参考方案2】:

现在有一个特定的 API,请在此处查看: https://developer.chrome.com/extensions/storage

请注意,它仅在您的背景页面上可用,并且在孤立的世界中工作(您无法访问网站的 HTML5 localStorage 中包含的值)。

【讨论】:

这是一个非常令人困惑的表述。主要优点之一是它可以在内容脚本中工作,而无需像消息传递这样的额外工作。

以上是关于如何在我的 chrome 扩展中本地保存信息?的主要内容,如果未能解决你的问题,请参考以下文章

Chrome 扩展:本地存储,如何导出

如何同步 chrome 扩展选项

如何使用 Chrome 扩展程序自动保存 Google Chrome 开发者工具的网络面板日志?

使用 selenium 加载 chrome 扩展

在 mac 终端中安装外部 chrome 扩展

如何测试 chrome 扩展?