Menu

DynamicLoginPage

Anonymous

Dynamic Login Page

Requirements

  • Wouldn't it be nice if you had many access points and all of them use the same single login page.
  • Wouldn't it be nice if this single login page could automatically determine a primary realm assigned to this Access Point and display data related to this realm on the login page.
  • Then as a final bonus, wouldn't it be nice if the back-end can automatically determine the device type that tries to access the network and adopt the login page automatically to accommodate the growing amount of mobile devices.

YFi Enhancements


  • Since SVN version xyz of YFi Hotspot Manager the administrator of a realm has the opportunity to add photos which are attached to a realm.
  • These photo's will be uploaded without being scaled and then dynamically scaled depending on the size specified when it is served by the web server.
  • This will allow for consistent quality of graphics which are generated based on the screen size (view port size) of the device that will display them.
  • To attach photo's to a realm, log into YFi Hotspot Manager and select a realm (Realms & Providers -> Realm management); then click on the red pencil at the top right to open the edit tab for the selected realm.
  • Select the Gallery tab to view manage the photo's.
  • To add new photo's Click on the New button.

  • This will bring up the dialog to add a new photo. You should supply it with a graphical file (.jpg or .png) with an accompanying Title and Description. When you are done, click Save to upload it to the server.

  • The new addition will be added at the bottom of the list of photos. Note that these photos are auto scaled in the YFi Hotspot Manager's pages.

  • Beware when you click on the dustbin icon it will simply delete the image without asking confirmation for you action!

Associating a NAS to a Realm

  • In addition to allowing the users of specified realms (one NAS, many realms) to authenticate at a specified NAS, you can now also select a realm's detail to be displayed on the login page for that NAS.
  • This is for now limited to CoovaChilli NAS devices. The principle of the dynamic login page works with the value specified for HS_NASID in the /etc/chilli/config file. (or /usr/local/etc/chilli/config).
  • The default value is:

    HS_NASID=nas01
    
  • We will change it to Residence_Inn in this exercise.

    HS_NASID=Residence_Inn
    
  • This will result in the value passed on to the login page inside the query string before authentication.

    nasid=Residence_Inn
    
  • Next we should associate this with the name of a NAS defiend in YFi Hotspot Manager.

  • To select a default realm's detail to display in the login page, log into YFi Hotspot Manager and select an NAS (Realms & Providers -> NAS Devices); then click on the red pencil at the top right to open the edit tab for the selected NAS.
  • Make sure the Name under the Compulsory Info tab corresponds to the value specified in the Coova Chilli configuration.

  • To associate a default realm to this NAS; select the Optional Info tab and select the default realm for this NAS


Browser detection

  • The CakePHP application used by YFi Hotspot Manager includes a controller that does browser detection and will redirect to different login pages based on the user agent of the browser.
  • These are divided into two (for now). One for mobile devices (Tablets and smart phones) and the other for the rest of devices (Laptops/ PCs).
  • To get the browser detection working, you have to instruct Coova Chilli to redirect to the browser detector which in turn will redirect to the different login pages (based on the user agent of the browser).
  • Here we specify for a Coova Chilli controller on a local machine:

    HS_UAMFORMAT=http://\$HS_UAMLISTEN/c2/yfi_cake/login_pages/browser_detect
    
  • You also have to specify the location of the two login pages which you want to use in the configuration of the CakePHP application.

  • Edit the /var/www/c2/yfi_cake/config/yfi.php file and make sure the following items exist and reflect your settings:

    //The location of the mobile and normal login pages
    $config['dynamic_login']['mobile']                 = '/yfi/mobile.php';
    $config['dynamic_login']['standard']               = '/yfi/standard.php';
    

User Registration

  • The new dynamic login-pages allows for user registration by utilizing the 3rd_party controller.
  • In order to create a permanent user we need to pre-configure a few things.
  • The following Wiki page has more on the controller action used to create permanent usuers: https://sourceforge.net/apps/trac/hotcakes/wiki/YfiDevelopThirdParty#CreatingPermanentusers
  • We need to configure some values in the includes.php file:

    $settings['3rd_url_create_perm']    = 'http://127.0.0.1/c2/yfi_cake/third_parties/json_create_permanent/';  //URL of 3rd party web service
    $settings['3rd_key']                = '123456789';          //Key for security on 3rd party web service 
    $settings['3rd_realm_name']         = 'Residence+Inn';      //The default realm name used by 3rd party
    $settings['3rd_profile']            = 'Permanent+250M+CAP'; //The profiles the permanent user will be created with
    $settings['3rd_cap']                = 'hard';               //The cap the permanent user will be created with (hard/soft/pre-paid)
    
  • In order for the registration page to work as intended, make sure these variables reflect your configuration.

  • You will note that we use 127.0.0.1 which is the localhost. This should be like this because the page is called by PHP from the local machine using the file_get_contents function.


Login Page

  • The mobile login page will show when you are not connected and you clicked on the Connect link on the mobile landing page of Coova Chilli.

  • If you are already logged in; you will be directed to a page that shows your usage stats.

  • This page also have per session detail.

  • At the top of the page are two links. One is to disconnect from the Internet; the other is a link to the URL your devices wanted to contact initially.
  • The page also refreshes every X seconds. This value is configurable.