2

A third-party provided a service and I access it via POST multipart/form-data. I'm using $http angular to do the call, but it's working only in Chrome. If I use IE it works fine. How can I fix / debug that in a better way? Using Advanced REST Client, I'm able to get the response as well..

Just in case it helps, here is the http call:

var fd = new FormData();
var blob = new Blob([file], {type:'text/xml'}); //just an xml file on the scope..
fd.append('xml', blob, 'myfile.xml');

$http({
    url: "https://myurl.at.third-party/mypath",
    method: 'POST',
    headers: {
        'Content-Type': 'multipart/form-data',
        'X-A-Custom-Header-They-Require': '<XMLData><User>myuser</User></XMLData>',
    },
    data: fd,
    transformRequest: angular.identity
}).then(function(response) {
    //do stuff
}, function(error) {
    //handle error
});

In IE that call works, so I believe CORS is correctly set up on server, but it's IE, so who knows right? :)

If I look on Chrome Network tab, I can see it does an OPTIONS call first, get a OK response, but then I don't see the POST or get any return.

Does anyone knows how I could proceed?

Thanks!!

Felipe S.
  • 1,633
  • 2
  • 16
  • 23
  • 1
    What error message do you get on the Console in the developer tools? If it is a CORS error, it will tell you what the problem is there. – Quentin Sep 12 '15 at 15:15
  • As said by @Quentin, look at the console tab in Chrome Dev Tools. Also, in order to help you better, can you please include your real code (with real domain name and header name): we can not check for CORS issues with invalid data. Also, you can have a look here to understand how CORS works: http://stackoverflow.com/a/25496072/827168 this may help you spot the origin of your problem – pomeh Sep 12 '15 at 15:33
  • @Quentin I get the “No 'Access-Control-Allow-Origin' header is present on the requested resource”. Because I was able to access it via IE I thought this header was coming (and in IE it appears on the response). But maybe it's not then.. I'm trying to talk to the service owner to see if it's correctly set up. – Felipe S. Sep 14 '15 at 00:49
  • @pomeh Thank you for this link! I read a lot of topics here but didn't find that one. And by reading it, this could also be the problem: the headers they are sending (probably this custom header) are not matching the ones I request. I'll take a look tomorrow and get back! – Felipe S. Sep 14 '15 at 00:51
  • Just adding some more things: When I do the call, I get a 200 from OPTIONS call, but the header seems like it's missing the headers as pointed out in the link @pomeh sent. The response headers doesn't have any "Access-Control-Allow-Headers". This could be the issue, right? – Felipe S. Sep 14 '15 at 13:50
  • @FelipeS. yes, if no `Access-Control-Allow-Headers` header is present, the CORS requirements are not satisfied and so the request cannot be done. Can you include in your question the result (response headers) of the `OPTIONS` request please ? And also **include your real code (with real domain name and header name)**, thanks – pomeh Sep 14 '15 at 20:52
  • Hi @pomeh, unfortunately I can't post the real code as it contains sensitive data from a company :( but as you pointed out the error was that it was missing the `Access-Control-Allow-Headers` AND the `Access-Control-Allow-Origin` from the server side. It worked now! thank you for the help!! Can you comment your first link as the answer so I can mark it as correct? :) thanks!! – Felipe S. Sep 15 '15 at 17:12

1 Answers1

1

As said by @Quentin, look at the console tab in Chrome Dev Tools, check Network tab and look after every single CORS-related headers value.

Also, you can have a look here to understand how CORS works: https://stackoverflow.com/a/25496072/827168 this may help you spot the origin of your problem.

Community
  • 1
  • 1
pomeh
  • 4,742
  • 4
  • 23
  • 44