9

I'm trying to get an AJAX request working between my browser and an Apache server(residing in a different domain) using CORS.

At the server side, I've made the following changes in the httpd.conf section of the server as per the responses in "Header set Access-Control-Allow-Origin in .htaccess doesn't work":

Header add Access-Control-Allow-Origin "*"
Header add Access-Control-Allow-Headers "origin, x-requested-with, content-type"
Header add Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

My AJAX call is of the form:

        $.ajax({
            url        :'https://x.x.x.x/validateCustomerID',
            type       : 'POST',
            cache    : false,
            crossDomain: true,
            contentType: 'application/json',
            beforeSend: function(xhr){
                    xhr.setRequestHeader("Access-Control-Allow-Methods","POST");
                    xhr.setRequestHeader("Access-Control-Allow-Headers","X-Requested-With");
                    xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
            },
            data       : {loginId : '12345'},
            success    : function(response){console.log("Success"+JSON.stringify(response))},
            error      : function(response){console.log("Error"+JSON.stringify(response))}
        });
    }

I've also tried commenting out the beforeSend() in order to avoid a preflight request but it wasn't successful either.

The error messages that I receive on Chrome and Firefox are:

  • In Chrome:

"XMLHttpRequest cannot load https://x.x.x.x/validateCustomerID. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 403."

  • In Firefox:

"Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://x.x.x.x/validateCustomerID. (Reason: CORS request failed)."

There are no response headers received from the server in my browser which I think are mandatory for CORS to work and also logs in the server shows no request reaching it from my browser.

I would really appreciate if someone here can help me resolve this issue as I'm stuck here for quite a few days now and have used almost all hit and trial methods to make this thing work.

Community
  • 1
  • 1
Yash Kapila
  • 261
  • 7
  • 17
  • Did you activate the apache module headers `a2enmod headers`? – Jacob Lauritzen Oct 16 '15 at 10:32
  • Why are you trying to set Access-Control headers in the **request**? – Quentin Oct 16 '15 at 10:33
  • @Jacob, I tried activating apache module headers using a2enmod headers command but it gave me an error that it was an invalid command. I then read somewhere that Mod_headers is enabled by default in Apache so I left it as it is. Could that be a problem? – Yash Kapila Oct 16 '15 at 10:39
  • @Quentin: I read it somewhere where it was suggested to try set the headers in the request itself so I gave it a try. Like I've mentioned in my question itself, I've been stuck at this for a few days now and have been trying out any suggestion that I could find. But then I've also tried removing the request headers and it still won't work. Any suggestions? – Yash Kapila Oct 16 '15 at 10:42
  • Look at the request you are making and the response you are getting. The `403` error suggests that something is making the server unhappy and it isn't adding the CORS headers as a side effect. – Quentin Oct 16 '15 at 10:46
  • 2
    _in order to avoid a preflight request_ - you've guaranteed a preflight by setting the content type to application/json ... if the preflight is killing you, now you know why – Jaromanda X Oct 16 '15 at 10:59
  • can you check the request and response headers in your browsers developer tools? – Jaromanda X Oct 16 '15 at 10:59
  • As @JaromandaX points out it might be due to a preflight request. Does a simple GET request yield the same results? – Jacob Lauritzen Oct 16 '15 at 11:07
  • @YashKapila did you first `cd` into `/etc/apache2/mods-available` ? You could take a look at [this](http://stackoverflow.com/questions/10185717/internal-server-error-htaccess) Stack Overflow question and see if it helps you. – Jacob Lauritzen Oct 16 '15 at 11:09

1 Answers1

2

This is my setup in site.conf that works in production now with apache2

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Headers "authorization, origin, user-token, x-requested-with, content-type"
Header set Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

for a future reference I strongly suggest to bookmark this site http://enable-cors.org/index.html

maurycy
  • 8,455
  • 1
  • 27
  • 44
  • I actually went through the same link while setting my Apache settings. However, at the last point where we need to execute 'a2enmod headers', I got an error saying that this is an invalid command. I didn't try it any further as it was written just above it that it mod_headers were enabled by default in Apache. – Yash Kapila Oct 16 '15 at 10:44
  • The error you have in your question indicates that the headers were not actually added to the response, have you restarted apache? are you using apache2? – maurycy Oct 16 '15 at 10:46