Magento 2 VSF: Customers are automatically logged out after a period of time.
Hi, I've successfully set up a Magento2 VueStorefront instance locally. Everything functions perfectly. Yet, I'm curious about altering the frontend's session expiry (Vue Storefront-specific configuration). Currently, customers are automatically logged out after a period of inactivity on the website.
6 Replies
Hey, do you mind lending me a hand?
Any help here?
Hi @radhu What is the expiry of the
vsf-customer
cookie that get's set when you log in? If this Cookie has expired VSF will log you out.
Another reason you will get logged out is if the function in plugins/token-expired.ts
does not find a Customer Token.
According to the Adobe docs, the default Customer Token lifetime is set to 1 hour.
Here is a link to the Adobe docs that may help: https://developer.adobe.com/commerce/webapi/graphql/usage/authorization-tokens/GraphQL authorization
Learn how to authorize GraphQL API calls using tokens.
@Darren R Thank you for your previous assistance. I have updated the token expiration time, but I am encountering another issue. Despite the expiration of the token and removal of the vsf-customer, the "isAuthenticated" value remains true. As a result, the top menu continues to display "Account" instead of "Login". Do you have any idea why this is happening? And if yes, could you please guide me on how to resolve this?
@radhu isAuthenticated is using the
useUser
composable. This is getting the value for the isAuthenticated
from the Pinia storecustomerStore.isLoggedIn
Clicking a logout on the front-end should run the logout
function and clear the values in the CustomerStore
.
The token-expired
plugin should also check on page refresh and reset the customerStore
I've had a look at the logic in that plugin file and it looks like it should do ths if GraphQL is no longer authorized. Can you add logging in here to see if its actually trying to run any functions?@Darren R I added a console.log in the
onMounted
function of components/AppHeader.vue
to check the value of isAuthenticated
. However, it returns true
even when vsf-customer
is removed from the cookie.
After adding the following code snippet, I believe the issue has been resolved. Could you please review and confirm if my approach is correct?
const customerStore = useCustomerStore();
if (!app.$vsf.$magento.config.state.getCustomerToken()) {
customerStore.setIsLoggedIn(false);
}
@radhu What you have added will work when you hard reload the page. However, that
onMounted
hook will not run when navigating around the site using links.
This might not be an issue for you, but if it is, you can use middleware to add that check/logout. This will run on every page change.
https://v2.nuxt.com/docs/directory-structure/middleware/Nuxt 2
Middleware directory
The middleware directory contains your application middleware. Middleware lets you define custom functions that can be run before rendering either a page or a group of pages (layout).