Technical Documentation

Designing a Captive Portal Authentication Login Page on an EX Series Switch

You can set up captive portal authentication on your switch to redirect all Web browser requests to a login page that requires the user to input a username and password before they are allowed access. Upon successful authentication, the user is allowed access to the network and to continue to the original page requested.

JUNOS Software provides a customizable template for the captive portal window that allows you to easily design and modify the look of the captive portal login page. You can modify the design elements in the template to change the look of your captive portal login page and to add instructions or information to the page. You can also modify any of the design elements of an existing captive portal login page.

Figure 1 shows an example of a captive portal login page:

Figure 1: Example of a Captive Portal Login Page

Image s070001.gif

Table 1 summarizes the configurable elements of a captive portal login page.

Table 1: Configurable Elements of a Captive Portal Login Page

ElementCLI StatementDescription

Banner message

banner-message text-string

The first screen displayed before the captive portal login page is displayed (not shown). The page header says “Terms and Conditions of Use: Please read the following terms of use and disclaimers carefully before using this network.

The configurable banner message appears in the body of the page. The default text is “Terms and Conditions.”

A button labeled Agree gives the user access to the captive portal login page.

Footer background color

footer-bgcolor hex-color

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

Footer message

footer-message text-string

For example, you can include copyright information and links to additional information such as help instructions, legal notices, or a privacy policy.

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

Form header background color

form-header-bgcolor hex-color

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

Form header message

form-header-message text-string

Text displayed in the header bar across the top of the form area of the captive portal login page. For example, Welcome to My Cafe.

The default text is Captive Portal User Authentication.

Form reset button label

form-reset-label label-name

Label appearing in the button that the user can select to clear the username and password fields on the form, for example, Reset or Clear.

Form submit button label

form-submit-label label-name

Label appearing in the button that user selects to submit their login information—for example, Log In or OK.

Header background color

header-bgcolor hex-color

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

Header logo

header-logo filename

Filename of the file containing the image of the logo that you want to appear at the top of the captive portal login page. The image file can be in GIF, JPEG, or PNG format.

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

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

Header message

header-message text-string

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

Post-authentication URL

post-authentication-url url

URL to which the users are directed upon successful authentication. The default is to redirect users to the page they had originally requested.

To design the captive portal login page:

  1. (Optional) Upload your logo image file to the switch:

    user@switch> file copy ftp://username:prompt@ftp.hostname.net/var/tmp/my-logo.jpeg
  2. Configure the custom options to specify the background colors and text displayed in the captive portal page:

    [edit system services captive-portal]
    user@switch# set custom-options header-bgcolor #006600
    set custom-options header-message “Welcome to Our Network”
    set custom-options banner-message “Please enter your username and password:”
    set custom-options footer-message “Copyright ©2009, Our Network”

Note: For the custom options that you do not specify, the value is taken from the standard template.


Published: 2010-01-20