Cross Domain Post Request Is Not Sending Cookie Ajax Jquery

Cross domain POST request is not sending cookie Ajax Jquery

You cannot set or read cookies on CORS requests through JavaScript. Although CORS allows cross-origin requests, the cookies are still subject to the browser's same-origin policy, which means only pages from the same origin can read/write the cookie. withCredentials only means that any cookies set by the remote host are sent to that remote host. You will have to set the cookie from the remote server by using the Set-Cookie header.

Cookies are not set from Cross domain AJAX request

Set the withCredentials

...
method : "POST",
xhrFields: {
    withCredentials: true
},
...

Why is jQuery's .ajax() method not sending my session cookie?

AJAX calls only send Cookies if the url you're calling is on the same domain as your calling script.

This may be a Cross Domain Problem.

Maybe you tried to call a url from www.domain-a.com while your calling script was on www.domain-b.com (In other words: You made a Cross Domain Call in which case the browser won't sent any cookies to protect your privacy).

In this case your options are:

• Write a small proxy which resides on domain-b and forwards your requests to domain-a. Your browser will allow you to call the proxy because it's on the same server as the calling script.
  This proxy then can be configured by you to accept a cookie name and value parameter which it can send to domain-a. But for this to work you need to know the cookie's name and value your server on domain-a wants for authentication.
• If you're fetching JSON objects try to use a JSONP request instead. jQuery supports these. But you need to alter your service on domain-a so that it returns valid JSONP responds.

Glad if that helped even a little bit.

AJAX request not sending cookies (NET 5)

I quite like the style of what you are doing here in terms of an SPA getting cookies from an API. Some recommendations below, based on experience at dealing with these issues.

PROBLEM

You are calling from the browser to an API in a different domain, meaning the cookie is third party and modern browsers will drop it aggressively.

• Web Origin: localhost:44316
• API Domain: myazurewebapp.com

SameSite=None is the theoretical solution from standards docs but these often do not explain current browser behaviour:

• You have to set the Secure property, as Jason Pan says
• But it will still not work in the Safari browser and maybe some others
• Expect cross site cookies to be dropped in all browsers in the near future

SOLUTION

The preferred option is to design hosting domains so that only first party cookies are used, and many software companies have done this. It can be done by running the API in a child or sibling domain of the web origin:

• Web Origin: www.example.com
• API Domain: api.example.com

On a developer PC you can do this simply by updating your hosts file. Note also that you can run web and API components on different ports and they will remain same site:

127.0.0.1 localhost www.example.com api.example.com
:1        localhost

The browser will then still be making CORS requests, but will consider the cookie issued by the API to be in the same site as the web origin. You can then also change the cookie settings to use SameSite=strict, for best security.

FURTHER INFO

At Curity we have published some recent articles on web security that are closely related to your question, since secure cookies used in OpenID Connect security have also had to deal with dropped cookie problems:

• Code
• Articles

CORS request - why are the cookies not sent?

The issue was with the jQuery calls - it seems since 1.5 withCredentials should be specified as:

        $.ajax("http://localhost:3000/users/current", {
            type: "GET",
            contentType: "application/json; charset=utf-8",
            success: function(data, status, xhr) {
                hideAllContent();
                $("#sign_out_menu_item").show();
                $("#sign_in_menu_item").hide();
                $("#welcome").text("Welcome " + data["username"] + "!");
                $("#welcome").show();
            },
            xhrFields: {
                withCredentials: true
            },
            crossDomain: true
        });

Including Cookies on a AJAX Request for Cross Domain Request Using Pure Javascript

Here is an XMLHttpRequest() example that i have used for CORS with cookie credentials successfully in Chrome, FF 3.5+, Safari 4+, IE10+. If this does not work, it is probably something wrong with server configuration or browser compatibility.

// GET request
var xhr = new XMLHttpRequest();
xhr.open("GET", url, true);
xhr.responseType = 'application/json';
xhr.processData = false;
xhr.contentType = false;
xhr.onload = function() {
    // Successful request
    if (xhr.status == 200) {
        success(xhr.response);
    }
};
xhr.onerror = function() {
    // Crossdomain request denied
    if (xhr.status === 0) {
        corsFailed(xhr.response);
    }
};
xhr.crossDomain = true;
xhr.withCredentials = true;
xhr.send();

I know that safari and IE10+ require the user to allow third party cookies in their browser preferences. I don't think there is any way around this without using custom headers in place of cookies and setting the Access-Control-Allow-Headers on the server to include the custom headers. Also I believe you need Access-Control-Allow-Headers: "Content-Type".

To go back as far as IE8/9, you would need to implement a fallback to XDomainRequest(), but those do not support cookie credentials.

The processData and contentType flags may only be necessary for POST requests. I use FormData() objects when doing POSTs, not JSON.

---

Related Topics