Web security

Scenario:

User opens two tabs of content needing authentication
Both are redirected to the login screen
User logs on in one of them and is granted access
User reloads the second page

Should it redirect to the requested location, or should it prompt for login again?

The right answer is JavaScript. When the user successfully logs into the first tab, other tabs can be notified immediately using the postMessage API [1].

Upon receiving the notification, the second tab then loads the requested location, without the user having to do anything.

// first tab
window.postMessage('login', 'https://mywebsite.com');

// second tab
window.addEventListener('message', (event) => {
if (event.origin === 'https://mywebsite.com' && event.data === 'login') {
// Load the location the user originally wanted. This time, we should be authorized.
const return_to_path = new URL(window.location.href).searchParams.get('return_to')
window.location.pathname = return_to_path;
}
});



Works Cited.

[1] https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
[2] http://i.imgur.com/xBjhq9g.jpg