All pages
Powered by GitBook
1 of 4

Loading...

Loading...

Loading...

Loading...

Integrate with External Splash Page

Using an external splash page allows you full control over the sequencing and presentation of a splash page. Alternatively, internal splash page are simpler, but provide less flexibility. External splash pages are stored and executed on a web server that user define, and must respond appropriately to certain messages from the Access Point in order to present appropriate user-interface to the user at various stages of the authentication process.

When combined with RADIUS Authentication, EnGeniusCloud will consult an external RADIUS server that you specify in order to determine whether to authenticate the user. The user interface presented to the user will be determined by the external splash page.

Most EnGenius customers who need a captive portal authentication system on their wireless networks use the customizable splash pages that are hosted by EnGeniusCloud. However, some network administrators may prefer to host a captive portal page on their own servers. This Section shows you how to configure EnGeniusCloud to adopt external splash page with an external RADIUS server to handle authentication.

Click-through

When captive portal is enabled and authentication type is set to "Click-through", the user is redirected to a splash page and clicks on a link to be granted access to the Internet.

Overview

Communication Flow

Following figure shows the communication flows and steps for a Click-through captive portal with external splash page server.

  1. A new wireless client tries to connect to a Captive Portal enabled SSID served by an Access Point.

  2. The AP intercepts the request and redirect the user to the external splash page which is served by a external web server configured in SSID's splash page setting. In addition, an actionurl parameter is passed to the splash page such that browser can be redirected back to the cloud after submission in splash page.

  3. Splash page content with

Parameters

In previous Section Step 2, the actionurl parameter is composed of a cloud URL with extra parameters. A https request sample to the splash page could be like this:

The here is the splash page setting customized for corresponding SSID. The details of the actionurl parameters are listed as follows:

Enabling an External Splash Page on EnGeniusCloud

  1. Select a network in .

  2. Select SSID in the configuring tool menu.

  3. Choose the SSID you want to configure.

  4. switch to Captive Portal

Configure the External Splash Page Server

The external splash page must be hosted on a web server that will be accessible from the Access Points on your network. The following must be accomplished, but the particular details will depend very much on your web hosting environment.

  1. Setup the Web Server.

  2. Modify the splash page to set form action as the value of actionurl passed by cloud. In this way, after the user submit the form, he will be redirected to specific URL and complete the authentication.

  3. Another way to implement the splash page is to have a hyperlink redirect the browser to actionurl. For Example:

