Request failed with status code 419 after the last update 1.8.0 (build: 29) HERD.

[kurtsk]

After updating Herd to version 1.8.0 (build: 29) my Laravel 10 sites are throwing a 419 error when trying to log in, this was not happening before this update, checking the forums I could see that it is a bug. It already happened and they recommend changing the values ​​output_buffering=20000, but in my case it does not solve the problem, I already tried clear cache but the problem continues, my setup is a MacBookPro M3 laravel 10 backend, vue2 front, does anyone have an idea how this could be solved? I repeat, before this update everything worked perfectly.

[mpociot]

Do you have an example project to reproduce the error? You're the first to report this

[kurtsk]

Thank you for responding to my request, the project is quite extensive and I really wouldn't know what part of the code could be useful but I'll explain a little, I have an API with Laravel 10 and an admin made in Quasar with vue2, I'm going to send you what I have of the login I This is where the problem arises:

PD: I am noticing that when I log in the cookies change in the browser twice in a row, I send a video.

LARAVEL

.env

APP_FRONT_URL=http://localhost:8080/
APP_FRONT_URL2=http://localhost:8081/
APP_FRONT_URL3=http://localhost:9001/
APP_FRONT_URL4=http://localhost:9000/
APP_FRONT_URL5=
APP_FRONT_STAGING_URL=
SANCTUM_STATEFUL_DOMAINS=localhost:8080,localhost:8081,localhost:9001,localhost:9000
SESSION_DOMAIN=localhost
SESSION_DRIVER=cookie

cors.php

return [

'paths' => [
'es/',
'en/',
'fr/',
'ca/',
'it/',
'pt/',
'ru/',
'et/',
'de/',
'hi/',
'api/*',
'home',
'login',
'logout',
'register',
'sanctum/csrf-cookie'],

'allowed_methods' => ['*'],

'allowed_origins' => [
env('APP_FRONT_URL'),
env('APP_FRONT_URL2'),
env('APP_FRONT_URL3'),
env('APP_FRONT_URL4'),
env('APP_FRONT_URL5'),
env('APP_FRONT_STAGING_URL')
],

'allowed_origins_patterns' => [],

'allowed_headers' => ['*'],

'exposed_headers' => [],

'max_age' => 0,

'supports_credentials' => true,

];

AuthController.php

public function login(Request $request)
{
$request->validate([
'email' => 'required|email',
'password' => 'required',
]);

$user = User::where('email', $request->email)->first();

if (!$user || !Hash::check($request->password, $user->password)) {
  throw new HttpResponseException(response()->json('User not registered in the system, check that your data is correct.!', 403));
}

return $user->createToken($request->email)->plainTextToken;
}

========================

QUASAR / VUE 2

axios.js

import Vue from 'vue'
import axios from 'axios'

// const token = localStorage.token

const axiosInstance = axios.create({
baseURL: process.env.API_BASE_URL,
withCredentials: true
// headers: { 'X-localization': 'es' }
})

Vue.prototype.$axios = axiosInstance

export { axiosInstance }

LoginPage.vue

<script> import { mapActions, mapGetters } from 'vuex' import dialogAlert from 'components/dialogs/DialogAlert' import qDialog from '../../components/dialogs/QDialog' export default { name: 'LoginPage', props: [], components: { dialogAlert }, created () { this.$store.commit('menus/SET_SECTION_TITLE', 'login_here') }, mounted () { }, data: () => ({ loading: false, isPwd: true, email: '', password: '', accept: false, rules: { required: v => !!v || 'Required field.', counter_min_3: v => v.length >= 3 || 'Minimum 3 Characters for this field', counter_min_8: v => v.length >= 8 || 'Minimum 8 Characters for this field', counter_max_30: v => v.length <= 30 || 'maximum 30 characters for this field', characters_valid: v => /^[a-zA-Z0-9ñÑáéíóú_ -]+$/.test(v) || 'Invalid characters..!!', characters_numeric: v => /^[0-9+()_ -]+$/.test(v) || 'Only numerical characters..!!', email: v => /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(v) || 'Email no válido' } }), computed: { ...mapGetters({ userDetailsData: 'auth/getUser', notifyTimeout: 'menus/getNotifyTimeout' }) }, methods: { ...mapActions({ login: 'auth/login' }), async onSubmit () { this.loading = true if (this.$refs.loginForm.validate()) { const data = { email: this.email, password: this.password } await this.login(data) .then(() => { this.loading = false // this.$store.dispatch('auth/me') this.$router.replace('/establishments') this.$q.notify({ type: 'positive', group: false, position: 'top', timeout: this.notifyTimeout, icon: 'mdi-account', message: 'Bienvenido a la consola de administración.' }) }) .catch(error => { console.log('=== ERROR DESDE FORM ===') console.log(error) this.loading = false this.$q.dialog({ component: qDialog, parent: this, // becomes child of this Vue node Icon: 'mdi-alert-circle-outline', IconColor: 'negative', Title: 'Alerta..!', Subtitle: 'Los datos introducidos no son correctos.!', Message: 'Revisa tus datos e intenta nuevamente.', MessageAdd: '', BtnLabelOk: 'ACEPTAR', BtnOkColor: 'light-blue-14', Active: true }) }) } }, onReset () { this.email = null this.password = null this.accept = false } } } </script>

[kurtsk]

Hello, I found a solution after a while, just update axios from version 1.6.0 to 1.7.2 and add the following in the axios configuration:

withXSRFToken: true

With that, everything returned to normal and error 419 disappeared.

Thank you again for your prompt response, I hope this helps.