accessing other tab from one window - javascript

How does the browser treat multiple tab? Are they completely separate entity where no interaction is possible? I understand the sandbox concept of the browser and other security concerns but is it possible for a webpage to interact with another tab in the browser?
Basically my question is: If a user loads one webpage in a new tab, is there some way to access information of other tab which is already opened or will be opened after?
I have one concept of an application which needs to know about the other tab already opened or opened after my conceptual webpage but I don't know if this is possible.


As far as I know, this isn't possible. The browser wouldn't allow you to manipulate the browser's lower functions in a regular environment. It would ignore it or show a security error come up.


I think there is no way to do that, except when both documents are written to communicate with each other (Like in vBulletin new windows). The only way to access tabs is writing Add-Ons for the browser.


There is no way to access other tabs on the client-side.
However, I can imagine a scenario in which this could be done server side. Have the user log in to your site on both tabs and use something like sockets to pass data back and forth from one tab to the other using the server as a middle-man.


If both pages are from the same domain, you can use cookies or, in HTML5, local storage.


If you own the other tabs, you can broadcast to other tabs, and other tabs can broadcast back to your tab, creating a practical communication channel among them.
This is called Inter-window messaging, and it uses LocalStorage.
To simply check if you are the active tab, use $(window).blur( ... ), or a similar technique using a library of your choice.

Related

Check if a page is already opened

Is there a reliable way to know if an other instance of the same page is already opened in the browser?
I’ve tried setting up a variable in local storage at load and unload but mobile browsers do not always send the unload event..

The context of JavaScript code is per opened page (called window). Therefore, there is no reliable way to track open pages unless you open a WebSocket connection to the server and check the number of open pages by associating a unique identifier to each of them and prevent opening multiple pages. If you want to take this approach, search for a WebSocket implementation of your server-side application.

How to force external links to open in an existing web app?

I cannot find anything about it but I find it hard to believe no one has ever tried this.
I'm looking for a client-side solution that allows me to re-use an existing web application running in a browser tab/window when a link is 'clicked' externally.
For example, someone sends me en email with 10 links pointing to a web app (http://myapp.com/:id)
I just want a single instance of that web app to avoid opening a new tab when a link is clicked. My app is really heavy to load and already manages its own tabs re-using existing data.
I've currently implemented this using a Chrome extension that closes the tab if there is an existing one with the same domain, but I want a better cross-browser solution (at least Firefox)
Does anyone know how to achieve this using JS?
I was thinking of Shared workers, but I'm sure there is no way to focus a browser tab using JS...
Thanks!

Creating multiple sessions with each new tab with chrome extension

I'm trying to create a new session with each new opened tab. So if I call "chrome.tabs.create" and hit the same url I would like it to create a new session. For example if I hit one page and they use cookies to store my cart when I call "chrome.tabs.create" for a second time it just retrieves my previous session and both tabs are essentially the same thing. Is there a way to do this?

No, not really, not with an extension.
You can open an incognito tab, but that gives you a second session, you can't open "another" incognito context until you close the first one.
A Chrome App can use webviews with different partitions to this effect, but cannot really interact with normal browsing.
Webview is not yet available for extensions and it's unclear when that will change.
If you need this really badly you can try manipulating cookies with chrome.cookies API.

I tested many exteension in Chrome and even the SessionBox seems promising I encouterned some bugs so that I cannot use it easily: I had to recreate my profile everytime regularly.
Afer that I found a chromium fork called ghostbrowser which have exactly the feature your need to.
This is a very good alternative as long you are ok with the 4 identities limitation of the Free version.

How can I use postMessage to share data between top level windows?

Using Web Messaging (postMessage), it's easy to send messages between windows including iframes and popup windows opened through Javascript. However, is it possible for two windows opened individually by the user to find each other and communicate?
As an example, if the user opens www.example.com/app.html in the browser, then the same page in another tab/windows of the same browser, I want the second window to know that it should act as a "child" of the first one and exchange a stream of events via postMessage. How do I detect the presence of another open window and how to I get a handle to it that I can use with postMessage?

i don't know if it's possible with postMessage.
but, it should be possible with localStorage or sessionStorage (which lives in the session scope).
using this approach you can write a value in one window/tab, and read it in the other window/tab, of course assuming that it's all on the same domain.
see more here: http://php-html.net/tutorials/html5-local-storage-guide/
hope that helps.

How do you keep content from your previous web page after clicking a link?

I'm sorry if this is a newbie question but I don't really know what to search for either. How do you keep content from a previous page when navigating through a web site? For example, the right side Activity/Chat bar on facebook. It doesn't appear to refresh when going to different profiles; it's not an iframe and doesn't appear to be ajax (I could be wrong).
Thanks,

I believe what you're seeing in Facebook is not actual "page loads", but clever use of AJAX or AHAH.
So ... imagine you've got a web page. It contains links. Each of those links has a "hook" -- a chunk of JavaScript that gets executed when the link gets clicked.
If your browser doesn't support JavaScript, the link works as it normally would on an old-fashioned page, and loads another page.
But if JavaScript is turned on, then instead of navigating to an HREF, the code run by the hook causes a request to be placed to a different URL that spits out just the HTML that should be used to replace a DIV that's already showing somewhere on the page.
There's still a real link in the HTML just in case JS doesn't work, so the HTML you're seeing looks as it should. Try disabling JavaScript in your browser and see how Facebook works.
Live updates like this are all over the place in Web 2.0 applications, from Facebook to Google Docs to Workflowy to Basecamp, etc. The "better" tools provide the underlying HTML links where possible so that users without JavaScript can still get full use of the applications. (This is called Progressive Enhancement or Graceful degradation, depending on your perspective.) Of course, nobody would expect Google Docs to work without JavaScript.

In the case of a chat like Facebook, you must save the entire conversation on the server side (for example in a database). Then, when the user changes the page, you can restore the state of the conversation on the server side (with PHP) or by querying your server like you do for the chat (Javascript + AJAX).

This isn't done in Javascript. It needs to be done using your back-end scripting language.
In PHP, for example, you use Sessions. The variables set by server-side scripts can be maintained on the server and tied together (between multiple requests/hits) using a cookie.

One really helpful trick is to run HTTPFox in Firefox so you can actually monitor what's happening as you browse from one page to the next. You can check out the POST/Cookies/Response tabs and watch for which web methods are being called by the AJAX-like behaviors on the page. In doing this you can generally deduce how data is flowing to and from the pages, even though you don't have access to the server side code per se.
As for the answer to your specific question, there are too many approaches to list (cookies, server side persistence such as session or database writes, a simple form POST, VIEWSTATE in .net, etc..)

You can open your last closed web-page by pressing ctrl+shift+T . Now you can save content as you like. Example: if i closed a web-page related by document sharing and now i am on travel web page. Then i press ctrl+shift+T. Now automatic my last web-page will open. This function works on Mozilla, e explorer, opera and more. Hope this answer is helpful to you.

Categories