passkey/README.md

1.7 KiB

Implementing passkey

Add passkey to user update form

<!-- Passkeys -->
<script type='text/javascript' src='{{ asset('/passkey/passkey.js') }}'></script>

<script type="text/javascript">
	$(document).ready(function() {
		$('#passkey').on('click',function(item) {
			if (passkey_debug)
				console.log('Passkey: Create Click');

			// Availability of `window.PublicKeyCredential` means WebAuthn is usable.
			// `isUserVerifyingPlatformAuthenticatorAvailable` means the feature detection is usable.
			// `sConditionalMediationAvailable` means the feature detection is usable.
			if (window.PublicKeyCredential &&
				PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable &&
				PublicKeyCredential.isConditionalMediationAvailable) {
					// Check if user verifying platform authenticator is available.
					Promise.all([
						PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable(),
						PublicKeyCredential.isConditionalMediationAvailable(),
					]).then(results => {
						if (passkey_debug)
							console.log('Passkey: Browser Supported');

						if (results.every(r => r === true)) {
							passkey_register('{{ csrf_token() }}',$(this),'bi-key','btn-primary','{{ $o->passkey ? 'btn-primary' : 'btn-outline-primary' }}');
						} else {
							alert('It seems that passkey is NOT supported by your browse (B)');
						}
					});

			} else {
				alert('It seems that passkey is NOT supported by your browser (A)');
			}

			return false;
		});
	});
</script>

Enable passkey login

<!-- Passkeys -->
<script type='text/javascript' src='{{ asset('/passkey/passkey.js') }}'></script>

<script type="text/javascript">
	passkey_check('{{ csrf_token() }}','{{ back()->getTargetUrl() }}');
</script>