actionurl
parameter are delivered to browser.
  • User clicks on the confirmation link or submit button in the splash page and then be redirected to actionurl to complete the authentication.

  • MAC address of the wireless client

    userurl

    The URL that user tried to visit before authenticated

    mac

    Client's MAC address (will be obsolete after 2021)

    please use client_mac

    called

    AP's MAC address (will be obsolete after 2021)

    please use ap_mac

    nas_id

    Network access server identifier is used to notify the source of a RADIUS access request.

    Tab and make sure your Captive Portal is enabled and Authentication Type is set to "
    Click-through
    ".
  • switch to Splash Page Tab. Select "External Splash Page URL".

  • Enter the URL of your custom splash page (eg, https://yourwebsite.com/splash.html).

  • Click on "Apply" button.

  • <a href="<?php print $_GET['actionurl'] ?>">For all in one url</a>

    Parameter Name

    Description

    vendor

    Should be "EnGenius"

    ap_ip

    IP address of associated AP

    ap_mac

    MAC address of associated AP

    ap_port

    AP service port

    client_ip

    IP address of the wireless client

    https://yourwebsite.com/splash.html
    Org-tree

    client_mac

    https://yourwebsite.com/splash.html?actionurl=https://falcon.service.engenius.ai/captive-portal/auth%3Fuserurl=https://www.google.com/%26loginurl=http://192.168.200.1:4990/www/login.chi%26mac=0C:D2:92:42:0C:57%26called=8A:DC:96:21:FF:E5

    Error Message

    When a failed login occurs from Captive Portal, the user will be redirected to the splash page again with 2 additional query parameters res and reason to indicate the error. The https request to the splash page could be like this:

    https://yourwebsite.com/splash.html?actionurl=......&res=failed&reason=xxxx

    These 2 parameters can be used for displaying error message on splash page. The usage is depicted in the following table:

    Parameters
    Description

    res=failed&reason=reject

    Invalid username or password.

    res=failed&reason=timeout

    No response from authentication server.

    Reference Code

    The following JavaScript code illustrates how to display error message in splash page.

    res=failed&reason=mtu

    Abnormal network error.

    res=failed&reason=other

    Other errors.

       <script>
          function check_error(){
            const params = new Proxy(new URLSearchParams(window.location.search), {
              get: (searchParams, prop) => searchParams.get(prop),
            });
            if (params.res === "failed") {
              switch(params.reason) {
                case "reject":
                  alert("Invalid Username or Password.");
                  break;
                case "timeout":
                  alert("No response from authentication server.");
                  break;
                case "mtu":
                  alert("Abnormal network error.");
                  break;
                case "other":
                  alert("Other errors.");
                  break;
                default:
                  alert("Other errors. (no reason)");
              }
            }
          }
        </script>    
      </head>
    
      <body onload="check_error()" style="">

    Sign-on Splash

    External splash pages are stored and executed on a web server that you define, and must respond appropriately to certain messages from the Access Point in order to present appropriate user-interface to the user at various stages of the authentication process.

    When combining with RADIUS Authentication, EnGeniusCloud can consult an external RADIUS server that you specify in order to determine whether to authenticate the user. The user interface presented to the user will be determined by the external splash page.

    EnGeniusCloud supports three types of RADIUS-based authentication: EnGenius Authentication, Custom Radius, and Voucher Service. All the three types can works with external splash page to perform a sign-on splash service.

    Overview

    Communication Flow

    1. A new wireless client tries to connect to a Captive Portal enabled SSID served by an Access Point.

    2. The AP intercepts the request and redirect the user to the external splash page which is served by a external web server configured in SSID's splash page setting. In addition, an actionurl parameter is passed to the splash page such that browser can be redirected back to the cloud after submission in splash page.

    3. Splash page content with

    Parameters

    In previous Section Step 2, the actionurl parameter is composed of a cloud URL with extra parameters. A https request sample to the splash page could be like this:

    The here is the splash page setting customized for corresponding SSID. The details of the actionurl parameters are listed as follows:

    Parameter Name
    Description

    Configure Authentication Type of Captive Portal

    1. Select a network in .

    2. Select SSID in the configuring tool menu.

    3. Choose the SSID you want to configure.

    4. Under

    Enabling an External Splash Page on EnGeniusCloud

    1. Select a network in .

    2. Select SSID in the configuring tool menu.

    3. Choose the SSID you want to configure.

    4. switch to

    Configure the External Splash Page Server

    The external splash page must be hosted on a web server that will be accessible from the Access Points on your network. The following must be accomplished, but the particular details will depend very much on your web hosting environment.

    1. Setup the Web Server.

    2. Modify the splash page to set form action as the value of actionurl passed by cloud. In this way, after user submits the form, he will be redirected to specific URL and complete the authentication. In order to collect logon credentials, you will need to create an HTML based form that collects and then submits these to the login URL. In its simplest form this could look similar to the code below:

    Note that the input field name "username" and "password" are unchangeable. These two input fields are necessary to provide the credential for RADIUS authentication.

    actionurl
    parameter are delivered to browser.
  • User clicks on the login button in the splash page and then be redirected to actionurl. The actionurl actually makes Access Point play as a RADIUS proxy to help on authenticating user with Remote RADIUS Server.

  • client_mac

    MAC address of the wireless client

    userurl

    The URL that user tried to visit before authenticated

    mac

    Client's MAC address (will be obsolete after 2021)

    please use client_mac

    called

    AP's MAC address (will be obsolete after 2021)

    please use ap_mac

    nas_id

    Network access server identifier is used to notify the source of a RADIUS access request.

    ssidProfileId

    Global unique identity of assoicated SSID

    networkId

    Global unique identity of the network which the assoicated AP belongs to

    Association
    Tab, choose "
    Open
    ", "
    WPA2 PSK
    ".
  • Switch to Captive PortalTab and choose one of three authentication types: EnGenius Authentication, Custom Radius, and Voucher Service to enable the RADIUS-based authentication.

  • Enable walled garden (located under Captive Portal > Advanced Settings > Walled garden) and enter the public IP address of your web server. The address specified needs to be the public-facing IP address of the web server hosting the Splash page, not the local LAN IP.

  • Click on Apply button.

  • Captive Portal
    Tab and make sure your Captive Portal is enabled and Authentication Type is set to
    Click-through
    .
  • switch to Splash Page Tab. Select External Splash Page URL.

  • Enter the URL of your custom splash page (eg, https://yourwebsite.com/splash.html).

  • Click on "Apply" button.

  • vendor

    Should be "EnGenius"

    ap_ip

    IP address of associated AP

    ap_mac

    MAC address of associated AP

    ap_port

    AP service port

    client_ip

    IP address of the wireless client

    https://yourwebsite.com/splash.html
    Org-tree
    Org-tree
    https://yourwebsite.com/login.html?actionurl=http%3A%2F%2F172.23.1.1%3A4990%2Fwww%2Flogin.chi%3Fclient_ip%3D192.168.1.111%26vendor%3DEnGenius%26ssidProfileId%3D62a9561efc9ea68257e08e4d%26userurl%3Dhttp%253A%252F%252Fwww.msftconnecttest.com%252Fredirect%26ap_mac%3D88-DC-96-9C-E9-3C%26mac%3D68-EC-C5-3F-5C-F0%26client_mac%3D68-EC-C5-3F-5C-F0%26networkId%3D5f647ea0786661d04888ea59%26ap_ip%3D172.23.1.1%26ap_port%3D3990%26called%3D88-DC-96-9C-E9-3C&res=notyet&reason=None
    <form method="POST" action="$actionurl">
       Username:<br><input type="text" name="username" value=""><br>
       Password:<br><input type="password" name="password" value=""><br>
       <input type="submit" value="Submit">
    </form>