expressjs/session

Express session not storing cookies on ios browser, but works fine on andriod except safari

Tosinkoa opened this issue · 13 comments

Tosinkoa commented

I have been facing this issue for weeks now, am trying to login to my app on IOS device, it turns out that express-session did not store cookies in the browser, for this reason, I was unable to login. But I was able to login on my android device and laptop. But am still unable to access the app on safari on my android device.

My frontend stack is Nextjs, and Nodejs with express for my backend.
Backend was deployed on heroku and frontend was deployed on netlify

Pls how do I solve this problem. Here is what my code looks like.

============================Server.js=====================================

import express from "express"
import rootRoute from "./src/root_Route.js"
import cookieParser from "cookie-parser"
import passport from "passport"
import connectPgSimple from "connect-pg-simple"
import session from "express-session"
import dotenv from "dotenv"
import cors from "cors"
import "./src/LIB/DB-Client.js"
import "./src/PASSPORT_STRATEGY/google-auth-strategy.js"
import "./src/PASSPORT_STRATEGY/facebook-auth-strategy.js"
import { scheduleJob } from "node-schedule"
import pool from "./src/LIB/DB-Client.js"
dotenv.config()
const app = express()


const connection = process.env.PRODUCTION !== "production" ? process.env.DEV_DATABASE_URL : process.env.DATABASE_URL

app.use(
  cors({
    origin: ["http://localhost:3000", "https://nairaonly-frontend.netlify.app"],
    credentials: true,
    methods: "GET, PUT, POST, DELETE",
    optionsSuccessStatus: 200,
  })
)
const PgStore = connectPgSimple(session)
const store = new PgStore({ conString: connection, schemaName: "hidden", createTableIfMissing: true })

app.use(express.json())
app.use(cookieParser())
app.set("trust proxy", 1)

app.use(
  session({
    store: store,
    secret: process.env.SESSION_SECRET,
    saveUninitialized: false,
    resave: true,
    proxy: true,
    cookie: {
      maxAge: 1000 * 60 * 60 * 24,
      httpOnly: true,
      sameSite: process.env.NODE_ENV === "production" ? 'none' : 'lax',
      secure: process.env.NODE_ENV === "production" ? true : false,
    },
  })
)

app.get("/", (req, res) => {
  res.send("API Running...")
})

app.use(passport.initialize())
app.use(passport.session())
rootRoute(app)

const PORT = process.env.PORT || 4000

app.listen(PORT, (req, res) => console.log(`Server running on PORT:${PORT}...`))
hmarcelodn-ae commented

I can reproduce the same issue with IOS and not with Android. Any clue @Tosinkoa ?

lucaperullo commented

I have the same Issue, cookies are not stored on ios devices

supersnager commented

@Tosinkoa Probably your frontend is loaded from another domain than the backend, so the browser treats the cookie as a third-party cookie.

  • 👍3
Tosinkoa commented

@Tosinkoa Probably your frontend is loaded from another domain than the backend, so the browser treats the cookie as a third-party cookie.

Yes you're right
I've solve this a while ago, thanks

igorSimash commented

@Tosinkoa Probably your frontend is loaded from another domain than the backend, so the browser treats the cookie as a third-party cookie.

Yes you're right I've solve this a while ago, thanks

Hello!
How did you solve this?

SKL-Tooyen commented

I have the same Issue
IPhone IOS is some device

app.use(
        session({
          store: new RedisStore({ client: redis, prefix: 'session:' }),
          secret: 'secret',
          saveUninitialized: false,
          resave: false,
          cookie: {
            maxAge: ms('5m'),
            signed: true,
          },
        }),
      );

app.use(
        cors({
          origin: true,
          credentials: true,
        }),
      );

@Tosinkoa
How did you solve this?

Pr3c10us commented

Please how do I solve it

Tosinkoa commented

Your Frontend and Backend needs to point to same DNS. You should get a domain name and setup the DNS

Pr3c10us commented

Your Frontend and Backend needs to point to same DNS. You should get a domain name and setup the DNS

Any idea where I can can get free or cheap domain

Tosinkoa commented

Your Frontend and Backend needs to point to same DNS. You should get a domain name and setup the DNS

Any idea where I can can get free or cheap domain

Namecheap, you can also search for promo code before making a purchase.

ndegealbert commented

Your Frontend and Backend needs to point to same DNS. You should get a domain name and setup the DNS

@Tosinkoa Any other way to resolve the issue apart from pointing to same DNS

Tosinkoa commented

Your Frontend and Backend needs to point to same DNS. You should get a domain name and setup the DNS

@Tosinkoa Any other way to resolve the issue apart from pointing to same DNS

You should also make sure you configure your cors properly.

ndegealbert commented