0

i put my page online on vercel hosting. I noticed i can't set cookies on safari, my page works on opera and chrome but on safari im getting 401 when im trying to login. I tried every tip i've found but nothing works. At the beggining i've had

res.cookie('AuthToken', token, {
        maxAge: 1800 * 1000,
        httpOnly: true,
        sameSite: 'none',
        secure: true,
})

and it was working on opera and chrome, then i found Safari not include COOKIE to second CORS request so i change my code to:

const token = generateAccessToken(user.toJSON())
res.setHeader('Set-Cookie',
`AuthToken=${token}; max-age=43200; httpOnly; sameSite=none; expires=Wed, 15 Mar 2023 21:17:55 GMT; secure; Domain=xxx.vercel.app`)

and it still doesnt work on safari. I tried lower-case letters and Capital letters, like SameSite=None, Secure, Max-Age. My main file server.ts looks like this:

config()
const app = express()

const mongoConnectionString = mongoDb.url
const localhost = process.env.ORIGIN

const corsOptions = {
    origin: localhost,
    credentials: true,
}

mongoose.connect(mongoConnectionString, {
    useNewUrlParser: true,
    useUnifiedTopology: true,
    useFindAndModify: false,
})

const database = mongoose.connection

database.on('error', (error) => {
    console.log(error)
})

database.once('connected', () => {
    console.log('Database Connected')
})

app.set('Access-Control-Allow-Credentials', true)
app.set('Access-Control-Allow-Origin', true)
app.use(cookieParser())
app.use(cors(corsOptions))
app.use(express.json())
app.use(userAccountRouter)
app.use(authenticateToken)
app.use(apiRoute)

The main problem here is i don't have macOs and i cant see devtools on safari, im checking if page is working on my phone. The solution is probably easy but after a few days i have enough. My friend after cloning my repo add this: res.setHeader('Set-Cookie', `AuthToken=${token}; HttpOnly; max-age: 43200; SameSite=None; Secure`) and it has started working on his safari locally, when i push this code it still doesnt work on online page. If you want more information about code etc. please type. I wanted to start looking for a job as a junior and wanted to put my code online but this is blocking me indeed.

Dawken
  • 1
  • 1
  • What is the URL of your web origin? And the URL of the endpoint that issues cookies? Make sure these share the same base domain, such as https://myproduct.com. Otherwise Safari will drop third party cookies aggressively. – Gary Archer Mar 16 '23 at 20:28
  • my domain is https://my-app-example.vercel.app, it has https:// protocol. When i login it has path /login after succeed login it navigates me to /, on safari im getting information login succeed and for a while it starting rendering my main page but instantly navigates me to /login and im getting 401. My backend paths are post /api/login and get /api/tasks. Is this possible to contact you privately? I could send you my repos and domains. – Dawken Mar 16 '23 at 21:39
  • it seems like for a safari this cookie is 1sec cookie. My page works, it's showing me information about incorrect username and password. Also i could register on safari and login in other browser. – Dawken Mar 16 '23 at 21:48
  • Ah - i think that is because of the final characters of your URL: `.app`. I have seen this before in Safari in examples of mine that used a `.local` domain. Use an official final suffix such as `.com` or `.org` and I think you will resolve your problem. There is a spec somewhere, but too late for today :) ... – Gary Archer Mar 16 '23 at 22:33
  • im going to buy domain with .pl, its popular extension in my coutry. I will share results later – Dawken Mar 16 '23 at 23:17
  • Do my backend need also other extension? My front domain now has .pl but still doesnt work. My backend stays .vercel.app. – Dawken Mar 17 '23 at 14:01
  • It works! I was doing it first time and i didnt know i could change backend url to same as frontend. Thank you so much Gary for your help, you literally saved me – Dawken Mar 17 '23 at 14:43

0 Answers0