I'm using jQuery's ajax call to make CORS request and its working if i set
var headers = {};
But since the content that i'm trying to get is rather big, i would like to send range headers.
(this is all tested and working in same domain)
So, when i do this:
var headers = {"Range":"bytes=" + start + "-" + end};
$.ajax({
url:url,
type:type,
headers:headers,
dataType:dataType,
success:function (data, status, jqXHR) {
//
}, error:function (data, status, jqXHR) {
//
}
});
To our other domain, request gets canceled in latest chrome, and FF.
If i turn off headers, everything works, but then i get megabytes of data, and browser cant handle/parse that amount of data.
Here are headers from server (i control this, so i can edit it)
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: OPTIONS, GET, POST
Access-Control-Allow-Headers: Content-Type, Authorization, Accept, Range, Origin
Access-Control-Expose-Headers: Content-Range
Access-Control-Max-Age: 3600
Did i do something wrong, or sending range request over CORS is not yet implemented properly in latest browsers?
(Side note, also chrome is not returning headers even if i allow them in Expose-Headers, but that is known bug on chromium mailing list, but i can make one get request first to find out file size)
I had similar problem while working on my last project. Here is what I did:
1) on server side handle OPTIONS request returning Access-Control headers like:
Access-Control-Allow-Origin: * Access-Control-Allow-Methods: POST, OPTIONS Access-Control-Max-Age: 1000 Access-Control-Allow-Headers: Origin, Content-Type, Accept
2) on server handle POST method and add header
Access-Control-Allow-Origin: *
3) in javascript:
jQuery.ajax({ url: gate, type: "POST", data: JSON.stringify(post_data), contentType: "application/json; charset=UTF-8", crossDomain: true, success: function(data){ // }, });
Hope it will help
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With