I am trying to implement a download module on a website that will allow our users to upload videos to our Vimeo account. I am using blueimp jQuery file upload and the new Vimeo API. https://github.com/blueimp/jQuery-File-Upload/wiki/Options https://developer.vimeo.com/api/upload#http-put-uploading I think this is close to work, but I should miss some details. According to the Vimeo API, I need: 1. Create a downloadable ticket that works fine 2. Then I pass upload_link_secure to download the jquery file, which starts the download. Here's what the request headers for the PUT request look like:
Request Method:PUT Status Code:200 OK Accept:*
This is how I call the jQuery file download:
$('#file').fileupload({ url: upload_link_secure, type: 'PUT' });
I also tried to force the Content-Type header to "video / mp4", but in the end it doesn't make any difference.
I also checked the file size by binding the jquery fileupload submit event, and I also got a lower byte than what was sent in the headers, 43418764 in this example, is this normal?
- Check the download by sending PUT requests to upload_link_secure, some response headers that I get:
Status code: 308 Resume not complete
Range: bytes = 0-3948544
Status code: 308 Resume not complete
Range: bytes = 0-38682624
Status code: 308 Resume not complete
Range: Bytes = 0-43401216
- Make sure all the bytes made it Vimeo, then complete the download by sending a DELETE request to complete_uri I get this last header when checking the download:
Range: bytes = 0-43418955
It seems to match the Content-Length request in the first request, so I execute the DELETE request, and this is the response I get:
{"body": {"error": "Your video file is not valid. You either uploaded the wrong file format or your upload was incomplete. Make sure you confirm your upload before marking it complete." }, "status": 400, "headers": {"Date": "Mon, 06 Oct 2014 17", "Server": "Apache", "Vary": "Accept, Vimeo-Client-Id, Accept-Encoding "," Cache-Control ":" no-cache, max-age = 315360000 "," Expires ":" Thu, 03 Oct 2024 17 "," Content-Length ":" 184 "," X-Cnection ":" close "," Content-Type ":" application / vnd.vimeo.error + json "," Via ":" 1.1 dca1-10 "}}
I must have made very stupid mistakes, but I'm not very familiar with all these HTTP requests and repons, does anyone know what I did wrong?
Thanks!
[edit] Thank you very much Dashron, I actually had to set jQuery fileupload multipart to false:
$('#file').fileupload({ url: upload_link_secure, type: 'PUT', multipart: false });
After that, I got this HTTP error:
XMLHttpRequest cannot load https://1511632921.cloud.vimeo.com/upload?[...]. Request header field Content-Disposition is not allowed by Access-Control-Allow-Headers.
There might be a clean fix for this, but I did not find it, so I just commented out the lines that set the Content-Disposition header in jquery.fileupload.js
// if (!multipart || options.blob || !this._isInstanceOf('File', file)) { // options.headers['Content-Disposition'] = 'attachment; filename="' + // encodeURI(file.name) + '"'; // }
(see edit3 )
Now everything works fine! :)
[edit2] I was offered a more complete code example that I came up with to do this PUT download, so there is a Gist here that contains the corresponding Twig template from my Symfony application. I hope this is clear enough and that this can help. Perhaps the code can be improved, but I think this is a good starting point. https://gist.github.com/paulgv/13ff6d194bc0d662de7b
[edit3] I also understand that I never updated my code with a cleaner fix for a problem related to the Content-Disposition header (see above text above). Thanks to blueimp , I found out that you can simply remove this header in the fileuploadsend callback:
.bind('fileuploadsend', function (e, data) { data.headers = {}; })