Store Value Stored In Cookies Defaulting To Store Initial Value When Redirected From An External Url
DevYemi opened this issue · 4 comments
Hello i have been trying to debug this issues for days now and right now i really need help, I'm building a fintech app where the user is redirected to an external url to add their card, when the user is done i provided a redirect url to the external source to redirect the user back to my website.
Now here is the problem after some investigation on my end, when ever the user get redirected from the external source, the token and other store values that was stored in the browser cookie and meant to be persisted all gets reset to the default value i used while setting up their initial state in their individual reduxtoolkit Slice. so by the time the user gets redirected back to my website, token would have had its value reset to "null" which was the default value i set in my authSlice, prompting the user to login again
This is my full package.json file
{
"name": "more360-web",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"test": "jest --watch",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@ant-design/icons": "^4.7.0",
"@mapbox/mapbox-gl-geocoder": "^5.0.1",
"@reduxjs/toolkit": "^1.8.1",
"@tailwindcss/line-clamp": "^0.4.0",
"@tanem/react-nprogress": "^5.0.10",
"antd": "^4.20.2",
"axios": "^0.27.2",
"gsap": "^3.10.4",
"jest-environment-jsdom": "^28.0.2",
"mapbox-gl": "^2.8.2",
"moment": "^2.29.4",
"next": "12.1.6",
"next-axiom": "^0.14.0",
"next-plugin-antd-less": "^1.8.0",
"next-redux-cookie-wrapper": "^2.2.1",
"next-redux-wrapper": "^8.0.0-rc.1",
"react": "18.1.0",
"react-animate-height": "^2.1.2",
"react-dom": "18.1.0",
"react-redux": "^8.0.2",
"react-reveal": "^1.2.2",
"react-scroll-to-top": "^1.0.8",
"react-toastify": "^9.0.5",
"uuid": "^8.3.2"
},
"devDependencies": {
"@tailwindcss/forms": "^0.5.2",
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^13.1.1",
"autoprefixer": "^10.4.7",
"babel-plugin-import": "^1.13.5",
"eslint": "8.14.0",
"eslint-config-next": "12.1.6",
"jest": "^28.0.3",
"postcss": "^8.4.13",
"tailwindcss": "^3.0.24"
}
}
The App was hosted on vercel tho
PC spec
Hp elite book window 10
Wild guess: Is the cookie's Same-Site attribute set to Strict? In that case, setting it to Lax should fix the issue.
Thank you for responding, I'm sorry I'm still very new to the cookie topic, where do i set the cookie Same-site attribute ?, is it something i can implement in a NextJs middleware function that runs on all request ?
You can specify Same-Site when you set a cookie. In next-redux-cookie-wrapper it's a subtree config option. You can set it for all subtrees, if desired:
{ sameSite: "lax", subtrees: [ ... ] }Thank you very much, i have been able to fix my issue with this. i will close the issue now