{"id":21638499,"url":"https://github.com/tingge/chrome-extensions","last_synced_at":"2026-05-21T14:07:29.923Z","repository":{"id":20630727,"uuid":"23912422","full_name":"TingGe/chrome-extensions","owner":"TingGe","description":"Bookmarklet 和 Chrome Extensions","archived":false,"fork":false,"pushed_at":"2018-06-18T12:52:56.000Z","size":2470,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-03-19T01:15:24.883Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/TingGe.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-09-11T09:37:53.000Z","updated_at":"2018-06-18T12:52:57.000Z","dependencies_parsed_at":"2022-09-03T10:10:31.272Z","dependency_job_id":null,"html_url":"https://github.com/TingGe/chrome-extensions","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/TingGe/chrome-extensions","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TingGe%2Fchrome-extensions","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TingGe%2Fchrome-extensions/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TingGe%2Fchrome-extensions/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TingGe%2Fchrome-extensions/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/TingGe","download_url":"https://codeload.github.com/TingGe/chrome-extensions/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TingGe%2Fchrome-extensions/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33303169,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-21T12:23:38.849Z","status":"ssl_error","status_checked_at":"2026-05-21T12:22:11.673Z","response_time":62,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-25T04:09:51.374Z","updated_at":"2026-05-21T14:07:29.885Z","avatar_url":"https://github.com/TingGe.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"Chrome Extensions 和 Bookmarklet\n==========================\n\n\u003e 14年至15年，陆续做一些 Chrome 扩展和浏览器书签脚本 Bookmarklet 的小工具。一般来说，优先选择 Bookmarklet 方案，涉及网络报文操作时采用 Chrome 扩展方案。\n\n在此，记录些逆向 Google 工具的代码。\n\n调研\n---------------\n\n- [Page Analytics (by Google)](https://chrome.google.com/webstore/detail/page-analytics-by-google/fnbdnhhicmebfgdgglcdacdapkcihcoh?hl=en)，一款用于查看用户与你的网页互动的 Chrome 扩展。\n\n- [Tag Assistant (by Google)](https://chrome.google.com/webstore/detail/tag-assistant-by-google/kejbdjndbnbjgmefkgdddjlbokphdefk?utm_source=chrome-ntp-icon)，效率型的小助理，验证谷歌追踪码的安装状态，包括Google Analytics, Adwords Conversion Tracking, Google Tag Manager 等。\n\n- [Google Analytics Debugger](https://chrome.google.com/webstore/detail/google-analytics-debugger/jnkmfdileelhofjcijamephohjechhna?utm_source=chrome-ntp-icon)，主要是用來除错，在一些定制化的JavaScript处理上，可以用来检查 Google Analytics 数据是否成功发送。\n\n\n\nChrome扩展开发案例——Page Analtics（by Google）代码逆向分析\n---------------\n\n### 目录结构\n\n主要由manifest.json、background.js、content.js（css）、popup.js(html、css)和resources（主要存放图片资源）五部分组成。代码分析见page-analytics/1.6.0.1_0/\n\n![image](./res/dir.png) \n\n_metadata目录是将扩展上传到Chrome web store时，由Google添加进crx中的验证文件。\n\n注释：CMF文件暂时未知用途。\n\n### 文件功能\n\n#### manifest.json：\nChrome Extensions配置清单文件。用于配置加载background、content_scripts、popup等。\n\n#### background：\n背景页。有三个作用：\n\n1. 用于验证Google+ 登录API，并在加载完 client:plusone.js（https://apis.google.com/js/client:plusone.js?onload=gaextOnGapiClientLoadCallback） 时调用回调方法 gaextOnGapiClientLoadCallback。\n\n2. 读写storage存储。websiteSettings（Config）、ga-clientId(GAClient)\n\n3. 读写cookie。APISID、SAPISID(Background的Auth)\n\n##### 网络视图\n\n![image](./res/network-_generated_background_page.png) \n\n##### background Elements视图\n\n![image](./res/elements-_generated_background_page.png) \n\n##### background Resources视图\n\n![image](./res/resources-_generated_background_page1.png) \n\n![image](./res/resources-_generated_background_page2.png) \n\n##### client:plusone \n\n![image]() \n\n#### content_script：\n根据登录和popup中的 Data Panel 位置信息，在页面中创建 Data Panel\n\nData Panel:\n![image](./res/iyp_spacer_top.png) \n\nReal-time:\n![image](./res/iyp_toolbar.png) \n\n#### popup：\n根据登录信息，呈现未显示 Data Panel 原因、登录或控制 Data Panel 位置信息\n\n未显示 Data Panel 原因:\n\n![image](./res/reason.png) \n\n登录:\n\n![image](./res/signin.png) \n\n设置 Data Panel 位置:\n\n![image](./res/set-position.png) \n\n\n参考\n---------------\n\n- [網站分析師瀏覽器必掛工具 – Tag Assistant (by Google)](http://blog.wis.com.tw/2013/fay/tag-assistant-by-google/) \n- [Building a Chrome Extension with Yeoman](http://www.alolo.co/blog/2013/10/30/building-a-chrome-extension-with-yeoman)\n- [Chrome Extension generator](https://github.com/yeoman/generator-chrome-extension)\n- [Chrome 官网扩展程序文档](https://developer.chrome.com/extensions/extension)\n- [Chrome 扩展程序、应用开发文档（非官方中文版）](https://code.google.com/p/crxdoczh/)\n- [360极速浏览器应用开放平台](http://open.chrome.360.cn/extension_dev/overview.html)\n- [Google+ Platform JavaScript API](https://developers.google.com/+/web/api/javascript?hl=zh-cn)\n- [浏览器兼容性检测工具文档](https://github.com/TingGe/compatibility-detector/blob/master/README.md)\n- [Bookmarklet实例:front-end performance heatmap-Perfmap](https://github.com/TingGe/perfmap)\n- [Chrome插件官方Native Client开发文档](https://developer.chrome.com/native-client) \n- [20100915 學習撰寫 Google Chrome Extension](http://www.slideshare.net/lis186/20100915-google-chrome-extension)\n- [从零开始写一个 Chrome 扩展](https://segmentfault.com/a/1190000005896962)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftingge%2Fchrome-extensions","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftingge%2Fchrome-extensions","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftingge%2Fchrome-extensions/lists"}