How to detect if user open two tabs for same session?

Question

I've done a booking application done using CakePHP which involves a few steps before the checkout page. In between these steps I store the information in the session.

How it works is that Step 1 requires them to fill in their information. When going to Step 2, the information in Step 1 will be saved into the session object. As they proceed in the other steps, the process repeats. At the end when they checkout, all the data is then saved to the database.

Everything works great if the user opens one instance of the application in the browser. But once they have another page or another tab opened for the same application in the same browser, problem happens.

Let's say they have two instance of the application open in Tab A and Tab B. In Tab A they entered the details in Step 1 and proceed to Step 2. Then the user does the same thing in Tab B.

At the last step when the user does a checkout, information in Tab A is the same as in Tab B.

Right now, I can only think the best way is to prevent the user from opening the same application in two browser instance.

Is there a way to detect and prompt the user to complete the booking form in Tab A first when they try to open another instance in Tab B?

Solution 1

1.The same problem (and solution) : https://sites.google.com/site/sarittechworld/track-client-windows

2.You can send information by POST or GET

Solution 2

Sure, you can achieve this with a client-side poller script. In JavaScript, you can generate a window ID that can be anything as long as its guaranteed to be unique. Have the JS make Ajax callers to an endpoint on the server that does nothing but compare IDs and session. At any point if you have two different "windowID" values, you know they have to have to windows open for the same session.

You could store this on the server side as an array in the session or you could even store it entirely on the client side in a cookie. If you chose to do that, your client side poller would just look at the cookie value and if it contains two different values, something is amiss. Cookies are a little less ideal though because they add weight to the request/response cycle and you'd have to setup an mechanism to clear the value of the current page when the user unloads the page.

For the server-side implementation, you would just need to send the current windowID along with link or post so that the server can clear the windowID from the session. None of this would protect against the user having a Firefox session and a Chrome session open at once though.

Solution 3

You could mark a session as started when step 1 is first started. Make sure server-side that they follow the right steps (i.e. they don't return to step 1 after step 1 has been completed unless they specifically click a link to do so.) Basically, track their current step on the server and update it as needed. In the event the user does something unexpected, you could give them the option to start over.

I'm wondering if hidden fields with timestamps on your forms might help. Kinda the same idea though.

Caveat: this process might break the essence of your browser's back button. I hate myself for letting that happen in one of my projects.

For cross-browser support, you'd need to have it associated with a user account or something that persists.