Vimeo API : streaming upload using HTTP PUT and blueimp's jQuery fileupload - php

I'm trying to implement an upload module on a website which would allow our users to upload videos to our Vimeo account. I'm using blueimp's jQuery File upload and Vimeo's new API.
https://github.com/blueimp/jQuery-File-Upload/wiki/Options
https://developer.vimeo.com/api/upload#http-put-uploading
I think it's close to be working but I must be missing some detail.
According to Vimeo's API, I need to :
1. Generate an upload ticket, which works fine
2. I then pass the upload_link_secure to jquery file upload which starts uploading. This is what the requests headers for the PUT request look like :
Request Method:PUT
Status Code:200 OK
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4
Connection:keep-alive
Content-Length:43418955
Content-Type:multipart/form-data; boundary=----WebKitFormBoundarye8sGy57JH6ACoOfJ
This is how I call jQuery file upload :
$('#file').fileupload({
url: upload_link_secure,
type: 'PUT'
});
I also tried forcing the Content-Type header to "video/mp4" but it doesn't make any difference in the end.
I also checked the size of the file by binding jquery fileupload's submit event and I also get a lower bytes count than what's sent in the headers, 43418764 in this example, is this okay ?
Verify the upload by sending PUT requests on upload_link_secure, some response headers I get :
Status Code:308 Resume Incomplete
Range:bytes=0-3948544
Status Code:308 Resume Incomplete
Range:bytes=0-38682624
Status Code:308 Resume Incomplete
Range:bytes=0-43401216
Make sure all the bytes made it to Vimeo, then complete the upload by sending a DELETE request on complete_uri
I get this last header when verifying the upload :
Range:bytes=0-43418955
It seems to match the Content-Length send in the first request so I perform a DELETE request, and this is the reponse I get :
{"body":{"error":"Your video file is not valid. Either you have uploaded an invalid file format, or your upload is incomplete. Make sure you verify your upload before marking it as 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 a very dumb mistake but I'm not very familiar with all those HTTP requests and reponses, does anybody know what I did wrong ?
Thanks !
[edit] Thanks a lot Dashron, I actually had to set jQuery fileupload's multipart option to false :
$('#file').fileupload({
url: upload_link_secure,
type: 'PUT',
multipart: false
});
After that, I was getting 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 that but I didn't find it so I simply commented 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 it works fine ! :)
[edit2] I was asked for a more complete example of the code I came up with to make that PUT upload work so here is a Gist containing the relevant Twig template from my Symfony application. I hope it's clear enough and that it can help. The code can probably be improved a lot but I guess it's an okay starting point. https://gist.github.com/paulgv/13ff6d194bc0d662de7b
[edit3] I also realize that I never updated my code with a cleaner fix for the issue I had with the Content-Disposition header (see crossed out text above). Thanks to blueimp's help, I found out that you can simply remove this header in fileuploadsend callback :
.bind('fileuploadsend', function (e, data) {
data.headers = {};
})

PUT uploads do not support multipart form encoding. PUT uploads should have a request body of only the raw bytes of the file.
Multipart is supported on POST uploads, but POST uploads do not support resumable uploads or range headers.

Related

Which HTTP status code should be used for a UPLOAD_ERR_PARTIAL?

I'm developing a REST API and I have some file uploads:
PHP can generate an UPLOAD_ERR_PARTIAL error when the file was only partially uploaded, and I'm not sure of which HTTP status code should be used in this case.
This usually happens if the user cancels the upload (see Why might a file only be partially uploaded and file upload errors on php.net )
UPLOAD_ERR_PARTIAL is given when the mime boundary is not found after the file data. A possibly cause for this is that the upload was cancelled by the user (pressed ESC, etc).
You should use 409 status code for this case.
According to http://www.ietf.org/rfc/rfc2616.txt:
The request could not be completed due to a conflict with the current
state of the resource. This code is only allowed in situations where
it is expected that the user might be able to resolve the conflict
and resubmit the request. The response body SHOULD include enough
information for the user to recognize the source of the conflict.
Ideally, the response entity would include enough information for the
user or user agent to fix the problem; however, that might not be
possible and is not required.
If the user's upload failed because of something being wrong with what they're uploading, just say: 400 Bad Request
You don't have to send any status code, because client has already disconnected.
I would go with either 422 (request unable to be followed due to semantic errors) or 449 (request should be retried after performing action).
Take a look at httpstatuses.com.
i think the header should be based on error context:
if the file upload is not an allowed type:
HTTP_415 = 'Unsupported Media Type'
if the file upload it too big:
HTTP_413 = 'Request Entity Too Large'
if the server has a problem w/ the upload:
HTTP_500 = 'Internal Server Error'
if the upload times out:
HTTP_504 = 'Gateway Timeout'
but in general, i would say that 500 is pretty standard.
UPLOAD_ERR_PARTIAL is given when the mime boundary is not found after the file data.
411 Length Required
The request did not specify the length of its content, which is required by the requested resource
I would use
408 Request timeout.
As it indicates that the request was only sent partially (which is not supported in this case)
400 Bad Request
looks like an other option.
You can also create your own using a non reserved number.
But where do you send the response if the request is cancelled?

how to download byte data (pdf) response given by server in extjs4.1

i have some fields in panel. am sending user entries to the server using ajax request. In server side am using php to generate pdf[using tcpdf] file based on the entries made by user.
below is the code snippet of ajax request.
Ext.Ajax.request({
url: 'tcpdf3.php',
method : 'POST',
params : {
fromDate : Ext.encode(Ext.getCmp('FromDate').value),
username : Ext.getCmp('uname').value
}
success : function(){
// how to handle byte response giving by server . i.e want to download the pdf file(byte stream response) generated by server.
}
failure : function(){
}
});
ajax request carrying user entries is going to server correctly. And in server side the php file "tcpdf3.php" will give byte strems as response(i.e pdf file),upto this all is working fine. Am finding difficult how to handle the byte stream response given by server.i.e i want to download the pdf file generated.
below is the response given by server.
can someone please help me out of this.

PHP CURL - Passing an image from a remote url with http header response code checking in one curl resource

I have php application that serve image, the image is coming from a remote URL and passing it to the browser with content type image. My code has 2 steps:
Using curl to check the http header response. If it is a valid image (httpcode 200).
if httpcode is 200, I used readfile function with header content-type: image/jpg.
For me the approach above is not a good idea because it makes 2 http hit. My goal is to make the 2 steps above just one using CURL. Is it possible?
Appreciate any inputs on this.
Thanks.

How to receive a file via HTTP PUT with PHP

This is something that has been bugging me for a while.. I'm building of a RESTful API that has to receive files on some occasions.
When using HTTP POST, we can read data from $_POST and files from $_FILES.
When using HTTP GET, we can read data from $_GET and files from $_FILES.
However, when using HTTP PUT, AFAIK the only way to read data is to use the php://input stream.
All good and well, untill I want to send a file over HTTP PUT. Now the php://input stream doesn't work as expected anymore, since it has a file in there as well.
Here's how I currently read data on a PUT request:
(which works great as long as there are no files posted)
$handle = fopen('php://input', 'r');
$rawData = '';
while ($chunk = fread($handle, 1024)) {
$rawData .= $chunk;
}
parse_str($rawData, $data);
When I then output rawData, it shows
-----ZENDHTTPCLIENT-44cf242ea3173cfa0b97f80c68608c4c
Content-Disposition: form-data; name="image_01"; filename="lorem-ipsum.png"
Content-Type: image/png; charset=binary
�PNG
���...etc etc...
���,
-----ZENDHTTPCLIENT-8e4c65a6678d3ef287a07eb1da6a5380
Content-Disposition: form-data; name="testkey"
testvalue
-----ZENDHTTPCLIENT-8e4c65a6678d3ef287a07eb1da6a5380
Content-Disposition: form-data; name="otherkey"
othervalue
Does anyone know how to properly receive files over HTTP PUT, or how to parse files out of the php://input stream?
===== UPDATE #1 =====
I have tried only the above method, don't really have a clue as to what I can do else.
I have gotten no errors using this method, besides that I don't get the desired result of the posted data and files.
===== UPDATE #2 =====
I'm sending this test request using Zend_Http_Client, as follows:
(haven't had any problems with Zend_Http_Client so far)
$client = new Zend_Http_Client();
$client->setConfig(array(
'strict' => false,
'maxredirects' => 0,
'timeout' => 30)
);
$client->setUri( 'http://...' );
$client->setMethod(Zend_Http_Client::PUT);
$client->setFileUpload( dirname(__FILE__) . '/files/lorem-ipsum.png', 'image_01');
$client->setParameterPost(array('testkey' => 'testvalue', 'otherkey' => 'othervalue');
$client->setHeaders(array(
'api_key' => '...',
'identity' => '...',
'credential' => '...'
));
===== SOLUTION =====
Turns out I made some wrong assumptions, mainly that HTTP PUT would be similar to HTTP POST. As you can read below, DaveRandom explained to me that HTTP PUT is not meant for transferring multiple files on the same request.
I have now moved the transferring of formdata from the body to url querystring. The body now holds the contents of a single file.
For more information, read DaveRandom's answer. It's epic.
The data you show does not depict a valid PUT request body (well, it could, but I highly doubt it). What it shows is a multipart/form-data request body - the MIME type used when uploading files via HTTP POST through an HTML form.
PUT requests should exactly compliment the response to a GET request - they send you the file contents in the message body, and nothing else.
Essentially what I'm saying is that it is not your code to receive the file that is wrong, it is the code that is making the request - the client code is incorrect, not the code you show here (although the parse_str() call is a pointless exercise).
If you explain what the client is (a browser, script on other server, etc) then I can help you take this further. As it is, the appropriate request method for the request body that you depict is POST, not PUT.
Let's take a step back from the problem, and look at the HTTP protocol in general - specifically the client request side - hopefully this will help you understand how all of this is supposed to work. First, a little history (if you're not interested in this, feel free to skip this section).
History
HTTP was originally designed as a mechanism for retrieving HTML documents from remote servers. At first it effectively supported only the GET method, whereby the client would request a document by name and the server would return it to the client. The first public specification for HTTP, labelled as HTTP 0.9, appeared in 1991 - and if you're interested, you can read it here.
The HTTP 1.0 specification (formalised in 1996 with RFC 1945) expanded the capabilities of the protocol considerably, adding the HEAD and POST methods. It was not backwards compatible with HTTP 0.9, due to a change in the format of the response - a response code was added, as well as the ability to include metadata for the returned document in the form of MIME format headers - key/value data pairs. HTTP 1.0 also abstracted the protocol from HTML, allowing for the transfer of files and data in other formats.
HTTP 1.1, the form of the protocol that is almost exclusively in use today is built on top of HTTP 1.0 and was designed to be backwards compatible with HTTP 1.0 implementations. It was standardised in 1999 with RFC 2616. If you are a developer working with HTTP, get to know this document - it is your bible. Understanding it fully will give you a considerable advantage over your peers who do not.
Get to the point already
HTTP works on a request-response architecture - the client sends a request message to the server, the server returns a response message to the client.
A request message includes a METHOD, a URI and optionally, a number of HEADERS. The request METHOD is what this question relates to, so it is what I will cover in the most depth here - but first it is important to understand exactly what we mean when we talk about the request URI.
The URI is the location on the server of the resource we are requesting. In general, this consists of a path component, and optionally a query string. There are circumstances where other components may be present as well, but for the purposes of simplicity we shall ignore them for now.
Let's imagine you type http://server.domain.tld/path/to/document.ext?key=value into the address bar of your browser. The browser dismantles this string, and determines that it needs to connect to an HTTP server at server.domain.tld, and ask for the document at /path/to/document.ext?key=value.
The generated HTTP 1.1 request will look (at a minimum) like this:
GET /path/to/document.ext?key=value HTTP/1.1
Host: server.domain.tld
The first part of the request is the word GET - this is the request METHOD. The next part is the path to the file we are requesting - this is the request URI. At the end of this first line is an identifier indicating the protocol version in use. On the following line you can see a header in MIME format, called Host. HTTP 1.1 mandates that the Host: header be included with every request. This is the only header of which this is true.
The request URI is broken into two parts - everything to the left of the question mark ? is the path, everything to the right of it is the query string.
Request Methods
RFC 2616 (HTTP/1.1) defines 8 request methods.
OPTIONS
The OPTIONS method is rarely used. It is intended as a mechanism for determining what kind of functionality the server supports before attempting to consume a service the server may provide.
Off the top of my head, the only place in fairly common usage that I can think of where this is used is when opening documents in Microsoft office directly over HTTP from Internet Explorer - Office will send an OPTIONS request to the server to determine if it supports the PUT method for the specific URI, and if it does it will open the document in a way that allows the user to save their changes to the document directly back to the remote server. This functionality is tightly integrated within these specific Microsoft applications.
GET
This is by far and away the most common method in every day usage. Every time you load a regular document in your web browser it will be a GET request.
The GET method requests that the server return a specific document. The only data that should be transmitted to the server is information that the server requires to determine which document should be returned. This can include information that the server can use to dynamically generate the document, which is sent in the form of headers and/or query string in the request URI. While we're on the subject - Cookies are sent in the request headers.
HEAD
This method is identical to the GET method, with one difference - the server will not return the requested document, if will only return the headers that would be included in the response. This is useful for determining, for example, if a particular document exists without having to transfer and process the entire document.
POST
This is the second most commonly used method, and arguably the most complex. POST method requests are almost exclusively used to invoke some actions on the server that may change its state.
A POST request, unlike GET and HEAD, can (and usually does) include some data in the body of the request message. This data can be in any format, but most commonly it is a query string (in the same format as it would appear in the request URI) or a multipart message that can communicate key/value pairs along with file attachments.
Many HTML forms use the POST method. In order to upload files from a browser, you would need to use the POST method for your form.
The POST method is semantically incompatible with RESTful APIs because it is not idempotent. That is to say, a second identical POST request may result in a further change to the state of the server. This contradicts the "stateless" constraint of REST.
PUT
This directly complements GET. Where a GET requests indicates that the server should return the document at the location specified by the request URI in the response body, the PUT method indicates that the server should store the data in the request body at the location specified by the request URI.
DELETE
This indicates that the server should destroy the document at the location indicated by the request URI. Very few internet facing HTTP server implementations will perform any action when they receive a DELETE request, for fairly obvious reasons.
TRACE
This provides an application-layer level mechanism to allow clients to inspect the request it has sent as it looks by the time it reaches the destination server. This is mostly useful for determining the effect that any proxy servers between the client and the destination server may be having on the request message.
CONNECT
HTTP 1.1 reserves the name for a CONNECT method, but does not define its usage, or even its purpose. Some proxy server implementations have since used the CONNECT method to facilitate HTTP tunnelling.
I've never tried using PUT (GET POST and FILES were sufficient for my needs) but this example is from the php docs so it might help you (http://php.net/manual/en/features.file-upload.put-method.php):
<?php
/* PUT data comes in on the stdin stream */
$putdata = fopen("php://input", "r");
/* Open a file for writing */
$fp = fopen("myputfile.ext", "w");
/* Read the data 1 KB at a time
and write to the file */
while ($data = fread($putdata, 1024))
fwrite($fp, $data);
/* Close the streams */
fclose($fp);
fclose($putdata);
?>
Here is the solution that I found to be the most useful.
$put = array();
parse_str(file_get_contents('php://input'), $put);
$put will be an array, just like you are used to seeing in $_POST, except now you can follow true REST HTTP protocol.
Use POST and include an X- header to indicate the actual method (PUT in this case). Usually this is how one works around a firewall which does not allow methods other than GET and POST. Simply declare PHP buggy (since it refuses to handle multipart PUT payloads, it IS buggy), and treat it as you would an outdated/draconian firewall.
The opinions as to what PUT means in relation to GET are just that, opinions. The HTTP makes no such requirement. It simply states 'equivalent' .. it is up to the designer to determine what 'equivalent' means. If your design can accept a multi-file upload PUT and produce an 'equivalent' representation for a subsequent GET for the same resource, that's just fine and dandy, both technically and philosophically, with the HTTP specifications.
Just follow what it says in the DOC:
<?php
/* PUT data comes in on the stdin stream */
$putdata = fopen("php://input", "r");
/* Open a file for writing */
$fp = fopen("myputfile.ext", "w");
/* Read the data 1 KB at a time
and write to the file */
while ($data = fread($putdata, 1024))
fwrite($fp, $data);
/* Close the streams */
fclose($fp);
fclose($putdata);
?>
This should read the whole file that is on the PUT stream and save it locally, then you could do what you want with it.

How do I display a message after a file has been downloaded?

I have this PHP code and it works fine.
header('Content-Type: application/zip');
header('Content-Disposition: attachment; filename="WTBak.zip"');
readfile($ArchiveFileName);
echo $ArchiveFileName;
unlink($ArchiveFileName);
My issue is, how do I give out a message after the last line (unlink) has been executed?
Thanks!
Assumptions:
The client user should receive a message, this is kind of message sent to the client
The response is binary
Abstract:
sending binary information to the client along with text response would be possible if it is mhtml format, used in mails and each browser has (some do nto have) the support for multipart response. Let us not chose this way
sending binary information to respond one request (download file) and another response to another request (status of download) - this is a popular practice.
Solution:
on server: persist the status of download
// pseudocode: log_download_event(seessionid, status='started')
header('Content-Type: application/zip');
header('Content-Disposition: attachment; filename="WTBak.zip"');
readfile($ArchiveFileName);
echo $ArchiveFileName;
unlink($ArchiveFileName);
// pseudocode: log_download_event(seessionid, status='done')
on server: implement a php that will respond with a status of download
// pseudocode: $DownloadStatus=get_download_status(sessionid)
echo '{staus:' + $DownloadStatus + '}'
on client: on some event trigger the download
window.open("http://nowhere.com/download.php?resuorce=archive-file.zip");
window.theTrackInterval = window.setInterval(trackDownload, 1000);
var trackInterval = function(){
$.get('ajax/test.html', function(data) {
id(data.status=='ready'){
cleanInterval(window.theTrackInterval);
alert('download is done');
}
});
}
This solution will start sending the ajax requests to the server every one second asking "is download done" and when it will receive confirmation "yest it is done" client will stop tracking and alert a message
What is missed:
the implementation of status persistence. i am not PHP guy - forgive me this gap
Look, if you give a message, it will be sent in the file and not shown to the user corrupting / changing the contents of the file. You cannot modify the headers as they've already been sent!
So, I feel, there is now way!
Cheers
I had a similar requirement from client. So I created a tool to show message after a file gets downloaded.
You can see at http://www.iamkumaran.com/xdownloader-a-flash-javascript-library/ and look for demo link.

Categories