jQuery cross-domain AJAX request works on one page, but not another

Question

Here's a weird situation I can't figure out.

I'm making a cross-domain AJAX request on my site, from its http domain to its https one. I'm doing this via buttons on two different pages. On one page, the request works fine, and I can see from Firebug that my session cookies are sent across to the server properly. On the other page - under the same domain and URL structure - no cookies are sent.

E.g. working from http://www.example.com/en/apples
But not working from http://www.example.com/en/oranges

The code is as follows:

var ajaxUrl = "https://www.example.com/en/controller/add/bananas/";

jQuery.ajax({
    type: "GET",
    url: ajaxUrl,
    xhrFields: {
         withCredentials: true
    },
    crossDomain: true,
    success: function(data) {
      console.log("Yay");
    }
  }
);

My https site responds with:

Header add Access-Control-Allow-Origin      "http://www.example.com"
Header add Access-Control-Allow-Credentials "true"

I know it works because it works on /apples but the exact same code doesn't work on /oranges! What's going on here?

you cant make a `https` request from a `http` page. I doubt even how your first case is working — Kuldeep Dangi, Apr 15 '15 at 06:07
There are ways to make http ajax call an https page. First, are you sure the origin headers are the same for `/apples` and `/oranges`? Can you inspect with Chrome or FF please. — Drakes, Apr 15 '15 at 06:12
@Drakes The headers are definitely all the same, except for the `Referer` which is different as you'd expect. And the `/oranges` page isn't sending a `Cookie` header with the request (which is the issue). — WackGet, Apr 15 '15 at 13:32

score 1 · Accepted Answer · edited May 23 '17 at 12:14

Still not sure why it was working on one page but not another, however I fixed it by adding more headers to the HTTPS server via Apache's conf.d file:

<IfModule mod_headers.c>
    Header add Access-Control-Allow-Origin      "http://www.example.com"
    Header add Access-Control-Allow-Credentials "true"
    Header add Access-Control-Allow-Methods     "GET, POST"
    Header add Access-Control-Allow-Headers     "Content-Type, Authorization, X-Requested-With"
    Header add Access-Control-Max-Age           "1000"
</IfModule>

Both pages now work.

Also check:
• Why is jquery's .ajax() method not sending my session cookie?
• How do I send a cross-domain POST request via JavaScript?

jQuery cross-domain AJAX request works on one page, but not another

1 Answers1