I am storing a token after login in localStorage and using it to make api requests. On safari I am facing an issue that once I login and redirect to the home page, after that If I go to any other route ex /user safari is clearing a token stored in local storage and thus I am getting logged out. It is a Vue web app and I am using the Vue router for navigation.
Can anyone please suggest something
Thanks in advance
Related
In my react app i added a button that redirects to the login page url. In my backend login page i used passport.js to make discord oauth and then redirect to an callback page where i have a simple rendered page who said is logged in successfuly, now he can return to the app. After that, in my frontend i added a button where it sends a axios post request with credentials and it says its unauthorized, so in few steps i need to use the same cookie from the web page i logged and need to access that from my react app.
BTW. i already use cors in my backend and i watched some tutorials but cant find a solution for that. Thanks in advice
A web page redirects to a Vue app. This Vue app has several pages and it uses Vue-router. Upon initialization of the Vue app we run some logic which is based on the referrer.
Then the user navigates between the pages of the Vue app and at some point decides to refresh the page. In this case the referrer is still the previous page (Why?) - thus the logic based on the referrer executes again. And this is problematic and shouldn't happen.
So - how can I get rid of this referrer after the SPA loads? Or eventually when user navigates inside the SPA?
PS: This happens on Chrome and Safari and doesn't on Firefox. At least on my machine.
There is a bunch of tricks to modify referrer (How to manually set REFERER header in Javascript?)
However all of them are far from perfect. That's because referrer is one of forbidden headers, which intentionally can't be modified programmatically (https://developer.mozilla.org/en-US/docs/Glossary/Forbidden_header_name)
In your case, the only idea I can think about is to put some key into localStorage or sessionStorage when you run your referer-related logic for the first time, and then prevent it from running again if this key is already stored.
I am building an app using .Net Core with VueJs along with JavascriptServices&NodeServices for ServerSideRendering, and Identity as auth mechanism.
Scenario :
I navigate to /details page - having some hidden info because the user is not logged in (so, User.Identity.Name) is null.
I click login, a pop-up shows up, I enter my credentials, and after the AJAX call is made to auth the user, I do a full refresh of the page using location.reload(true).
This works on chrome desktop but on mobile devices it doesn't; on mobile browsers it works if I "fake navigate away" meaning that I go back one page and then come back (so I don't trigger a SSR).
Does anybody have an idea why this doesn't work?
I'm currently working on an app where users are able to log in and access their data from Firebase. The app used to just be a Flask app, so I used flask_login to help keep track of user sessions.
However, I'm now trying to use Vue for the front end (including the routing), so technically we will be running a Vue app as well as a Flask app where the Vue app will be making GET requests to the Flask app. I found a tutorial for authentication in Vue. I was wondering if I needed to both this as well as flask_login. If so, how would that look like?
Really late, but since this is not answered, I will give it a go:
I would recommend going with JSON web tokens (JWT). This post probably explains it better than I ever will.
The basic flow would be:
On the [flask] backend every API call that needs protection will have a decorator (similar to #login_required) that protects the resource from being accessed by users not authenticated. For a user to be authenticated they will need to fetch from "/login" and the server will respond with a token, store this in memory. This token will need to be sent with any subsequent API call. When the user logs out, simply nullify the token on the front end.
On my setup, I used flask-jwt-extended and on vue, simply make sure that you have a token stored, if not, render a login modal or popup or redirect to the login page.
Read the post I mentioned to understand the JWT refresh flow.
As the title suggests, how to manage the user state in Firebase authentication within an SSR Nuxt.js application? The following conditions should be met after a successful login:
Users should be able to visit protected resources when navigating
between pages
Users should be able to reload browser and still be signed into the
application. They shouldn't be redirected to the login screen
Firebase's default behaviour is to persist the user's session
even after the user closes the browser. Users should not have to
login to the application again if they close their browser and reopen
it and when there is still a valid Firebase user available
I was able to solve this problem by using the following:
Express server - using axios posts to manage the login on receiving
the request save the user ID in the session and save the access token
in a cookie
Vuex - store user state so easily accessible within my Nuxt application
Nuxt server middleware - used to check the authentication status of
the user on the server. Looking for user ID in the session or the
access token in a cookie that would have been created on login
Access to the code containing a working, running example of this scenario can be found in this GitHub repository.
I have also written a more detailed blog entry regarding all the important files used in the project.