如何从注入的内容脚本传递异步操作的结果?

时间:2015-12-03 19:59:48

标签: javascript ajax google-chrome google-chrome-extension

我的Chrome扩展程序通过注入此内容脚本在活动页面上成功执行了AJAX请求(非跨域):

// post.js
$.post("/login", {
    name: "blabla"
}, function (data) {
    alert("Success!");
});

此脚本从弹出/后台页面注入chrome.tabs.executeScript

chrome.tabs.executeScript(null, {
    file: '/src/assets/jquery-2.1.4.min.js'
}, function () {
    chrome.tabs.executeScript({
        file: 'post.js'
    });
});

如何将此AJAX请求的结果传回弹出窗口或后台页面?

1 个答案:

答案 0 :(得分:2)

来自内容脚本中回调函数的

Send a message

$.post("/login", {
    name: "blabla"
}, function (data) {
    chrome.runtime.sendMessage({results: data});
});

或者发送消息并从弹出/背景页面接收响应:

    chrome.runtime.sendMessage({results: data}, function(response) {
        console.log(response);
    });

在弹出/后台页面中声明将处理消息的侦听器:

chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
    if (message.results) {
        console.log('Got data, tab #%d', sender.tab ? sender.tab.id : -1, message.results);
        sendResponse({reply: "thanks"}); // optional, not required
    }
});

注意:

  • 只能传递JSON可序列化的对象,因此您无法使用dataType: 'xml'$.post的{​​{1}}参数,因为在这种情况下,响应是非JSON可序列化的{{ 1}}。请改为使用$.ajax,并在收听者收到时将其转换为Document
  • 从扩展工具栏弹出内容脚本弹出时要注意弹出窗口可能会被用户关闭,因此其事件侦听器将被销毁并且消息将丢失。使用后台页面接收消息时,这不是问题。