Question

我正在尝试使用Crossrider创建一个跨浏览器扩展，它将能够管理浏览器书签，监视打开的浏览器选项卡/窗口并根据用户的请求[当用户单击按钮时]将它们保存到远程服务器等。我可以使用“appAPI.browserAction.setPopup（）”方法创建弹出窗口或使用“侧边栏”插件显示打开的浏览器标签/窗口。

Q-1。使用一个优于另一个的优点/缺点是什么？ 问题2。还有其他方法吗？ Q-3。如何监控和显示已打开的浏览器标签/窗口？

此外，我想使用远程服务器[我的网站的服务器]来托管“图像，JavaScript和CSS”文件，以便扩展程序的“外观和感觉”和“功能”可以不断更新，而无需用户保持安装扩展并且不增加扩展的大小。我知道我可以将“Resources”文件夹用于“Images，JavaScript和CSS”，但我更喜欢上述方法进行开发。

Q-4。在扩展程序中使用远程托管文件的最佳方式是什么？

Answer 1

A-1。通常，每次单击扩展按钮时都会重新创建按钮popup的内容，而侧边栏的内容仍然存在。因此，在这种情况下，我认为您希望这些信息可以随时访问，使用sidebar plugin是有意义的。

A-2。这些方法封装了这种内容的两种通用方法的核心概念，即嵌入按钮弹出窗口或HTML页面（即侧边栏）中。当然，有各种各样的解决方案可用于如何在页面内显示内容; - ）

A-3。您可以使用appAPI.tabs.onTabCreated监控正在创建的标签，并使用回调功能执行您需要的任何任务。但请记住，由于浏览器的限制，该方法仅检测在当前浏览器实例中创建的新选项卡。

A-4。如果不了解更多关于扩展的解剖结构，这个问题有点难以回答。我假设您要将此内容注入页面或在您的扩展中使用JS。因此，可以使用appAPI.resources，appAPI.dom或jQuery根据范围包含远程文件，如下所示：

在 extension.js 文件中：

appAPI.ready(function($) {
  // Includes remote JS file into extension.js scope
  appAPI.resources.includeRemoteJS('http://example.com/file.js');

  // Injects remote JS file into HTML page
  appAPI.dom.addRemoteJS('http://example.com/file.js');

  // Injects remote CSS file into HTML page
  appAPI.dom.addRemoteCSS('http://example.com/file.css');

  // Injects remote image file into HTML page
  $('<img src="http://example.com/file.png">').appendTo('body');
});

在 background.js 文件中：

appAPI.ready(function() {
  var remoteJS = appAPI.resources.get('http://example.com/file.js');
  eval(remoteJS);
});

免责声明：我是Crossrider员工

使用Crossrider的跨浏览器扩展

1 个答案: