javascript - 如何将数据从弹出脚本发送到crossrider中的background.js？

Question

我正在使用 crossrider 开发浏览器扩展。我有一些资源页面，例如 popup.html 和 popup.js。在 popup.html 中，有一个表单，当用户提交表单时，我想将数据发送到我的服务器，这很简单。但我还想将事件选项卡 URL 与表单数据一起发送。但我们只能在background.js 中获取事件选项卡的url。为此，我需要将表单数据发送到background.js，然后将它们发布到我的服务器。

所以我的问题是如何将数据从popup.js(弹出窗口)发送到background.js？

Answer 1

在回答您的直接问题时，您可以使用appAPI.message.toBackground将数据从弹出范围发送到后台范围。 .

但是，我认为在打开弹出窗口时获取事件选项卡的 URL 会更有效，以便在提交表单时在弹出窗口中可用。您可以通过直接从事件选项卡请求事件选项卡的 URL 并将响应保存在弹出范围内的 var 中来实现此目的，如下所示:

popup.html:

function crossriderMain($) {
  // var to store active tab's URL
  var activeTabUrl = null;

  // Message listener for response from active tab
  appAPI.message.addListener(function(msg) {
    if (msg.type === 'active-tab-url') activeTabUrl = msg.url;
  });

  // Request URL from active tab
  appAPI.message.toActiveTab({type: 'active-tab-url'});

  // THE REST OF YOUR CODE
}

extension.js:

appAPI.ready(function($) {
  // Message listener
  appAPI.message.addListener(function(msg) {
    if (msg.type === 'active-tab-url')
      // Send active tab's URL to popup
      appAPI.message.toPopup({
        type: 'active-tab-url',
        url:encodeURIComponent(location.href)
      });
  });

  // THE REST OF YOUR CODE
});

[免责声明:我是 Crossrider 员工]