0

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

Q-1。 使用其中一种的优点/缺点是什么？ Q-2。 有没有其他方法可以做到这一点？ 问-3。 如何监控和显示打开的浏览器选项卡/窗口？

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

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

4

1 回答 1

3

A-1. In general, the content of a button's popup is created afresh each time you click the extension button whereas the sidebar's content persists. Hence, in this instance where I presume you will want this information to be readily accessible, it makes sense to use the sidebar plugin.

A-2. These methods encapsulate the core concepts of the two general methods for this kind of content, i.e. embed in a button popup or within the HTML page (i.e. the sidebar). Of course, there are all sorts of solutions available for how to display the content within the page ;-)

A-3. You can monitor tabs being created using appAPI.tabs.onTabCreated and use the callback function to perform any tasks you require. However, bear in mind that due to browser limitations, the method only detects new tabs created in the current browser instance.

A-4. This question is a bit tricky to answer without knowing more about the anatomy of your extension. I am assuming you want to inject this content into pages or use JS in your extension. Therefore, remote files can be included depending on the scope using appAPI.resources, appAPI.dom, or jQuery, as follows:

In the extension.js file:

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');
});

In the background.js file:

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

Disclaimer: I am a Crossrider employee

于 2013-07-14T08:22:50.463 回答