Mensaje de extensión de Chrome pasando: respuesta no enviada

Estoy intentando pasar mensajes entre el script de contenido y la extensión

Esto es lo que tengo en content-script

chrome.runtime.sendMessage({type: "getUrls"}, function(response) {
  console.log(response)
});

Y en el guión de fondo tengo

chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {
    if (request.type == "getUrls"){
      getUrls(request, sender, sendResponse)
    }
});

function getUrls(request, sender, sendResponse){
  var resp = sendResponse;
  $.ajax({
    url: "http://localhost:3000/urls",
    method: 'GET',
    success: function(d){
      resp({urls: d})
    }
  });

}

Ahora, si envío la respuesta antes de la llamada ajax en la getUrlsfunción, la respuesta se envía con éxito, pero en el método de éxito de la llamada ajax cuando envío la respuesta no la envía, cuando entro en la depuración puedo ver que el puerto es nulo dentro del código para la sendResponsefunción.

De la documentación parachrome.runtime.onMessage.addListener :

Esta función se vuelve inválida cuando el detector de eventos regresa, a menos que devuelva verdadero del detector de eventos para indicar que desea enviar una respuesta de forma asincrónica (esto mantendrá el canal de mensajes abierto al otro extremo hasta que se llame a sendResponse).

Por lo tanto, solo necesita agregar return true;después de la llamada a getUrlspara indicar que llamará a la función de respuesta de forma asincrónica.

La respuesta aceptada es correcta, solo quería agregar un código de muestra que simplifique esto. El problema es que la API (en mi opinión) no está bien diseñada porque nos obliga a los desarrolladores a saber si un mensaje en particular se manejará de forma asíncrona o no. Si maneja muchos mensajes diferentes, esto se convierte en una tarea imposible porque nunca se sabe si en el fondo de alguna función un sendResponse pasado se llamará asíncrono o no. Considera esto:

chrome.extension.onMessage.addListener(function (request, sender, sendResponseParam) {
if (request.method == "method1") {
    handleMethod1(sendResponse);
}

¿Cómo puedo saber si en handleMethod1el fondo la llamada será asíncrona o no? ¿Cómo puede alguien que modifica handleMethod1saber que interrumpirá una llamada introduciendo algo asíncrono?

Mi solución es esta:

chrome.extension.onMessage.addListener(function (request, sender, sendResponseParam) {

    var responseStatus = { bCalled: false };

    function sendResponse(obj) {  //dummy wrapper to deal with exceptions and detect async
        try {
            sendResponseParam(obj);
        } catch (e) {
            //error handling
        }
        responseStatus.bCalled= true;
    }

    if (request.method == "method1") {
        handleMethod1(sendResponse);
    }
    else if (request.method == "method2") {
        handleMethod2(sendResponse);
    }
    ...

    if (!responseStatus.bCalled) { //if its set, the call wasn't async, else it is.
        return true;
    }

});

Esto maneja automáticamente el valor de retorno, independientemente de cómo elija manejar el mensaje. Tenga en cuenta que esto supone que nunca olvida llamar a la función de respuesta. También tenga en cuenta que el cromo podría haber automatizado esto para nosotros, no veo por qué no lo hicieron.

Puede usar mi biblioteca https://github.com/lawlietmester/webextension para hacer que esto funcione tanto en Chrome como en FF con Firefox sin devoluciones de llamada.

Su código se verá así:

Browser.runtime.onMessage.addListener( request => new Promise( resolve => {
    if( !request || typeof request !== 'object' || request.type !== "getUrls" ) return;

    $.ajax({
        'url': "http://localhost:3000/urls",
        'method': 'GET'
    }).then( urls => { resolve({ urls }); });
}) );