csp fixes

app/Http/Middleware/LDCNetwork.php

@@ -17,7 +17,7 @@ class LDCNetwork
      */
     public function handle($request, Closure $next)
     {
-        if (\config('app.env') === 'local') {
+        if (\config('app.env') === 'local' || (\config('app.env') === 'production' && \config('app.debug') === true)) {
             return $next($request);
         }
 

resources/ts/back.ts

@@ -2,3 +2,4 @@
 import "./common";
 import "./vue";
 import "./confirm";
+import "./otpfields";

resources/ts/components/LoginIdComponent.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="container">
-    <div class="row" style="margin: 10px">
+    <div class="row">
       <div v-if="dataList.length > 0" class="col-md-12">
         <div class="container">
             <div class="row mt-2" v-for="(item, index) in dataList">

resources/ts/otpfields.ts

@@ -0,0 +1,13 @@
+window.addEventListener("DOMContentLoaded", () => {
+    let elements = document.getElementsByClassName("otp-field");
+    for (const element of elements) {
+        element.addEventListener("input", checkFields);
+    }
+});
+
+function checkFields(e: Event) {
+    const target = e.target as HTMLInputElement;
+    if (target) {
+        target.value = target.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');
+    }
+}

resources/views/auth/verify.blade.php

@@ -12,7 +12,7 @@
                         <form ref="otp_form" class="d-inline" method="POST" action="{{ route('auth.otpCheck') }}">
                             @csrf
                             {{ __('Code OTP') }} :
-                            <input type="text" name="otp" maxlength="6" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');" required>
+                            <input type="text" name="otp" maxlength="6" class="otp-field" required>
                             <button class="btn btn-primary">{{ __('Valider') }}</button>
                         </form>
                         <a href="/login/send-sms-otp" class="btn btn-link">{{ __('SMS') }}</a>
@@ -22,4 +22,4 @@
         </div>
     </div>
 </div>
-@endsection
+@endsection

resources/views/errors/401.blade.php

@@ -0,0 +1,5 @@
+@extends('errors::minimal')
+
+@section('title', __('Unauthorized'))
+@section('code', '401')
+@section('message', __('Unauthorized'))

resources/views/errors/403.blade.php

@@ -0,0 +1,5 @@
+@extends('errors::minimal')
+
+@section('title', __('Forbidden'))
+@section('code', '403')
+@section('message', __($exception->getMessage() ?: 'Forbidden'))

resources/views/errors/404.blade.php

@@ -0,0 +1,5 @@
+@extends('errors::minimal')
+
+@section('title', __('Not Found'))
+@section('code', '404')
+@section('message', __('Not Found'))

resources/views/errors/419.blade.php

@@ -0,0 +1,5 @@
+@extends('errors::minimal')
+
+@section('title', __('Page Expired'))
+@section('code', '419')
+@section('message', __('Page Expired'))

resources/views/errors/429.blade.php

@@ -0,0 +1,5 @@
+@extends('errors::minimal')
+
+@section('title', __('Too Many Requests'))
+@section('code', '429')
+@section('message', __('Too Many Requests'))

resources/views/errors/500.blade.php

@@ -0,0 +1,5 @@
+@extends('errors::minimal')
+
+@section('title', __('Server Error'))
+@section('code', '500')
+@section('message', __('Server Error'))

resources/views/errors/503.blade.php

@@ -0,0 +1,5 @@
+@extends('errors::minimal')
+
+@section('title', __('Service Unavailable'))
+@section('code', '503')
+@section('message', __('Service Unavailable'))

resources/views/errors/minimal.blade.php

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <title>@yield('title')</title>
+
+    <!-- Fonts -->
+    <link rel="preconnect" href="https://fonts.gstatic.com">
+    <link href="https://fonts.googleapis.com/css2?family=Nunito&display=swap" rel="stylesheet">
+
+    <!-- Styles -->
+    <link href="{{ mix('css/errors.css') }}" rel="stylesheet">
+
+</head>
+
+<body class="antialiased">
+    <div class="relative flex items-top justify-center min-h-screen bg-gray-100 dark:bg-gray-900 sm:items-center sm:pt-0">
+        <div class="max-w-xl mx-auto sm:px-6 lg:px-8">
+            <div class="flex items-center pt-8 sm:justify-start sm:pt-0">
+                <div class="px-4 text-lg text-gray-500 border-r border-gray-400 tracking-wider">
+                    @yield('code')
+                </div>
+
+                <div class="ml-4 text-lg text-gray-500 uppercase tracking-wider">
+                    @yield('message')
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>

resources/views/modules/flashMessage.blade.php

@@ -1,68 +1,68 @@
-<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
-  <symbol id="check-circle-fill" fill="currentColor" viewBox="0 0 16 16">
-    <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
-  </symbol>
-  <symbol id="info-fill" fill="currentColor" viewBox="0 0 16 16">
-    <path d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm.93-9.412-1 4.705c-.07.34.029.533.304.533.194 0 .487-.07.686-.246l-.088.416c-.287.346-.92.598-1.465.598-.703 0-1.002-.422-.808-1.319l.738-3.468c.064-.293.006-.399-.287-.47l-.451-.081.082-.381 2.29-.287zM8 5.5a1 1 0 1 1 0-2 1 1 0 0 1 0 2z"/>
-  </symbol>
-  <symbol id="exclamation-triangle-fill" fill="currentColor" viewBox="0 0 16 16">
-    <path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
-  </symbol>
-</svg>
-
 @if ($message = Session::get('success'))
 <div class="alert alert-success d-flex align-items-center alert-dismissible fade show" role="alert">
-    <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Success:"><use xlink:href="#check-circle-fill"/></svg>
-    <strong>{!! nl2br(e($message)) !!}</strong>
-    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+  <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Success:">
+    <use xlink:href="#check-circle-fill" />
+  </svg>
+  <strong>{!! nl2br(e($message)) !!}</strong>
+  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
 </div>
 @endif
 
 @if ($message = Session::get('error'))
 <div class="alert alert-danger d-flex align-items-center alert-dismissible fade show" role="alert">
-    <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Danger:"><use xlink:href="#exclamation-triangle-fill"/></svg>
-    <strong>{!! nl2br(e($message)) !!}</strong>
-    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+  <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Danger:">
+    <use xlink:href="#exclamation-triangle-fill" />
+  </svg>
+  <strong>{!! nl2br(e($message)) !!}</strong>
+  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
 </div>
 @endif
 
 
 @if ($message = Session::get('warning'))
 <div class="alert alert-warning d-flex align-items-center alert-dismissible fade show" role="alert">
-    <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Warning:"><use xlink:href="#exclamation-triangle-fill"/></svg>
-    <strong>{!! nl2br(e($message)) !!}</strong>
-    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+  <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Warning:">
+    <use xlink:href="#exclamation-triangle-fill" />
+  </svg>
+  <strong>{!! nl2br(e($message)) !!}</strong>
+  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
 </div>
 @endif
 
 
 @if ($message = Session::get('info'))
 <div class="alert alert-info d-flex align-items-center alert-dismissible fade show" role="alert">
-    <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Info:"><use xlink:href="#info-fill"/></svg>
-    <strong>{!! nl2br(e($message)) !!}</strong>
-    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+  <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Info:">
+    <use xlink:href="#info-fill" />
+  </svg>
+  <strong>{!! nl2br(e($message)) !!}</strong>
+  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
 </div>
 @endif
 
 @if ($message = Session::get('message'))
 <div class="alert alert-info d-flex align-items-center alert-dismissible fade show" role="alert">
-    <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Info:"><use xlink:href="#info-fill"/></svg>
-    <strong>{!! nl2br(e($message)) !!}</strong>
-    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+  <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Info:">
+    <use xlink:href="#info-fill" />
+  </svg>
+  <strong>{!! nl2br(e($message)) !!}</strong>
+  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
 </div>
 @endif
 
 
 @if ($errors->any())
 <div class="alert alert-danger d-flex align-items-center alert-dismissible fade show" role="alert">
-    <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Danger:"><use xlink:href="#exclamation-triangle-fill"/></svg>
-    @if ($errors->any())
-    <ul class="list-unstyled">
-        @foreach ($errors->all() as $error)
-        <li>{{ $error }}</li>
-        @endforeach
-    </ul>
-    @endif
-    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+  <svg class="bi flex-shrink-0 me-2" width="24" height="24" role="img" aria-label="Danger:">
+    <use xlink:href="#exclamation-triangle-fill" />
+  </svg>
+  @if ($errors->any())
+  <ul class="list-unstyled">
+    @foreach ($errors->all() as $error)
+    <li>{{ $error }}</li>
+    @endforeach
+  </ul>
+  @endif
+  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
 </div>
-@endif
+@endif

resources/views/otp-delete.blade.php

@@ -2,7 +2,7 @@
     @csrf
     @method('DELETE')
     {{ __('Code OTP') }} :
-    <input type="text" name="otp" maxlength="6" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');" required>
+    <input type="text" name="otp" maxlength="6" class="otp-field" required>
     <button class="btn btn-danger">{{ __('Supprimer') }}</button>
 </form>
-<a href="{{ route('auth.sms-otp') }}" class="btn btn-link">{{ __('SMS') }}</a>
+<a href="{{ route('auth.sms-otp') }}" class="btn btn-link">{{ __('SMS') }}</a>

resources/views/qrcode.blade.php

@@ -7,14 +7,14 @@
             <div class="card">
                 <div class="card-header">
                     OTP QRCode
-                    <a href="https://support.google.com/accounts/answer/1066447?hl=FR" target="_blank" class="btn btn-sm btn-primary" style="float: right;">Google Authenticator</a>
+                    <a href="https://support.google.com/accounts/answer/1066447?hl=FR" target="_blank" class="btn btn-sm btn-primary float-end">Google Authenticator</a>
                 </div>
 
                 <div class="card-body d-flex justify-content-center">
                     @if (session('status'))
-                        <div class="alert alert-success" role="alert">
-                            {{ session('status') }}
-                        </div>
+                    <div class="alert alert-success" role="alert">
+                        {{ session('status') }}
+                    </div>
                     @endif
                     {{ $qrcode }}
                 </div>
@@ -22,4 +22,4 @@
         </div>
     </div>
 </div>
-@endsection
+@endsection

routes/web-fo.php

@@ -6,8 +6,9 @@ use Illuminate\Support\Facades\Route;
 
 Route::post('/webhooks/gitlab', [GitlabController::class, 'handle']);
 
-Route::view('/login/unauthorized', 'auth.unauthorized')->name('unauthorized');
-
-Route::get('/login/verify', [OTPController::class, 'verify'])->name('auth.verify');
-Route::get('/login/send-sms-otp', [OTPController::class, 'sendOtpBySms'])->name('auth.sms-otp');
-Route::post('/login/checkOTP', [OTPController::class, 'check'])->name('auth.otpCheck');
+Route::group(['middleware' => ['ldcnetwork']], function () {
+    Route::view('/login/unauthorized', 'auth.unauthorized')->name('unauthorized');
+    Route::get('/login/verify', [OTPController::class, 'verify'])->name('auth.verify');
+    Route::get('/login/send-sms-otp', [OTPController::class, 'sendOtpBySms'])->name('auth.sms-otp');
+    Route::post('/login/checkOTP', [OTPController::class, 'check'])->name('auth.otpCheck');
+});

webpack.mix.js

@@ -80,6 +80,10 @@ mix.ts("resources/ts/back.ts", "public/js/back.js", { transpileOnly: true })
     .polyfill(polyfill)
     .version();
 
+// * Errors
+mix.sass("resources/scss/errors.scss", "public/css/errors.css")
+    .version();
+
 // * Copy Blade Images Assets
 mix.copyDirectory('resources/assets', 'public/assets')