I wanna upload a file to remote platform, and here is my ajax function, I already set data inside formData.
$.ajax({
url: "http://example.com/test/",
beforeSend: function (xhr) {
xhr.setRequestHeader("Authorization", key);
},
type: "POST",
data: formData,
dataType: "json",
contentType: false,
processData: false,
success: function(data) {
formData.append("access_url", data["data"]["access_url"]);
},
error: function (jqXHR, textStatus, errorThrown) {
alert("upload falied");
},
});
When I use Chrome, the option request look like this:
General
Request URL:http://example.com/test
Request Method:OPTIONS
Status Code:200 OK
Remote Address:59.37.116.14:80
Response Headers
Access-Control-Allow-Credentials:false
Access-Control-Allow-Headers:Authorization
Access-Control-Allow-Methods:PUT,GET,POST,DELETE,HEAD
Access-Control-Allow-Origin:*
Access-Control-Max-Age:100
Connection:keep-alive
Content-Length:30
Content-Type:*/*
Date:Thu, 03 Nov 2016 03:30:17 GMT
Server:nginx
Request Headers
Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en,zh;q=0.8,en-US;q=0.6,zh-CN;q=0.4
Access-Control-Request-Headers:authorization
Access-Control-Request-Method:POST
Connection:keep-alive
DNT:1
Host:example.com
Origin:http://127.0.0.1
Referer:http://127.0.0.1/en/apkUpload/
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.71 Safari/537.36
When I use Firefox:
General
Request URL:http://example.com/test
Request Method:OPTIONS
Status Code:400 Bad Request
Remote Address:59.37.116.14:80
Version: HTTP/1.1
Response Headers
Access-Control-Allow-Origin:"*"
Connection:"keep-alive"
Content-Length:"42"
Content-Type:"text/html; charset=utf-8"
Date:"Thu, 03 Nov 2016 03:30:17 GMT"
Server:"nginx"
Request Headers
Host: example.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:49.0) Gecko/20100101 Firefox/49.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,zh-CN;q=0.8,zh;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Access-Control-Request-Method: POST
Access-Control-Request-Headers: authorization
origin: http://127.0.0.1
Connection: keep-alive
I can upload file using Chrome but not Firefox, Safari and Edge. Firefox keep telling me
Reason: CORS preflight channel was not successful
It seems Firefox miss something in response, I read about Firefox CORS, and set
- Access-Control-Allow-Headers:Authorization
- Access-Control-Allow-Methods:PUT,GET,POST,DELETE,HEAD
- Access-Control-Allow-Origin:*
Any idea?
EDIT
EDIT2
When I use firefox:
OPTIONS /files/v1/10000710/uni/test/1219151-294-491055 HTTP/1.1
Host: web.file.myqcloud.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:49.0) Gecko/20100101 Firefox/49.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,zh-CN;q=0.8,zh;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Access-Control-Request-Method: POST
Access-Control-Request-Headers: authorization
origin: http://127.0.0.1
Connection: keep-alive
HTTP/1.1 400 Bad Request
Server: nginx
Date: Mon, 07 Nov 2016 01:34:51 GMT
Content-Type: text/html; charset=utf-8
Content-Length: 42
Connection: keep-alive
Access-Control-Allow-Origin: *
{"code":-5999,"message":"ERROR_CGI_PARAM"}
When I use Chrome:
OPTIONS /files/v1/10000710/uni/test/258337-900-520822 HTTP/1.1
Host: web.file.myqcloud.com
Connection: keep-alive
Access-Control-Request-Method: POST
Origin: http://127.0.0.1
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.71 Safari/537.36
Access-Control-Request-Headers: authorization
Accept: */*
DNT: 1
Referer: http://127.0.0.1/en/apkUpload/
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en,zh;q=0.8,en-US;q=0.6,zh-CN;q=0.4
HTTP/1.1 200 OK
Server: nginx
Date: Mon, 07 Nov 2016 01:52:00 GMT
Content-Type: */*
Content-Length: 30
Connection: keep-alive
Access-Control-Allow-Credentials: false
Access-Control-Allow-Headers: Authorization,authorization,Content-Type,Accept-Encoding,Accept-Encoding,x-requested-with,origin,accept, client-security-token
Access-Control-Allow-Methods: PUT,GET,POST,DELETE,HEAD
Access-Control-Allow-Origin: *
Access-Control-Max-Age: 100
{"code":0,"message":"SUCCESS"}POST /files/v1/10000710/uni/test/258337-900-520822 HTTP/1.1
Host: web.file.myqcloud.com
Connection: keep-alive
Content-Length: 258745
Accept: application/json, text/javascript, */*; q=0.01
Origin: http://127.0.0.1
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.71 Safari/537.36
Authorization: F8MSoMEn48fOmZPq1nXlzOy/uAxhPTEwMDAwNzEwJmI9dW5pJms9QUtJRHhwUUlhREFKVmdKWFFtYzZqN1pYOEN1YnBCMU9DbmxPJmU9MTQ3ODQ4MzY3My44ODIwOTAzJnQ9MTQ3ODQ4MzA3MyZyPTkzNzc5NDM5MCZmPQ==
Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryIkmhn80tQFpVOkj2
DNT: 1
Referer: http://127.0.0.1/en/apkUpload/
Accept-Encoding: gzip, deflate
Accept-Language: en,zh;q=0.8,en-US;q=0.6,zh-CN;q=0.4
------WebKitFormBoundaryIkmhn80tQFpVOkj2
Content-Disposition: form-data; name="insertOnly"
1
------WebKitFormBoundaryIkmhn80tQFpVOkj2
Content-Disposition: form-data; name="op"
upload
------WebKitFormBoundaryIkmhn80tQFpVOkj2
Content-Disposition: form-data; name="filecontent"; filename="......_web.......apk"
Content-Type: application/octet-stream
It seems firefox didn't send any data in the request, is something about the Formdata api?