IOS: open the welcome page in Safari, not CNA (after authentication)

I launch a captive portal, the target audience is only mobile devices. I would like to open the "welcome page" to the user after , which he authenticated with CNA. This page should open in (mobile) Safari, not CNA, because it contains interactive elements that do not work in a restricted CNA environment.

I saw how it worked on other portals before, but I don’t know how they do it, and I can’t understand how, even after extensive research.

I have :

  • A running portal / inactive network is currently running.
  • connected users receive a pop-up page displayed in a pop-up window (CNA).
  • since I don’t need authentication, they are connected at this moment, and the upper right button shows “OK”

What I want :

  • link or button on this pop-up page that opens a Safari window

or

  • some javascript redirection no matter what opens the Safari window when closing CNA.

Nothing has been found yet (for example, using target = "_ system"). Does anyone know how this hotel and other portals that somehow handle this do it?

+5
source share
5 answers

You cannot make an OS (OS X or iOS) to open Safari. When iOSX discovers a fenced garden (involuntary portal), it launches CNA. I.e.

CNA ≠ Safari. Try <a href="..." target="_blank">test</a> Any attempt to open another CNA window failed.

Try <a href="..." target="_system">test</a> Any attempt to open Safari failed (_system works only for Safari, Mail and Safari web views in iOS applications)

Me: answer = IMPOSSIBLE.

But I wonder: does anyone already see this phenomenon. Have you ever seen a safari page automatically launched after the CNA window was presented?

+4
source

The secret sends an HTML request to the iOS client with a BODY element that contains only the word "Success." IOS CNA is expecting something like http://www.apple.com/library/test/success.html to return.

For example: success success

You can redirect the iOS CNA window using javascript:

 <script type="text/javascript"> window.location.href = "yourdomain.com/welcome.html"; </script> 

In addition, you can hide the “Success” message by changing the body text to white with the STYLE attribute in the BODY tag. The CNA iOS app doesn't seem to be looking for a page that exactly matches Apple's success.html. He seems to be looking for a BODY element containing the word "Success".

My use case

The online portal that I use requires the user to agree to the terms of service. The mobile device will detect the captured portal using CNA (Captive Network Assistant) and open a browser window at the OS level using the portal login page.

When the user clicks “Agree and Connect,” the POSTED form that authorizes its MAC address on the connected portal device.

The web server returns my own success.html with white text and javascript redirecting either to the URL requested by the user (for those cases when the user manually views the website using his mobile browser) or on the corporate welcome page.

TL DR:

  • User connects to inaccessible portal

  • Mobile device detects involuntary portal

  • CNA Mobile loads involuntary portal login page

  • The user clicks "Agree and Connect", issuing a POST request to my web server, which performs authentication

  • An HTTP 302 redirect is returned from a POST URL pointing to success.html on my web server that contains a javscript redirection after the BODY element . This launches the CNA iOS iOS web view to discover that it is successfully connected to the network.

  • CNA registration window redirects to my corporate greeting .html

  • The CNA web browser window automatically closes in Android, or the user can click Finish in the CNA iOS browser window to close it.

+2
source

I managed to get my iOS 9.1 device to redirect to mikrotik by doing the following:

change the alogin.html page (on your page) to have the header of the connected and the body of the connected like this:

 <html> <head> <title>Success</title> </head> <body> Success <script> function addElement(absoluteurl) { var anchor = document.createElement('a'); anchor.href = absoluteurl; window.document.body.insertBefore(anchor, window.document.body.firstChild); setTimeout(function(){ anchor.click(); }, 1000); // document.body.appendChild(elemDiv); // appends last of that element } addElement("http://www.google.com"); </script> </body> 

on newer 10.3.1 devices, this does not seem to work anymore, currently checking its options. https://forums.developer.apple.com/thread/75498

+2
source

There was another bug in iOS 11, so the CNA doesn’t close after opening the link in Safari.

Refer to the discussion here: https://forums.developer.apple.com/thread/75498#221482

+2
source

You need to make sure the anchor tag points to an absolute URL, not a relative one. For example, your link should be

 <a href="http://yourdomain.com/home.html">Home</a> 

It doesn’t work if the link

 <a href="/home.html">Home</a> 

Also note that this will only work if the Internet is available / the user is connected when the link is clicked. On iOS CNA, the top right button switches to “Finish” when connected. Thus, essentially, clicking on the absolute link when the CNA Done status closes the CNA and uploads the link to Safari.

+1
source

All Articles