Chrome Extension – JavaScript, AJAX, jQuery – Fórum – Programujte.com

Potřebuji si odeslat message z popup. js do content.js. Ale nedaří se mi tu message odchytit

v popup.js mám  

chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
        var activeTab = tabs[0];
        chrome.tabs.sendMessage(activeTab.id, {"message": "start"});
});

v content.js mám
 

addEventListener('message', function(event) {
    if (event.data.message === "start") {
        console.log(event.data);
        chrome.tabs.sendMessage({"message": "spusteno"});
    }
});

tento eventListener funguje, vidim v consoli kdyz si to detekuji, ze zpravy prichazi, ale neprijde zprava z popup.js
Hledal jsem priklady, ale vsude je mají s chrome.runtime.onMessage.addListener, a to mi chrome hlasi jako deprecated a nefunguje to. Napada me, ze addEventListener pouze bere zpravy prichazejici ze stranky, nikoliv z extension, ale pak nevim jak to nastavit.

manifest.json

"content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*"],
      "run_at": "document_idle",
      "js": ["js/inject.js"],
      "all_frames": true
    }
  ],
  "web_accessible_resources" : ["js/content.js"],
  "background": {
    "scripts": ["background.js"],
    "persistent": true
  },

Ví někdo kde je chyba, máte nějaký funkční kod?

Díky

Nevim, jak vypada cely js kod, ale od pohledu bych tipnul, ze event je udalost prohlizece. A pokud si pamatuji, ty nemaji polozku message.
event.data.message === "start"

Netusim, co ti to pise do logu, takovy vypis jsi neposkytnul, takze o tom ani nebudu spekulovat.
console.log(event.data);

someElement.addEventListener('message', function(event) {...}) - by melo byt totez jako
someElement.onMessage() = function (event) {...} - kde event byva obvykle udalost mysi, klavesnice, httprequestu
addEventListener('message', function(event) {...}) - v tomto pripade je element objekt window
https://developer.mozilla.org/…ventListener#…

https://developer.mozilla.org/…eb/API/Event
Podle dokumentace mozilly event zadne message nevraci.

web-socket message, link z te stranky eventu
https://developer.mozilla.org/…MessageEvent
To tam ma onmessage malymi pismeny, nezvykle.
V tom pripade nemuzes zachytavat pres listener, ale musis pouzit tu funkci. To je totiz funkce jineho objektu nez window. Neni to klasicky event, ale uz primo callback funkce.

https://developer.mozilla.org/en-US/docs/Web/API/MessagePort/postMessage

var channel = new MessageChannel();
var para = document.querySelector('p');
    
var ifr = document.querySelector('iframe');
var otherWindow = ifr.contentWindow;

ifr.addEventListener("load", iframeLoaded, false);
    
function iframeLoaded() {
  otherWindow.postMessage('Hello from the main page!', '*', [channel.port2]);
}

channel.port1.onmessage = handleMessage;
function handleMessage(e) {
  para.innerHTML = e.data;
}   

Navic, v tom prikladu onmessage spousteji nad objektem channel.port1, nikoliv wondow nebo iframewindow.
 

#2 peter
Tu polozku message si posilam ja v jsonu, měla by se projevit v event.data

ten event kdyz prijdme zpravu tak pod event se skrývá toto, viz obrazek. Jenze mi tam ta zprava nedorazi. Díval jsem se na to co jsi posilal, zkousel jsem ten channel, port na onmessage, ale nic to nedela.
 

Připojen obrázek.

Dívám se na developer.chrome.com
https://developer.chrome.com/…ns/messaging

Proč to nemají aktuální, když mně to píše, že chrome.runtime.onMessage.addListener() is deprecated, netuším

Nicméně náhrada za addEventListener("message",... není adekvátní, protože tu message neodchytne.

Takže čím to nahradit, možná "message" není správné event, ani "onmessage" nic nezachytí.

 

Krásné příklady jak to zprovoznit
http://waitingphoenix.com/how-to-make-your-chrome-extension-access-webpage/
Ví někdo proč mi chrome.runtime.onMessage.addListener vrací tuto chybu?
Uncaught TypeError: Cannot read property 'addListener' of undefined

jo, jenze ty pises, ze tam mas, ale o ni tam maji neco jineho
addEventListener('message', function(event)
chrome.runtime.onMessage.addListener(

https://developer.chrome.com/…ns/messaging#…

var port = chrome.runtime.connect({name: "knockknock"});
port.postMessage({joke: "Knock knock"});
port.onMessage.addListener(function(msg) {
  if (msg.question == "Who's there?")
    port.postMessage({answer: "Madame"});
  else if (msg.question == "Madame who?")
    port.postMessage({answer: "Madame... Bovary"});
});

Hele, je zbytecne to rozebirat, pokud sem nedas celu svuj kod. Idealne ocesany na jednostrankovy jednochuchy priklad. Ty tam neco mas, ale nikdo netusi, co vlastne. Mozna jsi neotevrel pripojeni.
Ja si treba zkousel hrat v mozile s RTC a WebSockety, ta tam se to resi takto nejak 

WS = {};
	WS.conn = new WS.api(WS.server_url, WS.server_opt);
	WS.conn.onopen    = WS.onopen;
	WS.conn.onclose   = WS.onclose;
	WS.conn.onerror   = WS.onerror;
	WS.conn.onmessage = WS.receiveMessage;
// vsechny udalosti z connection jsem si presmeroval do vlastni funkce

WS.onopen   = function(event)
	{
	var i, li, key, msg;
	WS.status('connection opened');
	CHAT.msgSend('join');
	CHAT.msgSend('userlist');
	if (WS.close_buff == true)
		{
		WS.conn.close();
		return;
		}
	li = WS.send_buff.length;
	if (li>0)
		{
		for (i=0;i<li;i++)
			{
			msg  = WS.send_buff[i];
			type = msg.type ? msg.type : '???';
			WS.status('send ' + type);
			WS.conn.send(WS.encode(msg));
			}
		}
	};
WS.onclose = function(event)
	{
	WS.status('connection closed');
	WS.close_buff = false;
	};
WS.onerror = function(event)
	{
	event = event || window.event;
	WS.error(WS.encode(event.data || event));
	};
WS.receiveMessage = function(event)
	{
WS.status('receive');
	var msg, key;
	event = event || window.event;
	msg = event && event.data ? (event.data!='' ? WS.decode(event.data) : '') : '';
// zachytim zpravu ze socketu a presmeruji jeji obsah na CHAT.receive, 
// nejakou mou funkci, ktera zobrazuje zpravu uzivateli
	CHAT.receive(msg);
	};

#8 peter
On ten kod neni dlouhy, ale uz jsem na to prisel, volam to v zanorem javascript filu a tam ten eventlistener uz nefugnuje

dle manifestu mam nastaven inject.js a ten podstrci dalsi javascript content.js do stranky. Já náslouchal v tom content.js namísto v tom inject.js. Kod jsem presunul do inject js a tam už to funguje.

 "content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*"],
      "run_at": "document_idle",
      "js": ["js/inject.js"],
      "all_frames": true
    }
  ],
  "web_accessible_resources" : ["js/content.js"],
  "background": {
    "scripts": ["background.js"]
  },

Díky