Cross call working with Post but failing with pre-flight

Question

I have to make web service call from my websites to thirdparty domain/server. While I am making this call using jQuery Ajax by Post method with content-type:text/plain and it is working fine.

But while I am changing it to content-type: text/xml it is throwing:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Even it set on thirdparty server to allow access to our website. And we are getting this header while making call with content-type:text/plain.

We have also added following on Thirdparty server.

Access-Control-Allow-Methods : Get , Post , Options ,PUT

Access-Control-Allow-Headers: Authorization,origin, content-type, accept

Please let me know what could be the reason that pre-flight request is not getting 'Access-Control-Allow-Origin' in response?

Answer 1

The reason your script is working for text/plain is because it is a simple request. If you look at this answer, you can see that your text/plain request fits the requirements for a simple request. However, when you change the content-type to text/xml it changes it to a "non-simple" request.

In order to make your "non-simple" request work, you will need to look at how to make a pre-flight request. This website explains how you can do that under "Handling a not-so-simple request".

Update

Just a Note: The Access-Control-Allow-Methods is cast sensitive (all uppercase), and you do not need to list any methods used for a simple request (GET, HEAD, POST). - source

Access-Control-Allow-Methods: OPTIONS, PUT
Access-Control-Allow-Headers: Authorization, Origin, Content-Type, Accept

Firefox doesn't include an Origin header on same-origin requests. But Chrome and Safari include an Origin header on same-origin POST/PUT/DELETE requests (same-origin GET requests will not have an Origin header).

Is there a possibility that the origin is the same?

Could there be an issue with your caching?

Make sure you have these settings for your jquery ajax call:

crossDomain: true // Will force a cross domain request
cache: false

Answer 2

The difference between content-type:text/plain and content-type: text/xml is: "text/xml" requires "preflight" but "text/plain" does not.

From MDN:

In particular, a request is preflighted if:

It uses methods other than GET, HEAD or POST. Also, if POST is used to send request data with a Content-Type other than application/x-www-form-urlencoded, multipart/form-data, or text/plain, e.g. if the POST request sends an XML payload to the server using application/xml or text/xml, then the request is preflighted.

Some potential reasons those can cause the fail of a preflight request:

1. CORS is not enabled by server. Search how to enable CORS for your server technology.
2. Server does not consume a request other than "text/plain". For example; Spring has a consume option that defines which content-type is acceptable.
3. There is an "Authorization" header in your post. If you are sending requests with credentials, you should add Access-Control-Allow-Credentials: true header also. Again from MDN.