A
Alokai10mo ago
radhu

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
radhu
radhuOP10mo ago
Hey, do you mind lending me a hand? Any help here?
Darren R
Darren R10mo ago
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.
radhu
radhuOP9mo ago
@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?
Darren R
Darren R9mo ago
@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?
radhu
radhuOP9mo ago
@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); }
Darren R
Darren R9mo ago
@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).
Want results from more Discord servers?
Add your server