Download Captive Portal Web Template

/ Comments off

ON THIS PAGE
  • A Captive Portal is a special webpage users see before using the Internet. It will intercept network packets and when users try to access a webpage it prompt them to login. My personal captive portal utilises pfSense’s own Captive Portal features to authenticate users before they begin using the Internet.
  • PfSense Captive Portal Template Blue Dew. Blue Dew is a free responsive pfSense Captive Portal template writen in pure html5 and css3 Download Now. Email This BlogThis! Share to Twitter Share to Facebook. Labels: pfSense Captive Portal Template - Blue Dew. Older Post Home.

The captive portal in Aptilo SMP works hand-in-hand with our captive portal management tool. All the complexity and web development code hides in a captive portal template in Aptilo SMP. Only the objects and texts defined as editable are available in the user friendly captive portal management tool.

You can control access to your network througha switch by using several different authentication. Junos OS switchessupport 802.1X, MAC RADIUS, and captive portal as an authenticationmethods to devices requiring to connect to a network. You can setup captive portal authentication on a switch to redirect Web browserrequests to a login page that requires the user to input a usernameand password. For more information, read this topic.

Example: Setting Up Captive Portal Authentication on an EXSeries Switch

You can set up captive portal authentication(hereafter referred to as captive portal) on a switch to redirectWeb browser requests to a login page that requires the user to inputa username and password. Upon successful authentication, the useris allowed to continue with the original page request and subsequentaccess to the network.

This example describes how to set up captive portal on an EXSeries switch:

Requirements

This example uses the following hardware and softwarecomponents:

  • An EX Series switch that supports captive portal

  • Junos OS Release 10.1 or later for EX Series switches

  • Performed basic bridging and VLAN configuration on theswitch. See Example: Setting Up Basic Bridging and a VLAN for an EX Series Switch.

  • Generated an SSL certificate and installed it on the switch.See Generating SSL Certificates to Be Used for Secure Web Access (EX Series Switch).

  • Designed your captive portal login page. See Designing a Captive Portal Authentication Login Page on Switches.

Overview and Topology

This example shows the configuration required on the switchto enable captive portal on an interface. To permit a printer connectedto the captive portal interface to access the LAN without going throughcaptive portal, add its MAC address to the authentication whitelist.The MAC addresses in this list are permitted access on the interfacewithout captive portal.

The topology for this example consists of one EX Seriesswitch connected to a RADIUS authentication server. One interfaceon the switch is configured for captive portal. In this example, theinterface is configured in multiple supplicant mode.

Configuration

To configure captive portal on your switch:

CLI Quick Configuration

To quickly configure captive portal on theswitch after completing the tasks in the Requirements section, copythe following commands and paste them into the switch terminal window:

[edit]
set access profileprofile1 authentication-order radius
set access profileprofile1 radius authentication-server 10.204.96.165
set system services web-management http
set systemservices web-management https local-certificate my-signed-cert
set services captive-portal secure-authentication https
set services captive-portal interface ge-0/0/10.0 supplicant multiple
set services captive-portal authentication-profile-nameprofile1
set ethernet-switching-options authentication-whitelist00:10:12:e0:28:22
set services captive-portal custom-optionspost-authentication-url http://www.my-home-page.com

