Demo, all content is generated
Question

Login works in Chrome but not Safari, cookie never gets saved

Solved · 1152 views · asked by siddharth_r · edited

Frontend on Netlify (Bolt export), backend Express API on Railway (myapi.up.railway.app). Login sets a session cookie with SameSite=None; Secure. Chrome: fine. Safari and every iPhone: login returns 200 but the next request is 401. In Safari's storage tab the cookie isn't there.

What I’ve tried

Checked credentials: 'include' is on every fetch. CORS allows my origin with credentials. Tried SameSite=Lax, then Chrome also broke.

Comment
Different domains for frontend and API? Safari treats that cookie as third-party. lena_ops · edited

2 answers

Marked as helpful by the asker
lena_ops · edited

Your setup is correct on paper. The problem is that Safari blocks third-party cookies by default, and a cookie set by railway.app while you're on netlify.app is third-party no matter what SameSite says. Chrome is moving the same direction, so fixing it now saves you later.

Make the API same-site with the frontend:

  • Option A: custom domain for both: myapp.com for the frontend, api.myapp.com for Railway. Same site → first-party cookie. Then SameSite=Lax works too.
  • Option B: proxy the API through Netlify. In netlify.toml:
[[redirects]]
  from = "/api/*"
  to = "https://myapi.up.railway.app/:splat"
  status = 200

Now the browser only talks to your Netlify domain and no CORS is needed at all.

Comment
Did option B, 3 lines, and removed half my CORS code. Safari works. siddharth_r · edited
Option B is my default for small apps. One domain, no CORS, no third-party cookies. chidi_eze · edited
amara_v · edited

had the same with Replit backend, proxy fixed it for me too. Safari was driving me crazy for days

Comment