Erreur de port: impossible d'établir la connexion. Erreur dans le gestionnaire d'événements pour 'indéfini'. (extension chrome)

Question

J'essaye fondamentalement d'exécuter le code trouvé dans la documentation d'extension de Chrome. Et c'est là que je suis coincé. J'essaie de transmettre des valeurs à partir du script Content >> page d'arrière-plan (pour XHR).

Et im erreur se dans la console est:

Port error: Could not establish connection. Receiving end does not exist. miscellaneous_bindings:236

Error in event handler for 'undefined': Cannot read property 'farewell' of undefined TypeError: Cannot read property 'farewell' of undefined
at chrome-extension://bccajmddlghglocgmkpkpbiankmhlfkc/js/content_script.js:23:23
at miscellaneous_bindings:281:11
at chrome.Event.dispatchToListener (event_bindings:387:21)
at chrome.Event.dispatch_ (event_bindings:373:27)
at chrome.Event.dispatch (event_bindings:393:17)
at Object.chromeHidden.Port.dispatchOnDisconnect (miscellaneous_bindings:239:27)

content_script.js ressemble à ceci:

function func1(){ 

$(function() { 

    $('.genericStreamStory').each(function(){ 
     var link = $(this).find('.uiStreamSource a').attr('href'); 

     $(this).find('.uiStreamFooter').find('.a1').remove(); 
     $(this).find('.uiStreamFooter').append("<span class='a1' style='color:red !important;'> · Sample</span>"); 


     $(this).find('.a1').click(function(){ 
      alert('hi'); 
      chrome.extension.sendMessage({greeting: "hello"}, function(response) { 
       console.log(response.farewell); 
     }); 

     console.log('testing'); 

     }); //end of click handler 
    });  //end of 'each' function 
}); 

} 
func1(); 
window.setInterval("func1()", 1000); 

L'envoi déclaration de message chrome.extension.sendMessage({greeting: "hello"}, function(response) { console.log(response.farewell); });

est tiré de la Chrome Extension Documentation.

background.js:

$(function() { 

    chrome.extension.onMessage.addListener(
     function(request, sender, sendResponse) { 
      console.log("background"); 
      console.log(sender.tab ? "from a content script:" + sender.tab.url : "from the extension"); 
      if (request.greeting == "hello") 
      sendResponse({farewell: "goodbye"}); 
});// end of onMessage listener 

}); 

Le code pour onMessage Listener est tiré de la documentation Chrome.

et enfin, manifest.json:

{ 
"name": "Facebook123", 
"version": "0.1", 
"description": "Sample", 

"content_scripts": [ 
    { 
     "matches": ["https://*.facebook.com/*"], 
     "js": [ 
       "/js/external/jquery.js", 
       "/js/content_script.js" 
      ] 
    } 
], 

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

"manifest_version": 2 
} 

On dirait que l'auditeur ne semble pas être 'disponible' pour traiter le message envoyé par conrent_script.js.

Le gestionnaire de clics dans content_script.js fonctionne. La boîte d'alerte 'salut' apparaît et le message 'testing' est imprimé dans la console lorsque je clique sur l'intervalle 'a1'.

Quelle pourrait être l'erreur?

Answer 1

Ouvrez la console de la page d'arrière-plan (Where to read console messages from background.js in a Chrome extension?).

Vous verrez une erreur comme "ReferenceError: $ is not defined", car vous utilisez $(function() { }); sans avoir chargé jQuery.
Vous ne devez pas attendre l'événement domready dans la page d'arrière-plan, donc la suppression de $(function(){ et }); résoudrait le problème. Une autre façon de se déplacer est d'inclure jQuery:

"background": { 
    "scripts": [ 
     "/js/external/jquery.js", 
     "/js/background.js" 
    ] 
}, 

En général, une « erreur Port » indique que vous essayez d'envoyer un message alors que personne n'écoute des messages. Dans ce cas, l'écouteur n'est pas lié à cause d'une erreur, mais vous constaterez souvent que la séquence (liaison d'événement, déclenchement d'événement) est mal synchronisée et doit être corrigée.