Password Reset Process, using Service Portal

Jamsta1912
Tera Guru

Hello all,

I'm using a standard pasword reset process with Service Portal. On the portal landing page, a 'forgotten password' link takes the user to a new page that has the 'Pwd reset' widget. This is described here: https://docs.servicenow.com/bundle/london-servicenow-platform/page/administer/login/task/use-pwd-res...

The user is asked to enter their username and email address as verfication. They're then sent an email with a link that takes them to the final page, where they're asked to enter their new password. That final stage is the UI Page $pwd_new. My question is, is there a not-so-difficult way to have that final page also as a portal page rather than as a UI page? I guess this would require a widget that carries out the same functions as that UI page, but there doesn't appear to be one available in the base system. The issue is mainly aesthetic, in that the UI page has the 'native' ServiceNow UI and banner, where instead I'd like the end user to see a page themed like our service portal.

A second, related question I have: Is there a not-so-difficult way to customise the error messages that the user might see during the process, for instance if the link / token have expired or already been used? Currently these are in the security protected UI page $pwd_error.

Thanks for any pointers.

 

1 ACCEPTED SOLUTION

I did find a way to do this yes.

I created a new portal page and widget to display the UI page in an iframe (Similar to how the initial password reset screen is displayed).

I had to modify the PasswordResetUtil script include to generate a URL that points to my new portal page and also includes all the url parameters required:

This is the line I have modified in the script include:

resetPasswordURL = this.getInstanceURL() + '/csm?id=csm_email_reset&sysparm_id=' + usr.sys_id + '&sysparm_request_id=' + requestId + '&sysparm_show_custom_header_footer=false&sysparm_nostack=true&sysparm_token=' + token;

 

The widget used on the portal page is very similar to widget-reset-password however it now includes the url parameters sent from the password reset url and passes them into the iframe:

HTML:

 <iframe id="pwd_reset_container" class="frame-style" ng-src="{{iframeUrl}}" />

CLIENT CONTROLLER: 

 

function($scope, $location) {
  /* widget controller */
	var c = this;
	var url = "/$pwd_new.do?";

	var urlParams = $location.search();
	
	 for (var key in urlParams) {
		// if (key == 'sysparm_redirect_url') 
		//	 url += '&sysparm_redirect_url=' + urlParams[key];
		 
		 if (key == 'sysparm_show_custom_header_footer')
			 url += '&sysparm_show_custom_header_footer=' + urlParams[key];
		 
		 if (key == 'sysparm_id')
			 url += 'sysparm_id=' + urlParams[key];
		 
		 if (key == 'sysparm_request_id')
			 url += '&sysparm_request_id=' + urlParams[key];
		 
		 if (key == 'sysparm_token')
			 url += '&sysparm_token=' + urlParams[key];
		 
		 if (key == 'sysparm_nostack')
			 url += '&sysparm_nostack=' + urlParams[key];
		 
		 
			 
	 }
	
	$scope.iframeUrl = url;
	
	console.log("iframe URL = " + url);
}

 

Hope that points you in the right direction.

Thanks

Harry

View solution in original post

8 REPLIES 8

Hi Harry,

Unfortunately not. I couldn't find a way around it but in the end the customer was OK with that, as it's just that one screen that is without the branding. But I'd still be interested to hear if you do find a way!

thanks

I did find a way to do this yes.

I created a new portal page and widget to display the UI page in an iframe (Similar to how the initial password reset screen is displayed).

I had to modify the PasswordResetUtil script include to generate a URL that points to my new portal page and also includes all the url parameters required:

This is the line I have modified in the script include:

resetPasswordURL = this.getInstanceURL() + '/csm?id=csm_email_reset&sysparm_id=' + usr.sys_id + '&sysparm_request_id=' + requestId + '&sysparm_show_custom_header_footer=false&sysparm_nostack=true&sysparm_token=' + token;

 

The widget used on the portal page is very similar to widget-reset-password however it now includes the url parameters sent from the password reset url and passes them into the iframe:

HTML:

 <iframe id="pwd_reset_container" class="frame-style" ng-src="{{iframeUrl}}" />

CLIENT CONTROLLER: 

 

function($scope, $location) {
  /* widget controller */
	var c = this;
	var url = "/$pwd_new.do?";

	var urlParams = $location.search();
	
	 for (var key in urlParams) {
		// if (key == 'sysparm_redirect_url') 
		//	 url += '&sysparm_redirect_url=' + urlParams[key];
		 
		 if (key == 'sysparm_show_custom_header_footer')
			 url += '&sysparm_show_custom_header_footer=' + urlParams[key];
		 
		 if (key == 'sysparm_id')
			 url += 'sysparm_id=' + urlParams[key];
		 
		 if (key == 'sysparm_request_id')
			 url += '&sysparm_request_id=' + urlParams[key];
		 
		 if (key == 'sysparm_token')
			 url += '&sysparm_token=' + urlParams[key];
		 
		 if (key == 'sysparm_nostack')
			 url += '&sysparm_nostack=' + urlParams[key];
		 
		 
			 
	 }
	
	$scope.iframeUrl = url;
	
	console.log("iframe URL = " + url);
}

 

Hope that points you in the right direction.

Thanks

Harry

Hi Thanks a lot for sharing this. BR Dirk

Hi Harry - great work! Thanks for sharing. I'm sure plenty of people will make use of this ðŸ™‚