Step-by-Step Procedure

  1. Define the server IP address, the server authenticationport number, and configure the secret password. The secret passwordon the switch must match the secret password on the server:
    [edit]
    user@switch# set accessradius-server 10.204.96.165 secret 'ABC123'
  2. Configure the authentication order, making set accessprofile profile1 authentication-order radius
  • Configure the server IP address to be tried in order toauthenticate the supplicant:
    [edit]
    user@switch# set systemservices web-management http
  • To create a secure channel for Web access to the switch,configure captive portal for HTTPS:Note

    You can enable HTTP without enabling HTTPS, but we recommendHTTPS for security purposes.

    1. Associate the security certificate with the Web serverand enable HTTPS access on the switch:
      [edit]
      user@switch# set servicescaptive-portal secure-authentication https
  • Enable an interface for captive portal:
    [edit]
    user@switch# set servicescaptive-portal authentication-profile-name profile1
  • (Optional) Allow specific clients to bypass captive portal:Note

    If the client is already attached to the switch, you mustclear its MAC address from the captive portal authentication by usingthe mac-address command after adding its MAC address to the whitelist. Otherwisethe new entry for the MAC address will not be added to the Ethernetswitching table and authentication bypass will not be allowed.

    [edit]
    user@switch# Note

    Optionally, you can use set servicescaptive-portal custom-options post-authentication-url http://www.my-home-page.com

    • Results

    Display the results of the configuration:

    Verification

    To confirm that captive portal is configuredand working properly, perform these tasks:

    Verifying That Captive Portal Is Enabled on the Interface

    Purpose

    Verify that captive portal is configured on interfacege-0/0/10.

    Action

    Use the operational mode command interface-name detail:

    user@switch> show captive-portal firewall ge-0/0/10.0

    Configuring Captive Portal Authentication (CLI Procedure)

    Configure captive portal authentication (hereafter referredto as captive portal) on an EX Series switch so that users connectedto the switch are authenticated before being allowed to access thenetwork. When the user requests a web page, a login page is displayedthat requires the user to input a username and password. Upon successfulauthentication, the user is allowed to continue with the originalpage request and subsequent access to the network.

    • Performed basic bridging and VLAN configuration on theswitch. See Example: Setting Up Basic Bridging and a VLAN for an EX Series Switch.

    • Generated an SSL certificate and installed it on the switch.See Generating SSL Certificates to Be Used for Secure Web Access (EX Series Switch).

    • Configured basic access between the EX Series switch andthe RADIUS server. See Example: Connecting a RADIUS Server for 802.1X to an EX Series Switch.

    • Designed your captive portal login page. See Designing a Captive Portal Authentication Login Page on Switches.

    This topic includes the followingtasks:

    Configuring Secure Access for Captive Portal

    To configure secure access for captive portal:

    1. Enable HTTP access on the switch:
      [edit]
      user@switch# set systemservices web-management https local-certificate my-signed-cert
      Note

      You can enable HTTP without HTTPS, but we recommend HTTPSfor security purposes.

    2. Configure captive portal to use HTTPS:
      [edit]
      user@switch# set servicescaptive-portal interface set servicescaptive-portal interface ge-0/0/10

      Configuring Bypass of Captive Portal Authentication

      To allow specific clients to bypass captive portal:

      [edit]
      user@switch# mac-address

      For example, to allow specific clients to bypass captive portal:

      [edit]
      user@switch# set ethernet-switching-optionsauthentication-whitelist 00:10:12:e0:28:22 interface ge-0/0/10.0 to limit the scope to the interface.

      Note

      If the client is already attached to the switch, you mustclear its MAC address from the captive portal authentication by usingthe mac-address command after adding its MAC address to the whitelist. Otherwisethe new entry for the MAC address will not be added to the Ethernetswitching table and authentication bypass will not be allowed.

      Designing a Captive Portal Authentication Login Page on Switches

      Portal

      You can set up captive portal authentication on yourswitch to redirect all Web browser requests to a login page that requiresusers to input a username and password before they are allowed access.Upon successful authentication, users are allowed access to the networkand redirected to the original page requested.

      Junos OS provides a customizable template for the captive portalwindow that allows you to easily design and modify the look of thecaptive portal login page. You can modify the design elements of thetemplate to change the look of your captive portal login page andto add instructions or information to the page. You can also modifyany of the design elements of a captive portal login page.

      The first screen displayed before the captive login page requiresthe user to read the terms and conditions of use. By clicking theAgree button, the user can access the captive portal login page.

      Template

      Figure 1 showsan example of a captive portal login page:

      Table 1 summarizes the configurable elements of a captive portallogin page.

      Table 1: Configurable Elements of a Captive Portal Login Page

      ElementCLI StatementDescription

      Footer background color

      footer-bgcolor

      The HTML hexadecimal code for the background color ofthe captive portal login page footer.

      Footer message

      footer-message

      Text displayed in the footer of the captive portal loginpage. You can include copyright information, links, and additionalinformation such as help instructions, legal notices, or a privacypolicy

      The default text shown in the footer is Copyright @2010,Juniper Networks Inc.

      Footer text color

      footer- text-color

      Color of the text in the footer. The default color iswhite.

      Form header background color

      form-header-bgcolor

      The HTML hexadecimal code for the background color ofthe header bar across the top of the form area of the captive portallogin page.

      Form header message

      form-header-message

      Text displayed in the header of the captive portal loginpage. The default text is Captive Portal User Authentication .

      Form header text color

      form-header- text- color

      Color of the text in the form header. The default coloris black.

      Form reset button label

      form-reset-label

      Using the Reset button, the user can clear theusername and password fields on the form.

      Form submit button label

      form-submit-label

      Using the Login button, the user can submitthe login information.

      Header background color

      header-bgcolor

      The HTML hexadecimal code for the background color ofthe captive portal login page header.

      Header logo

      header-logo

      Filename of the file containing the image of the logothat you want to appear in the header of the captive portal loginpage. The image file can be in GIF, JPEG, or PNG format.

      You can upload a logo image file to the switch. Copy the logoto the /var/tmp directory on the switch (during commit, the filesare saved to persistent locations).

      If you do not specify a logo image, the Juniper Networks logois displayed.

      Header message

      header-message

      Text displayed in the page header. The default text is User Authentication.

      Header text color

      header-text- color

      Color of the text in the header. The default color iswhite.

      Post-authentication URL

      post-authentication-url

      URL to which the users are directed on successful authentication. By default, users are directed to the page they had originally requested.

      1. (Optional) Upload your logo image file to the switch:
        user@switch> set custom-options header-bgcolor #006600
        set custom-optionsheader-message “Welcome to Our Network”
        set custom-options banner-message “Please enter your usernameand password”.The banner displays the message ”XXXXXXX”by default. The user can modify this message.
        set custom-optionsfooter-message “Copyright ©2010, Our Network”

      Now you can commit the configuration.

      Note

      For the custom options that you do not specify, the defaultvalue is used.

      See also

      Configuring Captive Portal Authentication (CLI Procedure) onan EX Series Switche with ELS Support

      Note

      This task uses Junos OS for switches with support forthe Enhanced Layer 2 Software (ELS) configuration style. If your switchruns software that does not support ELS, see Configuring Captive Portal Authentication (CLI Procedure). For ELS details, see Using the Enhanced Layer 2 Software CLI.

      Configure captive portal authentication (hereafter referredto as captive portal) on a switch so that users connected to the switchare authenticated before being allowed to access the network. Whenthe user requests a webpage, a login page is displayed that requiresthe user to input a username and password. Upon successful authentication,the user is allowed to continue with the original page request andsubsequent access to the network.

      • Performed basic bridging and VLAN configuration on theswitch. See Example: Setting Up Basic Bridging and a VLAN for an EX Series Switch with ELS Support .

      • Generated an SSL certificate and installed it on the switch.See Generating SSL Certificates to Be Used for Secure Web Access (EX Series Switch).

      • Configured basic access between the switch and the RADIUSserver. See Example: Connecting a RADIUS Server for 802.1X to an EX Series Switch.

      • Designed your captive portal login page. See Designing a Captive Portal Authentication Login Page on Switches.

      This topic includes the followingtasks:

      Configuring Secure Access for Captive Portal

      To configure secure access for captive portal:

      1. Associate the security certificate with the Web serverand enable HTTPS on the switch:
        [edit]
        user@switch# certificate-name
        Note

        You can enable HTTP instead of HTTPS, but we recommendHTTPS for security purposes.

      2. Configure captive portal to use HTTPS:
        [edit]
        user@switch# set servicescaptive-portal interface set switch-optionsauthentication-whitelist set switch-options authentication-whitelist interface-name to limit the scope to the interface.

        Note

        If the client is already attached to the switch, you mustclear its MAC address from the captive portal authentication by usingthe session-mac-addr command after adding its MAC address to the whitelist. Otherwise,the new entry for the MAC address is not added to the Ethernet switchingtable and the authentication bypass is not allowed.

        Example: Setting Up Captive Portal Authentication on an EXSeries Switch with ELS Support

        Note

        This example uses Junos OS for EX Series switches withsupport for the Enhanced Layer 2 Software (ELS) configuration style.If your switch runs software that does not support ELS, see Example: Setting Up Captive Portal Authentication on an EX Series Switch. For ELS details, see Using the Enhanced Layer 2 Software CLI.

        You can set up captive portal authentication (hereafter referredto as captive portal) on a switch to redirect Web browser requeststo a login page that requires the user to input a username and password.Upon successful authentication, the user is allowed to continue withthe original page request and subsequent access to the network.

        This example describes how to set up captive portal on an EXSeries switch:

        Requirements

        This example uses the following software and hardwarecomponents:

        • Junos OS Release 13.2X50 or later for EX Series switches

        • An EX Series switch with support for ELS

        • Performed basic bridging and VLAN configuration on theswitch. See Example: Setting Up Basic Bridging and a VLAN for an EX Series Switch with ELS Support .

        • Generated an SSL certificate and installed it on the switch.See Generating SSL Certificates to Be Used for Secure Web Access (EX Series Switch).

        • Configured basic access between the EX Series switch andthe RADIUS server. See Example: Connecting a RADIUS Server for 802.1X to an EX Series Switch.

        • Designed your captive portal login page. See Designing a Captive Portal Authentication Login Page on Switches.

        Overview and Topology

        This example shows the configuration required on the switchto enable captive portal on an interface. To permit a printer connectedto the captive portal interface to access the LAN, add its MAC addressto the authentication whitelist and assign it to a VLAN, vlan1. TheMAC addresses on this list are permitted access on the interface withoutcaptive portal authentication.

        The topology for this example consists of one EX Seriesswitch connected to a RADIUS authentication server. One interfaceon the switch is configured for captive portal. In this example, theinterface is configured in multiple supplicant mode.

        Configuration

        To configure captive portal on your switch:

        CLI Quick Configuration

        To quickly configure captive portal on theswitch after completing the tasks in the Requirements section, copythe following commands and paste them into the switch terminal window:

        [edit]
      3. To create a secure channel for Web access to the switch,configure captive portal for HTTPS:
        1. Associate the security certificate with the Web serverand enable HTTPS on the switch:
          [edit]
          user@switch# Note

          You can enable HTTP instead of HTTPS, but we recommendthat you enable HTTPS for security purposes.

        2. Configure captive portal to use HTTPS:
          [edit]
          user@switch# set servicescaptive-portal interface ge-0/0/10 supplicant multiple
        3. (Optional) Allow specific clients to bypass captive portalauthentication:Note

          If the client is already attached to the switch, you mustclear its MAC address from the captive portal authentication by usingthe mac-address command after adding its MAC address to the whitelist. Otherwise,the new entry for the MAC address will not be added to the Ethernetswitching table and the authentication bypass will not be allowed.

          [edit]
          user@switch# Note

          Optionally, you can use set custom-options post-authentication-url http://www.my-home-page.com

        Results

        Display the results of the configuration:

        Verification

        To confirm that captive portal authenticationis configured and working properly, perform these tasks:

        Verifying That Captive Portal Is Enabled on the Interface

        Purpose

        Verify that captive portal is configured on the interfacege-0/0/10.

        Action

        Use the operational mode command interface-name detail:

        user@switch> ge-0/0/10, with thedefault settings for number of retries, quiet period, CP session timeout,and server timeout.

        Verify That Captive Portal Is Working Correctly

        Purpose

        Verify that captive portal is working on the switch.

        Action

        Download Captive Portal Web Templates

        Connect a client to the interface ge-0/0/10. From theclient, open a Web browser and request a webpage. The captive portallogin page that you designed should be displayed. After you enteryour login information and are authenticated against the RADIUS server,the Web browser should display either the page you requested or thepost-authentication URL that you configured.

        Troubleshooting

        Captive Portal Software

        To troubleshoot captive portal, perform thistask:

        Troubleshooting Captive Portal

        Problem

        Captive Portal Page

        The switch does not return the captive portal loginpage when a user connected to a captive portal interface on the switchrequests a webpage.

        Solution

        You can examine the ARP, DHCP, HTTPS, and DNS counters—ifone or more of these counters are not incrementing, this providesan indication of where the problem lies. For example, if the clientcannot get an IP address, you might check the switch interface todetermine whether the DHCP counter is incrementing—if the counterincrements, the DHCP packet was received by the switch.

        user@switch>

      4. Would be very useful if it were still working on version 2.2.1. EDIT: And it probably does, but obviously my eyes aren't... Installed the older version! :)

      5. not working on PFsense ver 2.0 working on PFsense ver 2.14 thank you for sharing

        6. Captive Portal Software Windows

        Read more reviews >