You're correct in noticing that after logging out, your user information (like auth.user in the Inertia props) still appears in the HTML source of the /welcome page. This behavior can be explained and remedied.
Why Does This Happen?
When using Laravel with the Inertia.js stack (which the Vue Starter Kit does), data is passed from backend to frontend via "props" embedded in the initial page source. On logout, if your backend controller (or shared Inertia prop) still attaches the user data, it remains in the rendered HTML, even though you're technically logged out.
The typical cause is a global Inertia shared prop—frequently defined in app/Providers/AppServiceProvider.php like this:
use Inertia\Inertia;
public function boot(): void
{
Inertia::share([
'auth' => function () {
return [
'user' => auth()->user(),
];
},
]);
}
If auth()->user() returns a user (even just before logout happens), this data will persist until the next full reload or navigation, due to pre-rendered server-side HTML or Vue state not resetting instantly.
How to Fix
1. Ensure auth.user is properly null after logout
You want to make sure that, after logout, the shared Inertia prop is empty. Try modifying your Inertia shared prop like this:
use Inertia\Inertia;
public function boot(): void
{
Inertia::share([
'auth' => function () {
return [
'user' => auth()->check() ? auth()->user() : null,
];
},
]);
}
This ensures that if there's no authenticated user, the user property is null in your page HTML.
2. Redirect to prevent back navigation showing cached data
Browsers can cache rendered pages (especially with Inertia.js’ speedy nav), so after logout, always issue a full redirect to a public route, e.g.:
public function destroy(Request $request): RedirectResponse
{
Auth::guard('web')->logout();
$request->session()->invalidate();
$request->session()->regenerateToken();
return redirect('/'); // Or Inertia::location('/');
}
Using Inertia::location('/') is sometimes recommended for a full hard-refresh.
3. Front-end: Clear local/store user data (Vue/Pinia/etc) on logout
If your SPA has client-side user state, clear it on logout:
// Example for Pinia
const auth = useAuthStore()
auth.logout() // ensure this sets user to null
In summary
- After logout,
auth()->user()should be null, and not shared down to any Inertia page. - Whenever you logout, trigger a full redirect to clear any cached HTML with user data.
- Also, clear any client-side user state management (e.g., with Pinia or Vuex) on logout.
You can safely ignore user data still being visible in the HTML immediately after logout, as long as all API endpoints and protected routes properly enforce authentication. The risk is only about data "leakage" in the source, not actual authentication. Still, it's best to clear that data from your Inertia shares for peace of mind and user privacy.
Final Shared Prop Example:
Inertia::share([
'auth' => [
'user' => fn () => auth()->check() ? auth()->user() : null,
],
]);
Let me know if you need specific code changes for your project!
