Member Avatar for rommel.t.brillantes

Hi guys,

I have a simple authentication portal that when a user's code renders valid, it redirects to a link and it loads my website. However, I need to auto open two websites. The second website that need to open upon authentication could open in another tab or it could launch another browser to open.

I a newby in html and I need a little help...

Thanks alot!

Rom

  • 3 Contributors
  • 2 Replies
  • 199 Views
  • 5 Hours Discussion Span
  • Latest Post Latest Post by advaanz

Dani AI

Generated

Short answer for : browsers will usually block windows/tabs that are opened by script after a server redirect. pointed to the correct API (window.open), but to make a second tab open reliably the open must be started by a direct user gesture (click). The most reliable pattern is: open a named placeholder window during the login click, submit the form, then on successful authentication reuse that named window to navigate to the second site. If the placeholder was never opened (blocked), provide a visible fallback link.

Example pattern (client + server cooperate):

<!-- login page: open a placeholder on the button click, then submit -->
<form id="loginForm" action="/login" method="post">
  <!-- normal inputs -->
  <button type="submit" onclick="openPlaceholder()">Log in</button>
</form>

<script>
var popupName = 'secondSiteWindow';
function openPlaceholder(){
  // MUST run in direct response to user click to avoid popup blockers
  window._secondRef = window.open('about:blank', popupName);
  try { window._secondRef.document.body.innerText = 'Please wait...'; } catch(e){}
  // allow the form to submit normally
}
</script>

On the server, after successful authentication return a page that runs:

<script>
(function(){
  // reuse the named window opened earlier; if it exists this will navigate it
  var w = window.open('', 'secondSiteWindow');
  if (w) w.location = 'https://second.example/';
  else {
    // fallback UI if popup was blocked
    var a = document.createElement('a');
    a.href = 'https://second.example/'; a.target = '_blank';
    a.textContent = 'Open second site (click here)';
    document.body.appendChild(a);
  }
  // continue to authenticated area
  window.location = '/dashboard';
})();
</script>

Notes and cautions:

  • Multiple popups in one click may still be blocked depending on browser/settings; always provide a fallback link or checkbox so users opt in.
  • A web page cannot force-launch a different browser application; doing that requires a native helper, browser extension, or a custom protocol and explicit user consent.
  • Cross-origin pages can be navigated by setting the window.location, but their DOM cannot be inspected due to same-origin rules.
  • Prefer explicit UX (a single "Open both" button or a checkbox) to avoid surprising users and to reduce popup blocking.

This approach keeps behavior predictable across modern browsers while respecting user control and security.

Recommended Answers

All 2 Replies

Member Avatar for IIM

Take a look at this about the trick to open url in different ways using window.open() method of javascript.

these are four options to open url
_blank :The url is loaded into a new, unnamed window.
_parent :The url is loaded into the current frame's parent. If the frame has no parent, this value acts as the value _self.
_self :The current document is replaced with the specified url.
_top :The loaded url replaces any framesets that might be loaded. If there are no framesets defined, this value acts as the value _self.

<html>
<script type="text/javascript">
function open_in_new_tab(url )
{
  var win=window.open(url, '_blank');//open new url
  win.focus();//focus the newly opened url
}
</script>
<input type="button" onclick="open_in_new_tab('http://www.google.com')">
</html>
Member Avatar for advaanz

Thanks IIM for your great information..this is very easy step that i got quick understand.i like your explanation

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.