When I login to a site, which is a "learning system" at my university, I have found that I cannot open a new tab with the same site open. When I do so, somehow the site is aware and displays the following message?
How on earth does the site know what tabs I have open on my computer? As far as I know, the front-end code shouldn't have any access to my private browser information. What accessible information could this site be using to determine that I have another tab open already?
I am accessing the site using a private computer, and the site being accessed isn't on a local network, it is being accessed through the internet. Therefore there is no internal monitoring software that could be causing this. I am using Google Chrome 24 Beta for Mac.
One way to do this is via cookies and ids. Firstly, you are logged in to the site and have a session on there. This is managed using cookies; whenever you visit a page on the site, your browser will send a cookie which normally contains some kind of id. That way the server can identify any request coming from you, is really from you. So, in this case, both your original tab and your new tab will send the same cookie.
Secondly, it can also add another, different id (call it the page id), to any link or form you submit on the site. So a form on a page might contain the id 1234, and any links will also contain that id. Each new page you visit might contain a new id. So at any point, the site knows that next request from your browser (identified by the cookies) should also contain this other id. If you navigate around the site in a normal way, clicking on links, submitting forms, this will be true and all will be good.
Cases when your next request would NOT submit the expected, second id are:
you hit the back button (you would be sending an old page id)
you open a new tab (this depends on the browser, but if it opens the
same page you are already on in the original tab, it would be sending the current page
id, not the next page id, which the server expects)
Either way, you send a request with a page id the server doesn't expect and it can make a best guess as to what you did.
They track your mouse cursor movement while visiting their website. It's a great way to get the attention of a visitor. They put some query programmatically when you move your mouse and when you wish to close.
It's good UX.
Another way the site may know that you have another tab open is through broadcasting channels. To put it simply, broadcasting channels are a means for windows, tabs, etc; to communicate (correct me if I am wrong). Here is a simple implementation:
//Channel to post and receive messages from
const bc = new BroadcastChannel("Check-tabs");
//On message receive
bc.onmessage = (event) => {
if (event.data === `First tab?`) {
//Post that there is already a tab open
bc.postMessage(`Tab already open`);
}
//Check if a tab is open
if (event.data === `Tab already open`) {
alert(`Another tab is already open.`);
}
//Posts message to check whether another tab is open
bc.postMessage(`First tab?`);
Related
(I am developing a Node.js/Express web application.)
Is there a way to identify a tab and have its identifier saved locally in the browser so that the identifier is persistent across different pages of the same web site?
Example, my web application is opened by the user in two tabs of the same browser. I would like to know that they are opened in different tabs. Even if the user in tab A presses F5 to refresh the page, I (in the client Javascript) would like to know that the page is still in tab A.
Is there a property of window or another object in the DOM that identifies the browser tab?
Nothing simple. However, there are two interesting technologies that may help you solve your problem.
sessionStorage is the closest to what you described. It gives each tab a different Storage object that you can store random IDs in. It doesn't quite work though, because when you open a link in a new tab the second tab gets a copy of the parent page's sessionStorage object, including whatever you stored in the parent page's sessionStorage.
The storage event is probably what you want to use. You can have your tabs communicate directly with each other to coordinate unique IDs or detect multiple tabs being open. See this question which is focused on how to communicate across tabs in javascript.
Some combination of these two technologies will probably help you solve whatever you are trying to accomplish.
Is there any way to completely duplicate the state of a current tab in Google Chrome? I want an exact copy of the current state of the page without having to reload the page in another tab.
An example use case:
While browsing a "slideshow" on a news website, I want to preserve the current slide that I'm on, but create a duplicate so that I can continue viewing the next slide. If I simply Right-Click and "Duplicate" the tab, the new page will completely Reload, reprocessing all of the Javascript and running the pre-slideshow advertisement again.
In short "NO" you can't.
I am not expert on this
but a similar behavior can be achieved in some ways i know :
Dump the whole DOM
Never tried this though. You can convert the DOM to a string, pass it to the new window and then parse it as a document. This will let you lose your DOM events and State manipulation javascript. (But that's good for your case)
var dtab = window.open('about:blank', 'duplicate_a_tab');
dtab.document.open();
dtab.document.write("... yout html string ..");
dtab.document.close();
Develop an extension
Let the users continue on the current tab with the current state, your extension should be able to capture the screenshot of that area and open that screenshot in new tab. There are plenty of screenshot taking extensions are available in the market.
If that website is your own
You can develop your services that uses state locally like progressive web apps. Give a link separately to 'duplicate' which will eventually open the same URL in different tab with the same local state and with the flag do-not-sync.
This will not work when the user uses browser inbuilt duplicate
feature.
I have a registration system on my website which uses the common activation email trick.
This email simply contains instructions and a link to the activation page on my website.
So suppose I registered on the site, opened a new tab to check my emails and then clicked on the link, which will open in another new tab, resulting in two tabs open on the site (of which one is btw still telling them to o check their mail).
Is there a way to get the link in the email to open in the first tab on my website? (Or open a new tab if the previous one was closed or moved to another domain).
Thanks for any help/suggestions!
You can name your current window/tab with a JavaScript assignment:
<script type="text/javascript">
this.name = "mainWindow";
</script>
Then you use that name as value for the target attribute in links, like
<a href="nextPage.html" target="mainWindow">...
If mainWindow does not yet (or no more) exist, it will open in a new tab.
Update
The above stuff does not solve the OP's problem, because for links opened from emails, the target attribute will usually not be transferred from MUA to browser (except maybe for webmailers, but we cannot rely on this). So I was thinking of some kind of landing page which uses JavaScript to achieve the desired effect:
If target window/tab `mainWindow` has already been opened, focus it, perform activation there, and close ourselves.
If target window/tab does not exist, perform activation right where we are.
If this worked, you would only see a second open tab for a moment (case 1), before it closes itself. Yet it is not possible to "close ourselves", as I learned here and here - so in the end there would be a superfluous tab left, which should have been avoided. Seems like it cannot be done, sorry!
So I am running into an issue. I have certain fields that I store within the request from page to page, because each page requires different fields to be populated within a collector that I used cross-page. The problem is the back button.
If I click the link to take my to my login page, the server populates the collector from the request with the appropriate pagename and event name, etc., to allow me to navigate to the login page. (Certain things have to load, so it has to go through a servlet). However, on that page, there are static modules for ads and whatnot, so clicking on one of the ads will take you to a separate, static page that does not require these attributes to access. In Chrome, Safari and FF, if I click the back button after accessing this static page, the browser asks me to reload the request to be able to view the page. In IE8, however, there is no page reload. It just kicks me back to the page, and does not populate the request, and it crashes with my sorry page.
I need to know if there is a way to populate the request on the back button click, and how to do so. Otherwise, my servlet is throwing a null pointer when trying to access the fields because they are all null in the request. Any help would be greatly appreciated. I am not even sure if this is at all possible.
I guess you are using POST requests to navigate to each page. POST should be used only to send some user action different from page view - login, buying something, changing settings, etc. The browsers require the user to confirm that they want to revisit a page using POST, before that implies state change. See What is the difference between POST and GET?
For simple content pages, where the user does not take action, it's better to use GET requests. Also, it is much more common to use request.getSession() to get and store the user fields on the server side. That is, you only send them once, and then look them up for each request. Look up for tutorials on session tracking in java.
We have some code where the user clicks a link which launches a pop up window. The code that creates the window then does an HTTP post to the window. Once the post has succeeded, the page is redirected (as a javascript location) to a PDF that was created during the post.
One person is getting an error where the posted data is not getting posted. In fact, the request is coming across as a GET.
Originally I thought this may be some kind of bookmark to the original page issue. But it happens in two different places that use the same concept in a different manner. And, since the post is triggered through JavaScript and the result is immediately relocated it would be no trivial matter to actually get a link to the original page.
So, the question is, are there any "pop-up" blocker like security tools that would allow pop-up's but convert all POSTS on them to GETS?
Example Call:
function LoadPDF(File){
document.forms[0].PDF.value = File;
win = "Window" + Math.round(Math.random()*100000);
open("",win,'toolbar=no');
function SubmitForm(){
document.forms[0].action = 'CreatePDF.cfm';
document.forms[0].target = win;
document.forms[0].submit();
}
//Give window time to open.
setTimeout(SubmitForm,550);
}
The code that creates the window then does an HTTP post to the window.
Popup blockers block popups as they are opening, which is pretty much the point of their existence. It would have to be a pretty lame popup blocker that allowed the popup to open and then translated the POST to a GET. It's possible a GreaseMonkey script or extension could translate it maybe.
Tell the user to disable any plugins/extensions and try again.