Chrome扩展开发总结之浏览器书签获取
Posted 且听真言
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Chrome扩展开发总结之浏览器书签获取相关的知识，希望对你有一定的参考价值。
前段时间公司要求调研了插件开发，现在做一些总结。
功能1：通过Chrome插件获取浏览器的书签。
要在扩展中操作书签，需要在Manifest中声明bookmarks权限：
"permissions": [
"bookmarks"
]
以下是获取用户完整书签的方法
chrome.bookmarks.getTree(function(bookmarkArray)
console.log(bookmarkArray);
);
下图是通过getTree方法获取的完整的Chrome浏览器书签结构。
[
"children":[
"children":[
"dateAdded":1533195221974,
"id":"29",
"index":0,
"parentId":"1",
"title":"Bookmarks",
"url":"chrome://bookmarks/"
,
"dateAdded":1504833760729,
"id":"6",
"index":1,
"parentId":"1",
"title":"System Dashboard - GOME JIRA",
"url":"http://192.168.59.239:8090/secure/Dashboard.jspa"
,
"dateAdded":1504851054302,
"id":"10",
"index":2,
"parentId":"1",
"title":"360导航_新一代安全上网导航",
"url":"https://hao.360.cn/?src=lm&ls=n3287fc1193"
,
"dateAdded":1507861175200,
"id":"13",
"index":3,
"parentId":"1",
"title":"gerrit.iuv.com:8080/login/%2Fdashboard%2Fself",
"url":"http://gerrit.iuv.com:8080/login/%2Fdashboard%2Fself"
,
"dateAdded":1510391708075,
"id":"17",
"index":4,
"parentId":"1",
"title":"新标签页",
"url":"chrome://newtab/"
,
"children":[
"dateAdded":1504833785831,
"id":"7",
"index":0,
"parentId":"22",
"title":"GM2.0代码提交",
"url":"http://192.168.63.219:8080/#/dashboard/self"
,
"dateAdded":1510391652467,
"id":"16",
"index":1,
"parentId":"22",
"title":"GM12B代码提交",
"url":"http://gerrit.iuv.com:8080/dashboard/self"
,
"dateAdded":1523150901878,
"id":"25",
"index":2,
"parentId":"22",
"title":"NanJing Code Review 217",
"url":"http://192.168.63.217:8080/#/dashboard/self"
,
"dateAdded":1525059849667,
"id":"27",
"index":3,
"parentId":"22",
"title":"Wiki",
"url":"http://wiki.iuv.com:8090/spaces/viewspace.action?key=IUV"
],
"dateAdded":1519300604409,
"dateGroupModified":1525059849667,
"id":"22",
"index":5,
"parentId":"1",
"title":"代码提交"
,
"children":[
"dateAdded":1519300582881,
"id":"21",
"index":0,
"parentId":"23",
"title":"专利检索及分析",
"url":"http://www.pss-system.gov.cn/sipopublicsearch/portal/uiIndex.shtml"
,
"dateAdded":1519300549982,
"id":"20",
"index":1,
"parentId":"23",
"title":"佰腾网",
"url":"http://www.baiten.cn/"
],
"dateAdded":1519300686945,
"dateGroupModified":1523150901878,
"id":"23",
"index":6,
"parentId":"1",
"title":"专利"
,
"dateAdded":1533195225452,
"id":"30",
"index":7,
"parentId":"1",
"title":"扩展程序",
"url":"chrome://extensions/"
,
"dateAdded":1534917074926,
"id":"32",
"index":8,
"parentId":"1",
"title":"Animate.css",
"url":"https://daneden.github.io/animate.css/"
],
"dateAdded":1504833743697,
"dateGroupModified":1534917074926,
"id":"1",
"index":0,
"parentId":"0",
"title":"书签栏"
,
"children":[
],
"dateAdded":1504833743697,
"id":"2",
"index":1,
"parentId":"0",
"title":"其他书签"
],
"dateAdded":1535934493104,
"id":"0",
"title":""
]
以下是解析该书签结构的方法：需求是需要获取每个书签的url以及这个书签的完整路径。
function analyseBookMark (data, bookmarkArray, path)
for (var children in data)
if (data[children].length > 0 && typeof(data[children]) == "object")
if (data && data.title && data.title !== '')
path = path + data.title + '/';
analyseBookMark(data[children], bookmarkArray, path);
else
if (typeof(data[children]) == "object")
for(var childKey in data[children])
if (typeof(data[children][childKey]) == "object")
if (data && data[children].title && data[children].title !== '')
path = path + data[children].title + '/';
analyseBookMark(data[children][childKey], bookmarkArray, path);
else
if (childKey === "url")
var url = data[children][childKey];
var title = data[children].title;
var path = path;
var jsonData =
title: title,
url: url,
path: path
;
bookmarkArray.push(jsonData);
else
if (children === "url")
var url = data[children];
var title = data.title;
var path = path;
var jsonData =
title: title,
url: url,
path: path
;
bookmarkArray.push(jsonData);
;
以上是关于Chrome扩展开发总结之浏览器书签获取的主要内容，如果未能解决你的问题，请参考以下文章