Added passkey for logins

This commit is contained in:
2024-04-25 15:27:45 +10:00
parent d90f431925
commit 527cc1d4ab
17 changed files with 480 additions and 80 deletions

View File

@@ -5,7 +5,7 @@
@endsection
@section('content')
@if(isset($login_note) AND $login_note)
@if(isset($login_note) && $login_note)
<div class="row">
<div class="col-8 m-auto">
<div class="alert alert-info alert-dismissible" role="alert">
@@ -20,20 +20,21 @@
</div>
@endisset
<div class="row">
<div class="col-6 m-auto">
<div class="greyframe titledbox shadow0xb0 text-center">
<h2 class="cap">Login</h2>
<form class="needs-validation" method="post" novalidate>
@csrf
<form class="row g-0 needs-validation" method="post" novalidate>
@csrf
<div class="row">
<div class="col-6 m-auto">
<div class="greyframe titledbox shadow0xb0 text-center">
<h2 class="cap">Login</h2>
<div class="row">
<div class="col-12">
<label for="email" class="form-label">Email</label>
<div class="input-group has-validation">
<span class="input-group-text"><i class="bi bi-person-badge"></i></span>
<input type="text" class="form-control @error('email') is-invalid @enderror" id="email" placeholder="Email" name="email" required autocomplete="email" autofocus>
<!-- Conditionally display passkeys in autofill -->
<input type="text" class="form-control @error('email') is-invalid @enderror" id="email" placeholder="Email" name="email" required autocomplete="email webauthn" autofocus>
<span class="invalid-feedback" role="alert">
@error('email')
{{ $message }}
@@ -50,7 +51,7 @@
<label for="password" class="form-label">Password</label>
<div class="input-group has-validation">
<span class="input-group-text"><i class="bi bi-key-fill"></i></span>
<input type="password" class="form-control" id="password" placeholder="Password" name="password" required>
<input type="password" class="form-control" id="password" placeholder="Password" name="password" autocomplete="new-password" required>
<span class="invalid-feedback" role="alert">
Your password is required.
</span>
@@ -70,20 +71,29 @@
<button type="submit" name="submit" class="btn btn-success float-end">Sign In</button>
</div>
</div>
</form>
<div class="row">
<div class="col-12">
<a class="link-danger" href="{{ url('password/reset') }}">Forgot Password</a>
<div class="row">
<div class="col-12">
<a class="link-danger" href="{{ url('password/reset') }}">Forgot Password</a>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<a class="link-danger" href="{{ url('register') }}">Register</a>
<div class="row">
<div class="col-12">
<a class="link-danger" href="{{ url('register') }}">Register</a>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
</form>
@endsection
@section('page-scripts')
<!-- Passkeys -->
<script type='text/javascript' src='{{ asset('/passkey/passkey.js') }}'></script>
<script type="text/javascript">
passkey_check('{{ csrf_token() }}','{{ back()->getTargetUrl() }}');
</script>
@append

View File

@@ -43,7 +43,7 @@
<dl>
<dt>Users</dt>
<dd><a href="{{ url('user/addedit') }}">Create</a></dd>
<dd><a href="{{ url('user') }}">List</a></dd>
<dd><a href="{{ url('user/list') }}">List</a></dd>
</dl>
@endcan
@endauth

View File

@@ -32,6 +32,7 @@
</a>
<div class="collapse navbar-collapse" id="user-menu-list">
<ul class="dropdown-menu dropdown-menu-dark">
<li><a class="dropdown-item" href="{{ url('user/addedit',$user->id) }}">Account Settings</a></li>
<li><a class="dropdown-item" href="{{ url('user/system/register') }}">Register/Link System</a></li>
@can('admin')
<li><a class="dropdown-item @if(preg_match('#^setup#',request()->path()))thispage @endif" href="{{ url('setup') }}">Setup</a></li>

View File

@@ -271,7 +271,7 @@ use App\Classes\Protocol\{Binkp,EMSI,DNS};
<div class="row pt-5">
<div class="col-2">
<a href="{{ url('domain') }}" class="btn btn-danger">Cancel</a>
<a href="{{ back()->getTargetUrl() }}" class="btn btn-danger">Cancel</a>
</div>
<span class="col-6 mt-auto mx-auto text-center align-bottom">

View File

