我正在尝试编写一个允许用户轻松登录到内部网页的Chrome扩展。该扩展将显示一个包含预定义凭据的菜单,用户可以从该菜单中选择一个并立即将其登录到相应的网页中(想想书签++)。chrome.storage.sync.get不返回完整的JS对象
作为第一步,我想写一个接受'名称','网址','用户名'和'密码'信息的功能,并且使用chrome.storage.sync.set。用户可以使用chrome.storage保存多组此类信息(例如,针对同一网站的不同用户名)。我能够成功地完成此操作,并且选项页面也能够列出所有保存的信息。目前,请忽略与客户端密码加密相关的安全问题。
这是我的manifest.json
{
"name": "My Chrome Extension",
"version": "1.0",
"manifest_version": 2,
"description": "Easy login to My Webapp",
"browser_action": {
"default_icon": "images/Cloud16.png",
"default_popup": "html/popup.html"
},
"options_page": "html/options.html",
"permissions": ["<all_urls>", "storage", "unlimitedStorage"]
}
这是保存处理程序选项页(在options.js):
function saveHandler() {
var name = $("#name").val(),
url = $("#url").val(),
password = $("#password").val(),
key = Date.now() + "", //key based on currentTimeInMillis
obj = {
"id": key,
"name": name,
"url": url,
"password": password
};
chrome.storage.sync.get('LOGIN_COLLECTION', function(items) {
//Create a new collection if not exists
if(items && !items['LOGIN_COLLECTION']) {
items['LOGIN_COLLECTION'] = {};
}
items['LOGIN_COLLECTION'][obj.id] = obj;
chrome.storage.sync.set(items, function() {
// Notify that we saved.
console.log('Settings saved');
chrome.storage.sync.get('LOGIN_COLLECTION', function(data) {
console.dir(data);
});
});
$("#addUrlDialog").slideUp();
loadExistingInfo(); //Read persisted data, and show. This works fine!!
});
}
当工具栏上的图标分机用户点击,我显示一个弹出的html,它有一个脚本来获取在选项页面中保存的数据(使用chrome.storage.get)。在弹出来获取数据的代码如下所示:
chrome.storage.sync.get('LOGIN_COLLECTION', function(items) {
var container = $("#listContainer"),
data = items['LOGIN_COLLECTION'];
for(item in data) {
console.dir(item); //**Outputs empty object**
$("<div></div>").text(item.name).appendTo(container);
}
});
正如你所看到的,抓取是就能得到的只有顶层对象的信息,但没有它的属性。我应该使用内容脚本还是后台页面来读取由chrome.storage.sync.set设置的数据?任何帮助,将不胜感激。
非常感谢。我会测试这个以确保它能正常工作。 – sathishpaul
确实是问题的关键。修复它使扩展工作。谢谢 :) – sathishpaul