手动安装扩展的问题

Question

好的，这是我的问题：

在我的家用电脑上，我安装了 Google Chrome 扩展程序 - WXFZ 的 \Code。此扩展程序完美运行，我每天都将它用于工作目的。但是，我猜开发人员放弃了它，因为在 Google Extensions 下载页面上再也找不到它了。

我正在尝试将该分机从我的家用计算机转移到我的办公室计算机。我的工作计算机上有扩展文件夹，我尝试将其拖放到扩展页面中进行安装，但收到错误消息：

“无法从 'U:\Downloads\pekinghlicdifnlgafajjohhoiochfdh\2.1_0' 加载扩展。'manifest_version' 键必须存在并设置为 2（不带引号）。请参阅 developer.chrome.com/extensions/manifestVersion.html了解详情。”

我不完全确定这意味着什么，但我已经复制了下面清单文件夹的内容。我尝试在清单文件中更改一些内容，但没有任何效果：/

{
   "app": {
      "launch": {
         "local_path": "bscode.html"
      }
   },
   "background_page": "storage.html",
   "content_scripts": [ {
      "all_frames": true,
      "js": [ "js/jquery-1.4.4.min.js", "js/bscode.js", "js/bscode-cs.js" ],
      "matches": [ "http://*/*", "https://*/*" ]
   } ],
   "description": "Simple \\code and \\\\macro engine for common web-forms.",
   "icons": {
      "128": "icon_128.png",
      "16": "icon.png",
      "48": "icon_48.png"
   },
   "key":        "MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQClVb9xGcyZp3P4Fe+rpjGUqVrvRq8rqQl278gMjFzmxqD65cu7uf/erOBlFWbAc6YK15yvgnsYn+HDYvoSV4shajLAnytek7CI35nia5AnYACJsXW+JrfoT9pEgK9Zd4fE1XFr8bNCzhwKeoupH+gtMdvJ9lqAN4Xj/Tam5+QvzQIDAQAB",
   "name": "wxfz\u2019s \\code",
   "permissions": [ "http://*/*", "https://*/*", "tabs" ],
   "update_url": "http://clients2.google.com/service/update2/crx",
   "version": 2
}

有关此问题的任何建议，我将不胜感激。就像我说的，扩展仍然有效；我假设必须有办法让它在我的另一台计算机上工作：/

更新

抱歉，更新后的源代码是：

{
   "app": {
      "launch": {
         "local_path": "bscode.html"
      }
   },
   "background_page": "storage.html",
   "content_scripts": [ {
      "all_frames": true,
      "js": [ "js/jquery-1.4.4.min.js", "js/bscode.js", "js/bscode-cs.js" ],
      "matches": [ "http://*/*", "https://*/*" ]
   } ],
   "description": "Simple \\code and \\\\macro engine for common web-forms.",
   "icons": {
      "128": "icon_128.png",
      "16": "icon.png",
      "48": "icon_48.png"
   },
   "key":"MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQClVb9xGcyZp3P4Fe+rpjGUqVrvRq8rqQl278gMjFzmxqD65cu7uf/erOBlFWbAc6YK15yvgnsYn+HDYvoSV4shajLAnytek7CI35nia5AnYACJsXW+JrfoT9pEgK9Zd4fE1XFr8bNCzhwKeoupH+gtMdvJ9lqAN4Xj/Tam5+QvzQIDAQAB",
   "name": "wxfz\u2019s \\code",
   "permissions": [ "http://*/*", "https://*/*", "tabs" ],
   "update_url": "http://clients2.google.com/service/update2/crx",
   "version": "2.1"
   "manifest_version": 2

}

在我原来的帖子中：

"version": 2

我现在看到这是不正确的，它应该是 2.1，所以我把它改回来了，同时做出了你建议的改变。

Answer 1

您得到的错误是在您的 manifest.json 中要求 "manifest_version": 2 属性。所以，至少你需要：

1. 将"version": 2 更改为"version": "2"（版本 必须是字符串值）。
2. 添加"manifest_version": 2（2 不带引号 - 这是一个数字值）。
3. 将"background_page": "storage.html", 更改为"background": {"page": "storage.html"},。

请注意，某些功能可能会损坏并且还需要重构（以符合清单 v2）。

---

更新：

事实证明，为了使扩展符合 Manifest V2（和功能），需要更改很多内容。在此处发布代码或详细列出每个修改都没有意义，因此我将尝试总结并关注修改的“性质”（请参阅​​下面的更新源代码的链接）：

问题的主要来源是适用于 Google Chrome 扩展程序的新 Content Security Policy (CSP) 不允许 eval 和内联脚本/事件侦听器。为了避免这种情况，需要进行以下更改：

1. 在清单中声明一个允许eval的 CSP
   ("content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'")。
   不幸的是（？）没有办法放松对内联脚本的政策。

2. 在后台页面（即storage.html，使用了内联脚本，所以我最终将代码移动到外部文件（background.js）并包含这样的JS脚本：

   “背景”： { “持久”：是的， “脚本”：[ "js/bscode.js", “js/background.js” ] },

3. 旧的jquery-1.4.4（依赖于内联脚本）也是不行的。所以我不得不替换为较旧的jquery-1.7.2（我尝试使用最新版本的jquery和jquery-ui，但它们与其余代码的配合不佳，所以我回滚到最旧的版本不依赖内联脚本）。此更改同时影响了content_scripts 声明和bscode.html（其中定义和编辑了用户定义的宏）。

4. 迁移到jquery-1.7.2 需要将所有出现的已弃用.live() 移植到使用.on() 的等效语法。 （幸运的是，这只影响了一个文件：chrome-ui.js）

5. bscode.html 有 2 个内联脚本需要移动到外部文件（并放置在正文内的正确位置，因为代码调用了 document.write。

6. bscode.html 有很多内联事件侦听器，这是行不通的。此外，元素（也包含内联事件侦听器）被动态插入到 DOM 中，因此解决方案也必须考虑到这一点。
   我通过使用外部 JS 文件解决了这两个问题，该文件利用 MutationObserver 来侦听节点插入并将任何内联事件侦听器转换为“附加”事件侦听器（通过 addEventListener()）。

最后，为了方便起见，我将bscode.html 设置为扩展程序的Options Page，以便您可以从chrome://exrensions 页面快速调出它。

_{（我希望我没有遗漏什么……）}

可以下载扩展的重构（据我所知功能齐全）源代码here。