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

Pixelairport's avatar

Web route or api route for vue components.

Hi. I have a contact form, that is create with vue and loaded in laravel. Now I want to send the form and I need to know if my next steps are right and what would other people say.

To send the form I could use a web route. I checked vue and when i changed the X-XSRF-TOKEN in the request, it is not working anymore. So it seems I could use web routes and they are secured by laravel/vue as they are. I think X-XSRF-TOKEN is the csrf I normally use in laravel blade.

Later there will be maybe a SPA and also an option for Oauth2 to get Tokens for your app and also send mails or maybe other endpoints that will be shared.

So will it be better to start with passport for all? And then get one token for my laravel application and later I can create extra tokens or user can create their own tokens for external apps?

I just need to know if I understand everything right. Then I would switch now to passport. Or would you go with two ways? Have web routes for vue endpoints and also api routes?

0 likes
9 replies
vincent15000's avatar

The advantage to use api routes is that these routes are automatically protected by Passport or Sanctum. I would not use web routes.

If you know that there will be other endpoints shared in the future, why not anticipate and code immediately with Passport ?

It depends on what other functionalities you need to code. I don't know anything about your project ;). For example do you have some functionalities which will never be in your API ?

Pixelairport's avatar

Thx for your answer @vincent15000 ... I have web routes like imprint, about us, ... and i have a contact form. This vue form will send the data to an endpoint, which send the email. This should also be possible later with an third party app. I used passport in the past, but it is hard to understand everytime I use it. What token do I need. I have this link https://oauth2.thephpleague.com/authorization-server/which-grant/ which is helpful to find out what token I need. I think I need Client Credentials Grant. Is that right? It will generate a token in my app, but how will I use this token in vue? Because I dont want to login with vue into my own app, because it is just a vue component. How would I get an token like "bearer" and how can i use it, that noone will copy this? ... I will do some research later today about this topic. It is just hard for me to understand.

1 like
Pixelairport's avatar

@vincent15000 I need in first step only a bearer, but later users should make also tokens for their app. That is why I choos passport.

1 like
Pixelairport's avatar

@vincent15000 Ok. I thought i can only create tokens. I need also a login where people can login and get a token... i will check everything tomorrow and read a bit more of this whole topic. thx.

1 like
Pixelairport's avatar

Ok. I now use passport. Which is great to make other machines talk to my app or user has to login via oauth2. But what, if I only have some vue components in my blade files. For examle a like button? I need the user id of the current logged in user. Would it be better to use the web routes for that? Then I can use Auth::user(). The user is not loggin via oauth2. He is loggin with normal web interface in blade.

1 like

Please or to participate in this conversation.