[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>