0

大家好，

这是我第一次在这个网站上发帖，我要提出的问题很难说清楚，因为要达到它需要一组变量。让我快速解释一下我正在使用的框架。

我正在使用 jQuery、jQuery-ui 和 Backbone 构建 Chrome 扩展

扩展的整个 JS 套件是用 CoffeeScript 编写的，我正在使用 Rails 和资产管道来管理它。这意味着当我想部署我的扩展代码时，我会运行rake assets:precompile并将生成的压缩 JS 复制到我的扩展目录中。

这种方法的好处是我实际上可以通过包含库从我的 Rails 应用程序内部运行扩展 js。这与我的扩展 background.js 文件基本相同，它将 js 作为内容脚本注入。

无论如何，我最近遇到的问题是当我尝试在我的好友网站上测试我的扩展时，whiskeynotes.com。

我注意到的是，我的主干模型在将它们添加到各自的集合时被破坏了。所以像

this.collection.add(new SomeModel)

创建了我的模型的一些废话版本。

这段代码最终会跑到 Backbone 的 prepareModel 代码中

_prepareModel: function(model, options) {                                                                                                          
  options || (options = {});
  if (!(model instanceof Model)) {
    var attrs = model;
    options.collection = this;
    model = new this.model(attrs, options);
    if (!model._validate(model.attributes, options)) model = false;
  } else if (!model.collection) {
    model.collection = this;
  }
  return model;
},

现在，在我测试过扩展的大多数站点中，结果是正常的，但是在我好友的站点上!(model instance Model)，即使它实际上是正确类的实例，它的评估结果也为 true。结果是模型的超级混乱版本，其中模型的属性是对模型集合的引用（很奇怪吧？）。不用说，之后各种疯狂的事情都在发生。

为什么会发生这种情况超出了我的理解。但是，将此行更改(!(model instanceof Model))为(!(model instanceof Backbone.Model))似乎可以解决问题。我认为这可能与创建自己的“模型”版本的 Flot 库（jQuery 图形库）有关，但查看源代码并没有产生任何实例。我只是好奇为什么会发生这种情况。将这个小改动添加到 Backbone 源代码是否有意义？

更新：

我刚刚意识到“修复”实际上不起作用。我还可以补充一点，我的主干模型在包装对象中命名空间，因此声明看起来像class SomeNamespace.SomeModel extends Backbone.Model

4

2 回答 2

0

女士们和先生们 我相当肯定我已经解决了这个问题，这与我之前的任何假设都没有关系。对于那些对开发 chrome 扩展感兴趣的人，请继续阅读，因为这可以为您将来节省一些麻烦。

每当用户在最初初始化它的网站中导航时，我希望我的 chrome 扩展程序运行内容脚本（通过浏览器操作，也就是 url 栏旁边的小扩展程序图标）。为了达到这个效果，我使用了 chromes chrome.webNavigation.onDOMContentLoaded.addListener(function(details)api。

我不知道的是，这个东西实际上是在网页、推特按钮、g+、facebook 喜欢等加载的每一帧上触发的。所以基本上我的内容脚本是在这些帧中加载并导致各种破坏对象和事件。添加检查以details.frameId === 0解决我的问题。哇！谢谢收听！

于 2012-05-18T18:30:06.583 回答
0

在 Chrome 扩展清单中，您还可以指定内容脚本仅在顶部框架中运行。只需在内容脚本上指定 all_frames 属性。IE，

{
    "name": "My extension",
    ...
    "content_scripts": [
    {
        "matches": ["http://www.google.com/*"],
        "css": ["mystyles.css"],
        "js": ["jquery.js", "myscript.js"],
        "all_frames": false
    }
    ],
 ...
}

Chrome 开发者文档参考

于 2012-07-09T21:12:56.560 回答