passkey/README.md

55 lines
1.7 KiB
Markdown

# Implementing passkey
## Add passkey to user update form
```javascript
<!-- 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
```javascript
<!-- Passkeys -->
<script type='text/javascript' src='{{ asset('/passkey/passkey.js') }}'></script>
<script type="text/javascript">
passkey_check('{{ csrf_token() }}','{{ back()->getTargetUrl() }}');
</script>
```