↓ こちらは参考になりませんか？
1Like
【Laravel】ログイン時にステータスコード419ページに遷移される
解決したいこと
419ステータスコードを解消してログインしたい。
ログイン時に419ステータスコードが表示されます。
ログイン認証にはBreezeを使用しています.
解決方法を教えて下さい。
開発環境
Laravel 9.52.16
vue.js 3.2.41
inertia.js
発生している問題・エラー
throw new TokenMismatchException('CSRF token mismatch.');
該当するコード
Login.vue
<script setup>
import Checkbox from '@/Components/Checkbox.vue';
import GuestLayout from '@/Layouts/GuestLayout.vue';
import InputError from '@/Components/InputError.vue';
import InputLabel from '@/Components/InputLabel.vue';
import PrimaryButton from '@/Components/PrimaryButton.vue';
import TextInput from '@/Components/TextInput.vue';
import { Head, Link, useForm } from '@inertiajs/vue3';
defineProps({
canResetPassword: Boolean,
status: String,
});
const form = useForm({
email: '',
password: '',
remember: false,
});
const submit = () => {
form.post(route('login'), {
onFinish: () => form.reset('password'),
});
};
</script>
<template>
<GuestLayout>
<Head title="Log in" />
<div v-if="status" class="mb-4 font-medium text-sm text-green-600">
{{ status }}
</div>
<form @submit.prevent="submit">
<div>
<InputLabel for="email" value="Email" />
<TextInput
id="email"
type="email"
class="mt-1 block w-full"
v-model="form.email"
required
autofocus
autocomplete="username"
/>
<InputError class="mt-2" :message="form.errors.email" />
</div>
<div class="mt-4">
<InputLabel for="password" value="Password" />
<TextInput
id="password"
type="password"
class="mt-1 block w-full"
v-model="form.password"
required
autocomplete="current-password"
/>
<InputError class="mt-2" :message="form.errors.password" />
</div>
<div class="block mt-4">
<label class="flex items-center">
<Checkbox name="remember" v-model:checked="form.remember" />
<span class="ml-2 text-sm text-gray-600">Remember me</span>
</label>
</div>
<div class="flex items-center justify-end mt-4">
<Link
v-if="canResetPassword"
:href="route('password.request')"
class="underline text-sm text-gray-600 hover:text-gray-900 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
>
Forgot your password?
</Link>
<PrimaryButton class="ml-4" :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
Log in
</PrimaryButton>
</div>
</form>
</GuestLayout>
</template>
自分で試したこと
キャッシュのクリア
以下のコマンドを実施
php artisan config:cache
php artisan config:clear
php artisan cache:clear
php artisan route:cache
php artisan route:clear
0
2Answer
Comments
@2024_Hello_World
Questionerご回答ありがとうございます！
127.0.0.1:8000でアクセスしていたところをlocalhost:8000でアクセスしたところログインすることができました！
「http 419」をキーワードにググると参考になりそうな記事が多々ヒットしますが、やってみましたか？
例えば下記。ググれば他にも多々ヒットしますので自分でも調べてみてください。
419 Page Expired
https://http.dev/419
それによると、
"HTTP response status code 419 Page Expired is an unofficial client error that is Laravel-specific and returned by the server to indicate that the Cross-Site Request Forgery (CSRF) validation has failed."
"The 419 Page Expired error created by the Laravel PHP Framework message is received when the CSRF validation fails. This implies that CSRF protection is turned on; it is enabled by default for all HTTP methods POST, PUT, PATCH, and DELETE requests."
ということだそうです。心当たりはありませんか？ 質問に書いてあるエラーメッセージ、
throw new TokenMismatchException('CSRF token mismatch.');
・・・もそう言っているようです。
解決するには Laravel の CSRF 対策がどのような仕組みになっているかの知識が必要かもしれませんね。自分はそのあたりは全く知らないのでこれ以上はお役に立てないです。
【追記】
「Laravel csrf」でググってみると以下のような記事がヒットしますが、そこに書いてるあように "formタグを使用する際には以下のように@csrfの記述が必須" ということでは？
[Laravel] CSRF対策について
https://qiita.com/Sushi29/items/9fe0706a9693aac2e73c
質問に書いてあるコードには @csrf は無いようです。
Laravel は触ったこともない自分でもググればここまで分かるんだから、質問者さんも質問する前にググって調べませんか？
1Like
Comments
@2024_Hello_World
Questioner127.0.0.1:8000でアクセスしていたところをlocalhost:8000でアクセスしたところログインすることができました。
これがCSRFと関係があるのかはわかりませんが、いったん問題は解決しました。
ご回答いただきありがとうございました！