@@ -1,3 +1,4 @@
<!-- $o=User::class -->
@extends('layouts.app')
@section('htmlheader_title')
@@ -18,7 +19,7 @@
<label for="name" class="form-label">Name</label>
<div class="input-group has-validation">
<span class="input-group-text"><i class="bi bi-tag-fill"></i></span>
<input type="text" class="form-control @error('name') is-invalid @enderror" id="name" placeholder="Name" name="name" value="{{ old('name',$o->name) }}" required @cannot('admin',$o)disabled @endcannot autofocus>
<input type="text" class="form-control @error('name') is-invalid @enderror" id="name" placeholder="Name" name="name" value="{{ old('name',$o->name) }}" autocomplete="name" required @cannot('admin',$o)disabled @endcannot autofocus>
<span class="invalid-feedback" role="alert">
@error('name')
{{ $message }}
@@ -33,7 +34,7 @@
<label for="alias" class="form-label">BBS Alias</label>
<div class="input-group has-validation">
<span class="input-group-text"><i class="bi bi-tag-fill"></i></span>
<input type="text" class="form-control @error('alias') is-invalid @enderror" id="alias" placeholder="alias" name="alias" value="{{ old('alias',$o->alias) }}" @cannot('admin',$o)disabled @endcannot>
<input type="text" class="form-control @error('alias') is-invalid @enderror" id="alias" placeholder="alias" name="alias" value="{{ old('alias',$o->alias) }}" @cannot('update',$o)disabled @endcannot>
<span class="invalid-feedback" role="alert">
@error('alias')
{{ $message }}
@@ -43,23 +44,25 @@
</div>
<!-- Forward Netmail -->
<div class="col-4">
<label for="system_id" class="form-label">Forward Netmails</label>
<div class="input-group has-validation">
<span class="input-group-text"><i class="bi bi-envelope-at-fill"></i></span>
<select style="width: 80%;" class="form-select @error('system_id') is-invalid @enderror" id="system_id" name="system_id" required @cannot('admin',$o)disabled @endcannot>
<option value="">&nbsp;</option>
@foreach ($o->systems as $oo)
<option value="{{ $oo->id }}" @if(old('system_id',$o->system_id)==$oo->id)selected @endif>{{ $oo->name }}</option>
@endforeach
</select>
<span class="invalid-feedback" role="alert">
@error('system_id')
{{ $message }}
@enderror
</span>
@can('admin',$o)
<div class="col-4">
<label for="system_id" class="form-label">Forward Netmails</label>
<div class="input-group has-validation">
<span class="input-group-text"><i class="bi bi-envelope-at-fill"></i></span>
<select style="width: 80%;" class="form-select @error('system_id') is-invalid @enderror" id="system_id" name="system_id" required>
<option value="">&nbsp;</option>
@foreach ($o->systems as $oo)
<option value="{{ $oo->id }}" @if(old('system_id',$o->system_id)==$oo->id)selected @endif>{{ $oo->name }}</option>
@endforeach
</select>
<span class="invalid-feedback" role="alert">
@error('system_id')
{{ $message }}
@enderror
</span>
</div>
</div>
</div>
@endcan
</div>
<div class="row">
@@ -67,7 +70,7 @@
<label for="email" class="form-label">Email</label>
<div class="input-group has-validation">
<span class="input-group-text"><i class="bi bi-person-badge"></i></span>
<input type="text" class="form-control @error('email') is-invalid @enderror" id="email" placeholder="Email" name="email" value="{{ old('email',$o->email) }}" required @cannot('admin',$o)disabled @endcannot>
<input type="text" class="form-control @error('email') is-invalid @enderror" id="email" placeholder="Email" name="email" value="{{ old('email',$o->email) }}" autocomplete="email" required @cannot('update',$o)disabled @endcannot>
<span class="invalid-feedback" role="alert">
@error('email')
{{ $message }}
@@ -78,37 +81,72 @@
</div>
</div>
<div class="col-4">
<label for="password" class="form-label">Password</label>
<div class="input-group has-validation">
<span class="input-group-text"><i class="bi bi-person-badge"></i></span>
<input type="password" class="form-control @error('password') is-invalid @enderror" id="password" placeholder="{{ old('password',$o->password) ? 'Password Unchanged' : 'Password' }}" name="password" value="" @cannot('update',$o)disabled @endcannot>
<span class="invalid-feedback" role="alert">
@error('password')
{{ $message }}
@else
Password required for login.
@enderror
</span>
</div>
</div>
<div class="col-1">
<label for="active" class="form-label">Active</label>
<div class="input-group">
<div class="btn-group" role="group">
<input type="radio" class="btn-check" name="active" id="active_yes" value="1" required @cannot('admin',$o)disabled @endcannot @if(old('active',$o->active))checked @endif>
<label class="btn btn-outline-success" for="active_yes">Yes</label>
<input type="radio" class="btn-check btn-danger" name="active" id="active_no" value="0" required @cannot('admin',$o)disabled @endcannot @if(! old('active',$o->active))checked @endif>
<label class="btn btn-outline-danger" for="active_no">No</label>
@can('ownes',$o)
<label for="passkey" class="form-label">Passkey</label>
<div class="input-group has-validation">
<button class="btn {{ $o->passkey ? 'btn-primary' : 'btn-outline-primary' }}" id="passkey"><i class="bi bi-key"></i></button>
<span class="invalid-feedback" role="alert">
@error('passkey')
{{ $message }}
@enderror
</span>
</div>
</div>
@endcan
</div>
<div class="offset-1 col-1">
<label for="admin" class="form-label">Site Admin</label>
<div class="input-group">
<div class="btn-group" role="group" @if($user->id === $o->id)data-bs-toggle="tooltip" title="You cannot demote yourself" @endif>
<input type="radio" class="btn-check" name="admin" id="admin_yes" value="1" required @cannot('admin',$o)disabled @endcannot @if(old('admin',$o->admin))checked @endif>
<label class="btn btn-outline-success" for="admin_yes">Yes</label>
@can('admin',$o)
<div class="col-3">
<div class="row p-0">
<div class="col-xl-6 col-12">
<span class="form-label" style="font-size: 75%; margin-bottom: 1px;">Active</span>
<div class="input-group">
<div class="btn-group" role="group">
<input type="radio" class="btn-check" name="active" id="active_yes" value="1" required @if(old('active',$o->active))checked @endif>
<label class="btn btn-outline-success" for="active_yes">Yes</label>
<input type="radio" class="btn-check btn-danger" name="admin" id="admin_no" value="0" required @if(($user->id === $o->id) || $user->cannot('admin',$o)) disabled @endif @if(! old('admin',$o->admin))checked @endif>
<label class="btn btn-outline-danger" for="admin_no">No</label>
<input type="radio" class="btn-check btn-danger" name="active" id="active_no" value="0" required @if(! old('active',$o->active))checked @endif>
<label class="btn btn-outline-danger" for="active_no">No</label>
</div>
</div>
</div>
<div class="col-xl-6 col-12">
<span class="form-label" style="font-size: 75%; margin-bottom: 1px;">Site Admin</span>
<div class="input-group">
<div class="btn-group" role="group" @if($user->id === $o->id)data-bs-toggle="tooltip" title="You cannot demote yourself" @endif>
<input type="radio" class="btn-check" name="admin" id="admin_yes" value="1" required @if(old('admin',$o->admin))checked @endif>
<label class="btn btn-outline-success" for="admin_yes">Yes</label>
<input type="radio" class="btn-check btn-danger" name="admin" id="admin_no" value="0" required @if(($user->id === $o->id) || $user->cannot('admin',$o)) disabled @endif @if(! old('admin',$o->admin))checked @endif>
<label class="btn btn-outline-danger" for="admin_no">No</label>
</div>
</div>
</div>
</div>
</div>
</div>
@endcan
</div>
<div class="row">
<div class="col-12">
<label for="pgp_pubkey" class="form-label">PGP Public Key</label>
<textarea class="form-control @error('pgp_pubkey')is-invalid @enderror" rows=3 name="pgp_pubkey" placeholder="PGP Public Key..." @cannot('admin',$o)disabled @endcannot>{{ old('pgp_pubkey',$o->pgp_pubkey) }}</textarea>
<textarea class="form-control @error('pgp_pubkey')is-invalid @enderror" rows=3 id="pgp_pubkey" name="pgp_pubkey" placeholder="PGP Public Key..." @cannot('update',$o)disabled @endcannot>{{ old('pgp_pubkey',$o->pgp_pubkey) }}</textarea>
<span class="invalid-feedback" role="alert">
@error('pgp_pubkey')
{{ $message }}
@@ -119,8 +157,8 @@
<div class="row">
<div class="col-12">
<a href="{{ url('user') }}" class="btn btn-danger">Cancel</a>
@can('admin',$o)
<a href="{{ back()->getTargetUrl() }}" class="btn btn-danger">Cancel</a>
@canany(['admin','update'],$o)
<button type="submit" name="submit" class="btn btn-success float-end">@if ($o->exists)Save @else Add @endif</button>
@endcan
</div>
@@ -170,8 +208,11 @@
@section('page-scripts')
@js('select2')
<!-- Passkeys -->
<script type='text/javascript' src='{{ asset('/passkey/passkey.js') }}'></script>
@if($user->id === $o->id)
<script>
<script type="text/javascript">
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
return new bootstrap.Tooltip(tooltipTriggerEl)
@@ -182,6 +223,37 @@
<script type="text/javascript">
$(document).ready(function() {
$('#system_id').select2();
$('#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>
@append

View File

@@ -8,7 +8,7 @@
<div class="col-12">
<h2>System Users</h2>
<p>This system is aware of the following users @can('admin',(new \App\Models\User))(you can <a href="{{ url('user/addedit') }}">add</a> more)@endcan:</p>
<p>This system is aware of the following users (you can <a href="{{ url('user/addedit') }}">add</a> more):</p>
<table class="table monotable" id="user">
<thead>
<tr>