FineUploader CORS selectively working

Question

I have been working with FineUploader successfully, and had a requirement to save to a different subdomain - HTML code at example.com, endpoint.php at upload.example.com.

I have it working perfectly every time in Safari uploading several small files. Those same small files always upload on FireFox and Chrome on Mac (latest versions as of January 2014), but I only get success feedback selectively with FireFox and Chrome on Mac. It always has "Processing..." or a percentage "61%" although the file is on the server.

When I put the HTML code on upload.example.com, it works fine. I am using FineUploader custom build (commercial support) v4.2.2, and I have updated the backend endpoint.php for the preflight response, etc. The issue is that the POST request hangs indefinitely, no matter what the server is set to. I even created a fake JSON responder that did nothing but respond with the JSON success string.

...
else if ($method == "POST") {
    handleCorsRequest();
    header("Content-Type: text/plain");
    echo '{"success":true,"uuid":"99999a18-a6c3-456e-bd06-e492f8a290c0","uploadName":"image1.jpg"}';
}
...

I was thinking it possible that JSONP is required to read the response back, and without that FineUploader doesn't know what is going on. However, FineUploader doesn't send a callback field as far as I can tell.

Any ideas? Happy to clarify. Below is an example of the pre-flight request, response and POST that hangs indefinitely.

Ryan

REQUEST ACCORDING TO PROXY:
Referer: http://example.com/?folder=TestFolder&id=1051&jobname=Test
Cache-Control: no-cache
Connection: keep-alive
Origin: http://example.com
Accept-Language: en-US,en;q=0.8
Accept: */*
Content-Length: 51729
Host: upload.example.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/32.0.1700.77 Safari/537.36
Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryxBA8idxO6Luv7Ipc
Accept-Encoding: gzip,deflate,sdch
X-Requested-With: XMLHttpRequest

RESPONSE ACCORDING TO PROXY, RETURN CODE 200:
Date: Fri, 24 Jan 2014 19:14:38 GMT
Server: Apache
Content-Type: text/plain
Connection: Keep-Alive
MS-Author-Via: DAV
Access-Control-Allow-Origin: *
X-Powered-By: PHP/5.3.15
Content-Length: 88
Keep-Alive: timeout=15, max=99

RESPONSE TEXT ACCORDING TO PROXY:
{"success":true,"uuid":"f0365869-312b-4080-bc30-1792e24fe366","uploadName":"image1.jpg"}

POSTED DATA:
------WebKitFormBoundaryxBA8idxO6Luv7Ipc
Content-Disposition: form-data; name="qquuid"

f0365869-312b-4080-bc30-1792e24fe366
------WebKitFormBoundaryxBA8idxO6Luv7Ipc
Content-Disposition: form-data; name="qqfilename"

image1.jpg
------WebKitFormBoundaryxBA8idxO6Luv7Ipc
Content-Disposition: form-data; name="qqtotalfilesize"

51200
------WebKitFormBoundaryxBA8idxO6Luv7Ipc
Content-Disposition: form-data; name="qqfile"; filename="image1.jpg"
Content-Type: image/jpeg

{binary data}
------WebKitFormBoundaryxBA8idxO6Luv7Ipc--

Answer 1

Since it looks like you are sending credentials, set the Access-Control-Allow-Origin header to the origin of the request (obviously not a good idea for production) rather than '*'.

If you did not have sendCredentials set as true in Fine Uploader, then you could have a wildcard Access-Control-Allow-Origin.

According to MDN:

[...] when responding to a credentialed request, server must specify a domain, and cannot use wild carding. The above example would fail if the header was wildcarded as: Access-Control-Allow-Origin: *.

Also, sourced from this answer: CORS: Cannot use wildcard in Access-Control-Allow-Origin when credentials flag is true