Hi DW.

I want to get a message only on that specific targeted tab id. If the messege is sent to tab id 2, it should run a script under tab id 2 to update that page displayed or for simplicity log on tab id 2 console the message.

The tab id is from background script so it then sends a message to that tab id, here is an example:

chrome.webNavigation.onCompleted.addListener(function(details){
    doThis("my_Message", details);
    }

    function doThis(msg, to){
    chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
        //console.log("vvv: " + tabs[0].id);
        chrome.tabs.sendMessage(to.tabId, {action: msg, data: "test"}, function(response){
            if(chrome.runtime.lastError) {
      const rw = setTimeout(() => {doThis(msg);}, 1000);
     clearTimeout(rw);
    } else {
            console.log("Message sent from background");
    }
        });
    });
}

Now my receiving part:

chrome.runtime.onMessage.addListener(function(msg, sender, response){

console.log(sender.id);
console.log(msg);
return true;
}

Recommended Answers

All 9 Replies

Anyone with a solution to this?

Unfortunately I don’t have any experience with this, but it looks to be Chrome specific? Can you explain what you’re trying to accomplish and perhaps there is a different/better way of accomplishing it.

Thanks, well what I basically want to achieve here is that when I have more than 1 tabs opened and let say I was on tab index 2 and I performed a page reload then while it still loading I then set focus (activeTab) to say tab index 0, by the time index 2 complete loading that tab will no longer be an active/focused tab but it will be now tab index 0 so currently it will print/log the message on tab index 0 as it is now the current focused/active tab but I want it to print/log the message on the same tab it was generated on which in this case it tab index 2 not index 0, and if I reload 3 out of 4 tabs all those tabs reloaded or had navigated should be the only tabs printing the message.
The reason for this is that there is a server request that I do which is only based on that particular tab and I want it respond not to be returned anywhere else or opened anywhere else other then the tab that called that request.

This is more like a server client where a calling client has to be the one receiving the response I'm not sure if I should do multi-thread for each tab or what, but I think multi-threading will consume a bit of memory and also it may cause the browser to freeze.

To test this just follow the Mozilla add-on development guide and create a manifest then the first code will be your background script and the second code will be your content script code just as it is, then load it to the browser then load it to your browser as unpacked extension. Click Here from your firefox to be able to load your extension

Can you think of any example where this works? My thought is if this did work it would show an exploit or bug in the browser since a tab is sandboxed from other tabs. It's valid to expect the messages to work in a single tab but would highlight a security/exploit issue if messages flowed sideways between tabs and browsers.

As Dani wrote, maybe there's another way.

Can you think of any example where this works?

Simplest example is a password manager where when a user is visiting website, this is done either onCommitted or onNavigationComplete events, then the password manager will get the tab url and check if this user has any stored credentials for the user so that it will auto-fill if for the user. Now if the user navigate to safe facebook website then while the browser is still loading the user then opens another tab to do something else on that tab while the other tab is still loading contents, the time the tab completes loading the extension will then begin sending the request to check for credentials availability and if available it will return it as a response. That should be a respond to the calling tab no matter which tab the user is currently focused on.

I see the actual problem but I don't know how I will go about solving it. Here is this in a more clear picture on the above code the first code there's a method of sending a message to the content script which is:

chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
        //console.log("vvv: " + tabs[0].id);
        chrome.tabs.sendMessage(to.tabId, {action: msg, data: "test"}, function(response){
            if(chrome.runtime.lastError) {
      const rw = setTimeout(() => {doThis(msg);}, 1000);
     clearTimeout(rw);
    } else {
            console.log("Message sent from background");
    }
        });
    });

Now on the above code the key to the solution that I'm looking for is the targeted tab (destination) where this message is directed to which is to.tabId. This sends the message or should I say it should send the message to the specific tab, now the problem is on the top code the second one which is a content script to check which tabId the content script is running on, then the other issue is then how do I get this to.tabId on the content script because to get the message on the above code I get the message onmsg but as it stands the message is just sent to the active tab only not on the other tabs.

Fixed this by sorting this line out const rw = setTimeout(() => {doThis(msg);}, 1000); to const rw = setTimeout(() => {doThis(msg, to);}, 1000);

Now the issue is manipulating the inactive tab form elements.

Still can't see how https://developer.chrome.com/docs/extensions/reference/tabs/#method-sendMessage will let us interact with say, a Facebook page. Now if the pages are all yours then your code could have scripts in said page to receive and act upon your JSON message. But I still don't see a good explanation of what you are trying to achieve so my thought is that you might be trying to automate interaction with Facebook or other sites than your own. If you were CLEAR about what you were trying to do, maybe I could offer ideas but as it stands I don't see how this API will do much with pages that you don't control.

I've sorted it now it working in terms of each tab to receive the message designated to that specific tab. This is a password manager, as I've said the scenario is that when the user is accessing a web url I then check if the user has credentials stored on our server for that user for that site. This is to automate the filling of the login form so the user don't have to type the credentials each and everytime the user is visiting that site.

Take Facebook for example, if a user has set the password manager to remember his/her facebook credentials, now the user just login to the extension then on the browser visit whatever website he want to access in this case on one tab s/he will access Facebook on one tab then on the other tab the user will load say Daniweb. The password manager has both Facebook and Daniweb user credentials which the user has previously supplied, what I wanted was that when the user is loading both sites at the same time the credentials be able to be correctly returned to the correct calling tab so the Facebook credentials wont go to the current active tab which is say Daniweb and vise verse so I've fixed that now as I've indicated what was the problem.

Now the problem is that yes the data does arrive to to the correct tab but if the tab is not active it doesn't fill and I saw the reason as to why Here by wOxxOm

Now I'm trying to work around this using the visibilityState from here

At the moment the issue is that since the server call is done on a background the content has to wait for the response and it seems this not working or is taking too log to respond and the function gives up waiting, but I'm still trying to work on this. Thinking of using the await() approach and see if it will at the end return anything or.

Ow I just noticed a typo on my solution code I posted the to is missing the id and it should be to.tabId.

A fix to the new problem was to bring the call to the content script it then don't require any waiting.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.