55 lines
1.7 KiB
Markdown
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>
|
||
|
|
```
|