I was aware of the same origin policy, but am new to the concept of preflighting. Basically when making AJAX requests to cross-domains (meaning domains that are different than the one from where the JavaScript was served), the browser does a preflight check first to make sure that it is okay to make the original request.
What this means is that first it does an HTTP OPTIONS request. Along with the regular headers it will include these special ones referring to the original request
Access-Control-Request-Method: POST Access-Control-Request-Headers: X-PINGOTHER
The server can then look at these headers and response if the request is allowed:
This response says to allow the POST with the header X-PINGOTHER only from the http://foo.example origin.
Access-Control-Allow-Origin: http://foo.example Access-Control-Allow-Methods: POST, GET, OPTIONS Access-Control-Allow-Headers: X-PINGOTHER Access-Control-Max-Age: 1728000
What I noticed is that if any extra non-standard headers are sent in the original/preflighted request that are now allowed by the server, the POST will not be sent.
More detailed information can be found here:
https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS
