Cisco ISE Guest Portal Human Verification

[Kevin Raditheo]

Hi All,

I have deployment in one of my client with Cisco ISE Self Register Portal with sponsor approval.

Therefore the guest are expected to register them-self prior login.

Then after that sponsor must approved the guest account before the guest can use it.

My question is, is there any method to prevent some guest to using a bot to create an account.

Imagine that a bot can create 100 account per minute and there will be a spam email in sponsor account because of approval notification.

Anyone have a case like this? Maybe integrate ISE portal with captcha with custom portal or any other method?

Thanks for your advises and insights.

Regards,

Kevin

[Charlie Moreton · Accepted solution]

Yes, you can accomplish this with the steps below:

*I found these instructions long ago written for ISE 1.3.  There was no author attached to them and I have updated the instructions for 2.1*

Navigate to Work Centers > Guest Access > Configure > Guest Portals.  Select the Self-Registered Guest Portal and click the Duplicate button.

Give the new Portal a name and updated description.

Click on the Portal Page Customization panel and verify that you are customizing the Login page.

Scroll to the Optional Content 2 text box and click the HTML Toggle button (highlighted below):

Paste the contents of the captcha_login.txt file into the text box and click the HTML Toggle button again.

<style>

.captcha_text {

margin-top:5px;

float: left;

width: 82px;

  height: 37px;

  font: bold 16px/37px Arial, sans;

  text-align: center;

  background-color: #ededed;

  -webkit-touch-callout: none;

  -webkit-user-select: none;

  -khtml-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

}

.captcha_input

{

float: left;

width: 250px;

margin-left:45px;

}

</style><script>

var submitButton = jQuery('#ui_login_signon_button');

var submitButtonUiContainer = submitButton.parent();

submitButtonUiContainer.css('opacity', 0.25);

submitButton.addClass('disabled');

var captchaBlock = jQuery('<div class="captcha_container"></div>');

captchaBlock.html('<div class="captcha_text"></div> <div class="captcha_input"><input placeholder="Enter code" type="text" /></div>');

jQuery('form[name="loginForm"]').find('.cisco-ise-form-buttons').before(captchaBlock);

var login_captcha='';

    function login_randomgen() {

        for (ranNum = 1; ranNum <= 6; ranNum++) {

            login_captcha += Math.floor(Math.random() * 10).toString();

        }

        jQuery('.captcha_text').html(login_captcha);

    }

    login_randomgen();

jQuery('.captcha_input').find('input').on('input', function(evt){

if(jQuery(this).val() == login_captcha)

{

submitButton.removeClass('disabled');

submitButtonUiContainer.css('opacity', 1);

}

else

{

submitButton.addClass('disabled');

submitButtonUiContainer.css('opacity', 0.25);

}

});

submitButton.on('click', function(evt){

evt.preventDefault();

if(jQuery(this).hasClass('disabled')) return;

jQuery('form[name="loginForm"]').submit();

});

</script>

Scroll up and select the Self-Registration page

Scroll down to the Optional Content 2 text box and click the HTML Toggle button (highlighted below):

Paste the contents of the captcha_selfReg.txt file into the text box and click the HTML Toggle button again.

<style>

.captcha_text {

margin-top:5px;

float: left;

width: 82px;

  height: 37px;

  font: bold 16px/37px Arial, sans;

  text-align: center;

  background-color: #ededed;

  -webkit-touch-callout: none;

  -webkit-user-select: none;

  -khtml-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

}

.captcha_input

{

float: left;

width: 250px;

margin-left:45px;

}

.disabled .ui-submit

{

opacity: 0.25;

}

</style><script>

var submitButton = jQuery('#ui_self_reg_submit_button');

var submitButtonUiContainer = submitButton.parent();

submitButtonUiContainer.addClass('disabled');

console.log(submitButtonUiContainer);

submitButton.addClass('disabled');

var captchaBlock = jQuery('<div class="captcha_container"></div>');

captchaBlock.html('<div class="captcha_text"></div> <div class="captcha_input"><input placeholder="Enter code" type="text" /></div>');

jQuery('form[name="selfRegForm"]').find('.cisco-ise-form-buttons').before(captchaBlock);

var login_captcha='';

    function login_randomgen() {

        for (ranNum = 1; ranNum <= 6; ranNum++) {

            login_captcha += Math.floor(Math.random() * 10).toString();

        }

        jQuery('.captcha_text').html(login_captcha);

    }

    login_randomgen();

jQuery('.captcha_input').find('input').on('input', function(evt){

if(jQuery(this).val() == login_captcha)

{

submitButton.removeClass('disabled');

submitButtonUiContainer.removeClass('disabled');

}

else

{

submitButton.addClass('disabled');

submitButtonUiContainer.addClass('disabled');

}

});

submitButton.on('click', function(evt){

evt.preventDefault();

if(jQuery(this).hasClass('disabled')) return;

jQuery('form[name="selfRegForm"]').submit();

});

</script>

The most important step is to scroll all the way back up and click Save

Once this is done, you can test the new Self-Registration Guest Portal with Captcha Verification.

This is the initial login screen.

If the user clicks the 'Don't have an account?' link, they will get this page, also with a Captcha

I hope this helps.  Please leave feedback so that we know.

**Edited to replace all '$' in javascript with 'jQuery'

[Kevin Raditheo]

Hi Charles,

I've tried this method, and it works great.

Thank you very much for your help.

Hopefully in the next Cisco ISE release this can be done with an option in ISE so no need to copy paste the script

Have a nice day..

[Jason Kunst]

If you don't mind send me company name to jakunst@cisco.com<mailto:jakunst@cisco.com> and will add to request list

I don't think will be in next release

[aaggarwal23]

Hi Charlie Moreton,

The Captcha code mentioned above is working like charm on a Windows machine. However, when we tried to access the guest portal on MAC and Android devices the Captcha code does not show there in the browser. Is there something we need to modify to work this captcha on Android and MAC OS?