Return to homepage

Vue Authentication

03/12. Fresh project with Vue CLI

Comments

Reza

Hi Alex, would you maybe consider adding information about how to refresh tokens with axios interceptors (for instance)?

  • 1
Gregor

Hi Alex,

how to prevent token auto refresh or auto logout? I'm dealing with issue that I'm being automatically logged out after certain time, even if I'm doing something on web app.

  • 0
Shahmir

Kindly add functionality of auto-refresh of JWT Token, when token is expired.

  • 2
Bojan

Hey Alex,

What is the reason you are using JWT vs Laravel Passport? Looking forward to your answer.

  • 2
Kunal

I would like to know this too

  • 0
Pirvan

how to download this videos for offline

  • 1
Alex

Hey Pirvan, you can download the videos for offline by clicking the icon within each part. Perhaps we should make that clearer.

  • 0
Siegfried

Hi Alex,

great tutorial!

But I've a question: What if the token expires? How do I notify and/or redirect the user back to the home page? I'm struggling with this with my own application.

  • 2
Miro

Isn't it a big no-no to store the JWT token on localStorage/sessionStorage since it's accessible by javascript and by extension to any attacker that can compromise the site via an XSS attack therefore compromising all tokens for every user? Shouldn't it be stored in an httpOnly cookie so the server sends it and can still see it, but the client-side javascript has no knowledge of it?

  • 8
Miro

Also if a client has a nefarious browser extension they could also grab the token and pretend to be the authorized user and do real damage.

  • 0
Alex

You're right about the XSS attack possibility, so you'd need to take steps to make sure that possibility is limited as much as possible. In my opinion it's fine to store them there though, it's not a categorical no.

  • 0
Alex

I will update the course to include appropriate cookie storage anyway.

  • 0
Miro

Thanks for responding! You might be correct in that one should take time to harden their site against XSS. Although mistakes do happen and I could argue that it would be an easier fix to limit the authentication to an httpOnly cookie.

I haven't tested this, but my theory is that one could serve the static files from the apex domain, and the backend through an subdomain (api.website.com). The static Vue.js login process just sends the request to the api which returns the httpOnly cookie and a body of true/false. This way the session would persist on the subdomain level and the Vue.js client knows to hide the login view and continue fetching the user data. Benefit of this is that Vue.js doesn't handle authentication in any way, besides sending the data forward. Tokens and all that would be handled by the browser.

Edit: I don't mean to shove 💩 on your face, but to improve the security aspect for everyone. Here's some who arguably know security better than any of us: https://auth0.com/docs/security/store-tokens#don-t-store-tokens-in-local-storage

  • 0
Kelly Joseph

I watched this entire course and I wanted to implement the same thing while using httpOnly cookie(s) but I am stuck here https://stackoverflow.com/questions/58710013/httponly-cookie-not-being-set-stored-laravel-vue. Could you help?

  • 0
Alex

Agree 100% and appreciate the feedback. I'll definitely get the course updated.

  • 0
Richard

Cookie storage option would be great, since I've seen many warnings against storing JWT's in the browser's local storage.

  • 0
David

Any idea when the Http ONLY cookie update will be here :(

  • 0
Aspex

Also looking forward getting the alternative solution for handling the "session" via the httpOnly cookie or similar. Any estimate when it might be available?

  • 0
Feras

thank you alex :)

  • 1
Marcel

Thanks for the course, starting from 11'43" in video 2 I get token:true in the response ? Did I forgot something ?

  • 0
Marcel

Never mind, I didn't set up the
'defaults' => [ 'guard' => 'web',

to

'defaults' => [ 'guard' => 'api',

  • 0
Alex

Glad you sorted it!

  • 0
Angelo

Nice refresh Alex, Thank you!

Any chance to cover two-factor authentication with JWT?

  • 4
Alex

It's recorded and ready to go, and will be released shortly.

  • 0
Angelo

That's a good news. THANK YOU!

  • 0
iain

Hi Alex

I just checked out this series again and the index suggested that this course had been updated 6 minutes ago. I was very pleased as I thought this meant that the httpOnly cookie video and/or the 2FA video was available. However, when I looked at the list of videos in the series, there are still 12 so I'm not sure if you've uploaded the new material but maybe forgotten to enable something to expose them for viewing.

I hate to appear to nag about this as I'm sure you have plenty to keep you out of mischief!

Iain

  • 0
Alex

Hey Iain, you might have seen the incorrect timestamp through search (needs fixing).

The 2FA course is already released though, here's the link:

https://codecourse.com/courses/vue-two-factor-authentication

  • 0
iain

Ah, I see Alex - thank you.

I also looked into the Kelly's post and the stack overflow to which he referred (https://stackoverflow.com/questions/58710013/httponly-cookie-not-being-set-stored-laravel-vue). The post there is very detailed and Kelly reports what he had to do to get it working as required. I haven't got as far as implementing the front end yet as I'm working my way through your API course. When I have completed this, I will make a start on the front and hope that I can get the HttpOnly cookie working as required. From what I have read, this is the safest way to protect the token ... until someone finds a way around it!

Iain

  • 0