Blueimp jQuery File Upload and HttpHandler: No File and always “OPTIONS” HttpMethod

Question

I'm struggeling getting the Blueimp jQuery File-Uploader working on MVC 3 with IIS 7.5 on Windows Server 2008 R2. I'm using an HttpHandler to handle the Upload, which get's called. But the HttpHandler never recieves a file nor the HttpMethod "POST" or "PUT", always "OPTIONS". Has anyone an idea what is gouing wrong here?

The only message I get on the fail-callback from the uploader is "error".

Here my JS:

$('#fileupload').fileupload(
{
    acceptFileTypes: /(\.|\/)(pdf)$/i,
    fail: function (e, data) {
        alert("Error: " + data.errorThrown + " Text-Status: " + data.textStatus);
        // data.jqXHR;
    },
    maxNumberOfFiles: 1
    /*add: function (e, data) {
        data.formData = [{ name: "name1", value: "1" }, { name: "name2", value: "2"}];

        data.submit();
    },
    submit: function (e, data) {
        //data.formData = [{ name: "name1", value: "1" }, { name: "name2", value: "2"}];
    }*/
}
);

Thank you very much for any help!

Answer 1

Okay adding some code did the trick:

Server-side:

        HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "http://example.net");
        HttpContext.Current.Response.AddHeader("Access-Control-Allow-Credentials", "true");

Client-side:

$('#fileupload').fileupload(
{
    xhrFields: {
        withCredentials: true
    }
}

Answer 2

When you page is served from domain1.com and you are trying to upload to domain2.com. your HTTP post request is preflighted.

your domain2.com should actually allow domain1.com to upload a file. on different server there are different mechanism to do that.

Just read about how to set "Access-Control-Allow-Origin" for your server which is IIS in this case.

for Amazon S3, its quite simple they have a policy xml which you need to update for this.