Registration fields pre-fill from URL

ctorres

Hi,

I'm trying to implement an invitation workflow for new users which is triggered from inside my application.

The result is that the invitee receives an email with a link to simply login if the user was previously determined to be in my FusionAuth instance, but if the user does not exist, then the link is to the registration form. Here is an example link:

https://auth.whatevermyappis.com/oauth2/register?tenantId=8537366e-84dc-4711-a465-eadd8cea2f1c&client_id=757504bb-6c14-4913-bb50-608ad5ff46e2&pendingIdPLinkId=&redirect_uri=https%3A%2F%2Fapp.whatevermyappis.com&response_mode=form_post&response_type=code&scope=openid%20profile

I would like to be able to add some additional parameters in the url that would pre-populate some fields on the registration UI, for example, the Email, First Name and Last Name are known to my when the URL is crafted and the invitation email is sent.

It would be even better if those fields would be even better if those fields will be disabled from editing (at least the email) so whichever email was sent by the person doing the invitation will be the same one the end-user will use for registration.

Finally, i would be amazing if a parameter could drive that email is marked as verified since the link was clicked because the email was succesfully received by the end-user.

Please let me know if this is possible, or any workaround already exist, if not, how do i put it as a feature request.

Thanks

ctorres

Hahaha, i was able to figure out half of it by adding these at the end:

&user.firstName=Anakin&user.lastName=Skywalker&user.email=anakin@tattoine.com

Any ideas for the email verification and potential blocking of the fields?

ctorres

I was able to block the fields on the registration form by adding this javascript to the OAuth Register theme:

<script type="text/javascript">
	window.onload = function () {
		const queryString = window.location.search;
		const urlParams = new URLSearchParams(queryString);
		if (urlParams.has('user.email'))
			{
		        document.getElementById("email").disabled = true;
				document.getElementById("firstName").disabled = true;
				document.getElementById("lastName").disabled = true;
			}
	};
</script>

So if the registration form is used directly it workes as before, but if i'm passing the parameters on the URL from the invitation email, then those fields are pre-populated and blocked.

I also disabled the email verification altogether, so that is not a issue anymore.

ctorres

Sorry, after further testing i noticed that if the registration fields are disabled, then the registration process is ignoring them. I had to emulate the disable with "readonly" and some style:

<script type="text/javascript">
window.onload = function () {
	const queryString = window.location.search;
	const urlParams = new URLSearchParams(queryString);
	if (urlParams.has('user.email'))
	{
		document.getElementById("email").readOnly = true;
		document.getElementById("email").style.backgroundColor = "#1e73be";
		document.getElementById("firstName").readOnly = true;
		document.getElementById("firstName").style.backgroundColor = "#1e73be";
		document.getElementById("lastName").readOnly = true;
		document.getElementById("lastName").style.backgroundColor = "#1e73be";
	}
};
</script>

dan

@ctorres Awesome, thanks for sharing your process!