[5.x] Prevent double login causing 419 CSRF token mismatch (#10465)

statamic · Jul 17, 2024 · 8ade0d1 · 8ade0d1
1 parent c6929b8
commit 8ade0d1
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 6 deletions.
diff --git a/resources/js/components/login/login.js b/resources/js/components/login/login.js
@@ -9,6 +9,12 @@ export default {
         }
     },
 
+    data() {
+        return {
+            busy: false
+        }
+    },
+
     mounted() {
         if (this.hasError) {
             this.$el.parentElement.parentElement.classList.add('animation-shake');

diff --git a/resources/views/auth/login.blade.php b/resources/views/auth/login.blade.php
@@ -35,7 +35,7 @@
                 @endif
             @endif
 
-            <form method="POST" v-show="showEmailLogin" class="email-login select-none" @if ($oauth) v-cloak @endif>
+            <form method="POST" v-show="showEmailLogin" class="email-login select-none" @if ($oauth) v-cloak @endif @submit="busy = true">
                 {!! csrf_field() !!}
 
                 <input type="hidden" name="referer" value="{{ $referer }}" />
@@ -56,7 +56,7 @@
                         <input type="checkbox" name="remember" id="remember-me">
                         <span class="rtl:mr-2 ltr:ml-2">{{ __('Remember me') }}</span>
                     </label>
-                    <button type="submit" class="btn-primary">{{ __('Log in') }}</button>
+                    <button type="submit" class="btn-primary" :disabled="busy">{{ __('Log in') }}</button>
                 </div>
             </form>
         </div>

diff --git a/resources/views/auth/passwords/reset.blade.php b/resources/views/auth/passwords/reset.blade.php
@@ -9,10 +9,9 @@
 
     <div class="max-w-xs rounded shadow-lg flex items-center justify-center relative mx-auto">
         <div class="outside-shadow absolute inset-0"></div>
-        <div class="card auth-card">
+        <div class="card auth-card" x-data="{ busy: false }" v-pre>
 
-
-            <form method="POST" action="{{ $action }}">
+            <form method="POST" action="{{ $action }}" x-on:submit="busy = true">
                 @csrf
 
                 <input type="hidden" name="token" value="{{ $token }}">
@@ -47,7 +46,7 @@
                     <input id="password-confirm" type="password" class="input-text input-text" name="password_confirmation" required>
                 </div>
 
-                <button type="submit" class="btn-primary">{{ $title }}</button>
+                <button type="submit" class="btn-primary" :disabled="busy">{{ $title }}</button>
 
             </form>
         </div>