I'm currently using Vue (and VueX) and Laravel Passport. I have my register page working fine, now I've moved into my Login page. All the tutorials and posts I've seen online show a login system where the generated token is stored in localStorage but I've seen also that everybody says we shouldn't store any sensitive data in localStorage, then how should I do it? How can I manage sessions if my frontend (VueX) is separated from my backend (laravel)?
It's alright to store the token in localStorage, what you need to do is set the expiry of the token for less time, let's say 2 days.
These lines should be added to AuthServiceProvider.php
Passport::tokensExpireIn(now()->addDays(2));
Passport::refreshTokensExpireIn(now()->addDays(30));
Related
I have tried so many options I could think of or find online, user details are still persisted even after successful deletion of all the tokens!
I am using Laravel sanctum with Vue. The logout function I created works as expected when I use postman to make the request, but this is not the case when I make the request via axios from the browser. The tokens gets deleted quite alright but I still can access protected routes.
I have also tried
Auth::logout()
I have continued to try this using sanctum and web as guard.
Any help will be appreciated.
I have 3 apps and those 2 are laravel apps and 1 is vuejs
I've tried setting up session to store session data in to the database so that I can have a shared sessions between my apps.
Things work between laravel apps, however, I have trouble when it comes to my vuejs app.
Btw, in order to proceed to any of my vue routes, I have to check first if token exists and is correct.
But since I am using laravel sessions now, I guess I need to check for cookie session id now?
and if so, where do I set the cookie session id?
Better use Laravel passport (OAuth) as a token generation for you Vue application.
How can I authenticate a user with sanctum when the whole login process happens server side? The question I am asking is kind of hard to phrase so I will explain my situation.
I have a Vue SPA for my front end and a Laravel app as a backend api (they run on the same domain). Normally, to authenticate with the laravel api using sanctum, you would send the credentials in a post request, and if the login was successful, you would get the session information returned. However, I want to use steam login for authentication. I already have to whole process on the backend figured out in terms of actually logging in, however I am unsure how to pass the session data back to the SPA. Currently I have a link on my site that takes the user to the login endpoint on the api, and that endpoint will have them authenticate with steam, so the entire login process is handled on the backend. Now I just need to figure out how to send the session data back to the SPA. I guess it world be similar to using sanctum with socialite.
So far I've tried usisng Sanctums Mobile Aplication Authentication. I did this by having the user log in into the laravel app using steam, then once authenticated, a access token for their account would be created, and they would get redirected back to the Vue apps call back file, with the token as a part of the query string. Then the token would be stored and . This worked, however it presented some security issues.
The token was passed back in the url, so anyone could screenshot it and use it
Anyone who obtained the token by some other method could use it.
Here is the code for what I tried: https://gist.github.com/DriedSponge/4e8549486c2bfa33e4c0b21a539bdf85
So in summary, I want the entire login process to take place on the server, but somehow at the same time authenticate the SPA. If you have any ideas on how I can make this work, please let me know. If you have any questions just leave a comment. Thanks in advance.
I'm trying to create an SPA with auth and roles.
I've been reading a lot of tutorials that explains how to do it and everyone tells the same strategy:
Save the permissions on localstorage, for example accessToken and is_admin=0|1.
So when you login the backend response fills this data.
Then the vue routing is just checking these 2 fields for granting or preventing the access.
This is so unsecure, anyone can access to develop tools and see this data and change it, just writing a random accessToken grants access on this site... and then is_admin = 1 and wala.
Okay, is difficult to KNOW this but... And every single API call checks this accessToken on the backend.
So there is something we can do to prevent this? Or if we want this "agility navigation" we can't protect 100% route navigation middleware?
One of the guides I followed:
https://scotch.io/tutorials/vue-authentication-and-route-handling-using-vue-router
On the questions section so many people is comenting this, and their response is that is a frontend demo... but how can I rely this on the backend? If I want this every navigation click will refresh the page.
A SPA will only load once. After that navigation is handled by the frontend. However the data needed for the next page is loaded using ajax from the backend. Meaning you can still validate access in the backend before exposing the data you want to protect.
I'm learning both Sails and Vue.js and making a full REST app to do that.
So far from now, I've made a multi-step sign-up page in Vue which is working fine and POST all needed informations in my different Controllers in Sails, it also creates the user.
Now, I'm working on my login page. Again, no problem to PUT informations in my Login Controller and I receive an OK (200) response which let me know the user is logged on my backend server.
Now, I would like to understand how I could keep the information the user is logged-in my server and let him access to private content on my front-end app -> securely. I have understood that Sails use Sessions (alias of cookies ?). Also in the common example on the web, people tend to use JWT which transmit a crypted JSON between the two environnement (and so desactivate the cookies ?).
So, could you please give me a semantic explanation on how I can make both app exchange securely and manage it in Vue Js. I just need some "track" to follow.
SOLUTION
For those who like me are blocked at this initial step, I resolved my problem this way.
1) My backend Sails app generates a JWT (token) on each login.
2) My frontend Vue app stores that information thanks to Vuex and set the header of each request with an Authorization parameter composed of : 'Barear ' + token.
3) All frontend resquests to any Sails controller are verified thanks to a Policy which compares the token in the header of the request with the one generated at the first step.
Now I just wonder if using built in sessions in Sails is relevant or not.