Uncaught TypeError: Невозможно прочитать свойство 'create' из неопределенного в расширении chrome

Question

Я пытаюсь разработать расширение Chrome, где, когда пользователь выбирает текст, этот выделенный текст будет захвачен и затем отправлен в фоновый скрипт для обработки вызова API.Прямо сейчас текст захвачен, но я утешил в следующей строке

background.js

chrome.extension.onMessage.addListener(function(request, sender, sendResponse){
    console.log('req', request.message)

, но это не утешается, возможно, из-за этого блока даже не вызывается.

Вот код

manifest.json

{
  "manifest_version": 2,
  "name": "DEMO",
  "description": "This extension allow the user to select the text and redirect to the google to search that text",
  "version": "1.0",
  "browser_action": {
    "default_icon": "Logo.png",
    "default_popup": "html/popup.html",
    "default_title": "click me"
  },
  "permissions": [
    "activeTab",
    "storage"
  ],
  "options_page": "html/popup.html",
  "background": {
    "scripts": ["js/eventPage.js", "js/background.js"],
    "persistent": false
  },
  "content_scripts": [
    {
        "matches" : [
            "http://*/*", "https://*/*"
        ],
        "js" : [
            "js/content.js"
        ]
    }
],
  "commands": {
          "toggle-feature-foo": {
            "suggested_key": {
              "default": "Ctrl+Shift+Y",
              "mac": "Command+Shift+H"
            },
            "description": "Toggle feature foo"
          }
        }
}

content.js

function init(event) {
  var topic = "";
  if (window.getSelection) {
    topic = window.getSelection().toString();
  } else if (document.selection) {
      topic = document.selection.createRange().topic;
  } else {
    return topic;
  }
  if((event.ctrlKey && event.keyCode === 65) && topic.length) {
    chrome.extension.sendMessage({'message': 'setTopic', 'data': topic}, function(response){
      console.log('response', response);
    })
  }
}

document.addEventListener('keydown',init);

background.js

var selectedTopic = null;

  chrome.extension.onMessage.addListener(function(request, sender, sendResponse){
    console.log('req', request.message) // not listened 
    switch(request.message) {
      case 'setTopic':
        window.selectedTopic = request.data;
      break;
      default:
        sendResponse({data: 'Invalid'})
      break;
    }
  })

  function savetopic(info, tab) {
    var httpRequest = new XMLHttpRequest();
    httpRequest.open('get', 'http://www.google.com/?q='+selectedTopic)
    httpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    httpRequest.onreadystatechange = function() {
    if(httpRequest.readyState==4) {
      alert(httpRequest.responseText);
    }
  }
}

var contexts = ["selection"];
for (var i = 0; i < contexts.length; i++)
{
    var context = contexts[i];
    chrome.contextMenus.create({"title": "Send to Google", "contexts":[context], "onclick": savetopic});
}

Это полный код моего расширения Chrome.Я что-то пропустил в background.js?У меня есть даже это в manifest.json как

"background": {
    "scripts": ["js/eventPage.js", "js/background.js"],
    "persistent": false
  },

, почему он не работает?Я проверил в фоновом режиме из проверок представлений настройки расширения, и он показывает мне следующую ошибку в консоли

Uncaught TypeError: Невозможно прочитать свойство 'create' из неопределенного

Answer 1

Для вашей части обмена сообщениями ваша проблема должна заключаться в том, что вы используете chrome.extension.onMessage и chrome.extension.sendMessage.

Для обмена сообщениями в Chrome вы должны сделать следующее:

chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {
    console.log('req', request.message) // not listened 
    switch(request.message) {
     case 'setTopic':
      window.selectedTopic = request.data;
      break;
     default:
      sendResponse({data: 'Invalid'})
      break;
    }
  });

и

chrome.runtime.sendMessage({'message': 'setTopic', 'data': topic}, function(response){
  console.log('response', response);
  });

Подробнее об этом можно прочитать здесь: https://developer.chrome.com/apps/messaging

Кроме того, для команд API Chrome, которые вы используете, вы хотите обрабатывать команды в фоновом режиме следующим образом:

chrome.commands.onCommand.addListener(function(command) {
        console.log('Command:', command);
      });

вместо того, чтобы доставлять хлопоты везде.

Читайте об этом здесь: https://developer.chrome.com/apps/commands