Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

hussein_97's avatar

the best and most familiar authentication approach for laravel api and next.js (server + client)

I’m building an application where the backend is a Laravel API (running on http://localhost:8000) and the frontend is a Next.js 15 app (running on http://localhost:3000). I’m using Laravel Sanctum for authentication.

I’m unsure which approach to take: cookie-based auth or token-based auth.

Here’s what I’ve tried so far:

1- Token-based auth: I store the Sanctum token in an HttpOnly cookie so that when a user logs in via the Laravel API, the cookie is automatically included in requests from both:

  • Next.js Server Components
  • Next.js Client Components

The problem: the HttpOnly cookie isn’t shared correctly between Laravel and Next.js server components.

2- Cookie-based auth: I attempted the traditional cookie-based flow with Sanctum (sessions + CSRF), but I keep hitting 405 Method Not Allowed errors even when using the correct HTTP method for the CSRF request.

At this point, I’m really confused and spending too much time trying to make authentication work for this combination.

Question: For a setup like this (Laravel API + Next.js frontend), what is the best and most familiar authentication approach?

0 likes
6 replies
JussiMannisto's avatar

keep hitting 405 Method Not Allowed errors even when using the correct HTTP method for the CSRF request.

You're clearly not using the correct method if you get that error. Which method were you using and which endpoint were you requesting?

The easiest solution is to use Sanctum with cookie-based authentication. Even easier would be to ditch Next and use Inertia + React instead, but if you want to use Next, I'd go with Sanctum.

1 like
hussein_97's avatar

react with inertia is very bad for seo, even with inertia ssr it won't make that difference to enhanve the SEO , i decided to use next.js (client & server components). to be honest , i am really confused about authentication in this situation specially next.js can be considered full stack i tried to use token based auth but and save the sanctum token in the http-only cookie from laravel side but it doesn't show in the next.js side (not shareable) now the only option is to use cookie based auth. do i always need to use cookie based auth when deal with website not mobile api or external api to get the benefits of session? and token based auth would be more effecient for mobile api what if i have both of them mobile api and web, so i need to build both auth one for website and one for mobile api i am sorry but i am really confused and try to understand the use cases of each one

JussiMannisto's avatar

react with inertia is very bad for seo, even with inertia ssr it won't make that difference to enhanve the SEO , i decided to use next.js (client & server components)

That's completely false. If you use SSR, crawlers have all the necessary data in the initial HTML. They can crawl it without rendering the page in a browser engine, which they typically do in a separate worker queue because it's more resource-intensive.

For small sites, the difference between SSR and CSR is meaningless. For big sites, e.g. an e-commerce site with a million frequently changing product pages, SSR can help with SEO. It's not because crawlers can't index CSR pages (they can) or because the pages are penalized (they're not). It's because parsing HTML has a smaller effect on your crawl budget, which may improve the crawl rate of your site.

How are you going to make Next better from an SEO point of view if you're relying on data retrieved from a Laravel backend? It does you no good if you don't render the (initial) HTML completely server-side. It'll be WORSE than Inertia with SSR. But like I said, it's meaningless for most projects.

Regarding authentication: you can't read HttpOnly cookies in JS, and you don't have to. Cookies are automatically included in every request by the browser. I don't know what you mean by mobile API in this context. You can use sessions on a mobile browser just the same. If you have a separate mobile app that uses an API, you can issue a token after a login from your app, and use that for authentication.

hussein_97's avatar

I initially built an e-commerce application using Laravel with Inertia and React. Later, I switched to Inertia SSR to improve SEO, which provided some enhancement, but overall performance was weak. Then I migrated to Next.js, which showed better results. Using Lighthouse to measure metrics, I observed that Next.js with server-side rendering for layouts and the initial page, combined with client-side rendering for subsequent interactions, can significantly improve SEO.

For mobile applications, it is advisable to have a separate API to support cross-platform clients efficiently.

hussein_97's avatar

ChatGpt only for enhancing my language and the way to rephrase it ... english is not my navtive language

Please or to participate in this conversation.