I have a page loading up in MobileSafari which municated with another server via CORS.
In desktop browsers (tested Chrome and Safari), I am able to log in, get a session cookie, and have that session cookie be sent back for subsequent requests so that I may be authenticated with all API calls.
However, when I login via Mobile Safari, the cookie does not get sent back on subsequent requests.
I'm using Charles Proxy to spy on what's going on, and it tells me:
POST .json
passes up my login info- It succeeds and response is received with a valid
Set-Cookie
header. GET .json
is requested, without aCookie
request header.- Server responds as if I am not logged in.
I'm using this snippet with Zepto.js
to ensure that the withCredentials: true
is properly setup on the XHR object. (pardon the coffeescript)
# Add withCredentials:true to the xhr object to send the remote server our cookies.
xhrFactory = $.ajaxSettings.xhr
$.ajaxSettings.xhr = ->
xhr = xhrFactory.apply(this, arguments)
xhr.withCredentials = yes
xhr
And that snippet works great in desktop browsers, and before I added it I was not able to preserve the session cookies in those desktop browsers.
Is there some quirk in MobileSafari that prevents this from working like desktop browsers? Why does it not work in the same way?
Edit!
here is my CORS headers setup in my rails 2.3 app, fairly standard stuff I believe
def add_cors_headers
if valid_cors_domain
headers['Access-Control-Allow-Origin'] = request.headers['HTTP_ORIGIN']
headers['Access-Control-Expose-Headers'] = 'ETag'
headers['Access-Control-Allow-Methods'] = 'GET, POST, PATCH, PUT, DELETE, OPTIONS, HEAD'
headers['Access-Control-Allow-Headers'] = '*,x-requested-with,Content-Type,If-Modified-Since,If-None-Match'
headers['Access-Control-Allow-Credentials'] = 'true'
headers['Access-Control-Max-Age'] = '86400'
end
end
Also today desktop Safari on Mountain Lion started not to send the cookie, behaving just like MobileSafari. I'm not entirely sure if my assessment yesterday was inaccurate, or perhaps Apple is just trolling me...
Also could this be affected by using https://
at the remote url?
I have a page loading up in MobileSafari which municated with another server via CORS.
In desktop browsers (tested Chrome and Safari), I am able to log in, get a session cookie, and have that session cookie be sent back for subsequent requests so that I may be authenticated with all API calls.
However, when I login via Mobile Safari, the cookie does not get sent back on subsequent requests.
I'm using Charles Proxy to spy on what's going on, and it tells me:
POST https://myremoteserver./sessions.json
passes up my login info- It succeeds and response is received with a valid
Set-Cookie
header. GET https://myremoteserver./checkout.json
is requested, without aCookie
request header.- Server responds as if I am not logged in.
I'm using this snippet with Zepto.js
to ensure that the withCredentials: true
is properly setup on the XHR object. (pardon the coffeescript)
# Add withCredentials:true to the xhr object to send the remote server our cookies.
xhrFactory = $.ajaxSettings.xhr
$.ajaxSettings.xhr = ->
xhr = xhrFactory.apply(this, arguments)
xhr.withCredentials = yes
xhr
And that snippet works great in desktop browsers, and before I added it I was not able to preserve the session cookies in those desktop browsers.
Is there some quirk in MobileSafari that prevents this from working like desktop browsers? Why does it not work in the same way?
Edit!
here is my CORS headers setup in my rails 2.3 app, fairly standard stuff I believe
def add_cors_headers
if valid_cors_domain
headers['Access-Control-Allow-Origin'] = request.headers['HTTP_ORIGIN']
headers['Access-Control-Expose-Headers'] = 'ETag'
headers['Access-Control-Allow-Methods'] = 'GET, POST, PATCH, PUT, DELETE, OPTIONS, HEAD'
headers['Access-Control-Allow-Headers'] = '*,x-requested-with,Content-Type,If-Modified-Since,If-None-Match'
headers['Access-Control-Allow-Credentials'] = 'true'
headers['Access-Control-Max-Age'] = '86400'
end
end
Also today desktop Safari on Mountain Lion started not to send the cookie, behaving just like MobileSafari. I'm not entirely sure if my assessment yesterday was inaccurate, or perhaps Apple is just trolling me...
Also could this be affected by using https://
at the remote url?
- Can you use test-cors to craft a CORS request to your server on mobile safari? Does it work there? – monsur Commented Jan 8, 2013 at 2:43
-
@monsur Using that tool I can make a get request to
/sessions/new
which should start a session. I see the cookie e down, and when I make a second request for the same page I can see the cookie header sent back up in Chrome, but no cookie is sent with the second request on Safari or MobileSafari. – Alex Wayne Commented Jan 8, 2013 at 20:10 -
A small nit: '*' is not a valid value for the
Access-Control-Allow-Headers
response header. However that should not cause the issues you are seeing. Can you also include the Charles Proxy request/response headers for the failing request? – monsur Commented Jan 9, 2013 at 14:54 - Just ran across the following question; could this be a Safari bug? stackoverflow./questions/14256455/… – monsur Commented Jan 10, 2013 at 16:35
- Gah, I cannot seem to get Charles to play nice with SSL now, even though I think was before. This is so annoying. – Alex Wayne Commented Jan 10, 2013 at 21:54
5 Answers
Reset to default 5I believe you are experiencing what I have been seeing in my app. My issue, was caused because iOS Safari, es with a default option "Prevent Cross-Site Tracking"
enabled by default that is causing the browser to block ALL third party cookies, even cookies that are issued by your back-end server from a different domain and CORS is configured correctly.
The only solution to this problem I found was to use a proxy in production like I did in dev. I acplished this in Azure with Azure Functions and making all request go through a proxy. At that point iOS Safari did not block my cookies everything was set as expected.
I wrote about it in my blog https://medium./@omikolaj1/plete-guide-to-deploying-angular-and-asp-net-33a0976d0ec1
I don't know if this solution will work or is acceptable to you but I had the same problem with mobile Safari and a JSONP app. It seemed that Safari was not set to accept third party cookies. I went to Settings > Safari > Accept Cookies and set 'Always' and the problem evaporated. Good luck.
Can I set cookies in a response from a jsonp request?
You didn't mention whether the remote server is under a different domain or just a different subdomain. I assume is under a different domain.
As @schellsan pointed out you can't set/write cookies to a different domain even if the CORS policy allows it due the 3rd party cookies restriction on safari. It's the latest safari restriction. I guess Firefox is about to do the same.
Workarounds I'm currently evaluating:
- Use a redirect on the remote server so that when the client is redirected (the remote URL is in the browser bar) you can set the cookie
- Use a custom header
I was running into the same problem.
My setup was:
- AngularJS (Ionic) App on Server A with domain a.
- NodeJS with Passport JS as Backend on Server B with domain b.
The login with the cookie went well on every browser, except Mobile Safari on iOS. Also the change of the mobile cookie (Do not track) settings in iOS did not had any impact on the issue.
Solution was to set a CNAME DNS Record
backend.a. CNAME b.
Open an address that sets the cookie via an iFrame - this will set the cookie.