我正在尝试在网站上实现一个上传模块,该模块允许我们的用户将视频上传到我们的Vimeo帐户。我正在使用blueimp的jQueryFile上传和Vimeo的新API。https://github.com/blueimp/jQuery-File-Upload/wiki/Optionshttps://developer.vimeo.com/api/upload#http-上传我认为它很快就会起作用,但我一定遗漏了一些细节。根据Vimeo的API,我需要:1.生成上传票证,效果良好2.然后我将upload_link_secure传递给jquery文件上传,jquery文件开始上传。PUT请求的请求头是这样的:
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
这就是我如何调用jQuery文件上传:
$('#file').fileupload({
url: upload_link_secure,
type: 'PUT'
});
我还尝试将Content-Type标头强制设置为"video/mp4",但最终没有任何区别。
我还通过绑定jquery fileupload的submit事件检查了文件的大小,并且我得到的字节数也低于头中发送的字节数,在本例中为43418764,这可以吗?
- 通过在upload_link_secure上发送PUT请求来验证上传,我得到了一些响应头:
状态代码:308恢复未完成
范围:字节=0-3948544
状态代码:308恢复未完成
范围:字节=0-38682624
状态代码:308恢复未完成
范围:字节=0-43401216
- 确保所有字节都到达Vimeo,然后通过在complete_uri上发送DELETE请求来完成上传我在验证上传时得到最后一个标题:
范围:字节=0-43418955
它似乎与第一个请求中发送的内容长度相匹配,所以我执行DELETE请求,这是我得到的回复:
{"body":{"error":"您的视频文件无效。您上传的文件格式无效,或者您的上传不完整。请确保在将其标记为完成之前验证您的上传。"},"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"
我一定犯了一个非常愚蠢的错误,但我不太熟悉所有的HTTP请求和响应,有人知道我做错了什么吗?
谢谢!
[edit]非常感谢Dashron,我实际上不得不将jQuery文件上传的多部分选项设置为false:
$('#file').fileupload({
url: upload_link_secure,
type: 'PUT',
multipart: false
});
在那之后,我收到了这个HTTP错误:
XMLHttpRequest cannot load https://1511632921.cloud.vimeo.com/upload?[...]. Request header field Content-Disposition is not allowed by Access-Control-Allow-Headers.
对此可能有一个干净的修复方法,但我没有找到,所以我只是在jquery.filelpload.js 中对设置Content-Disposition标头的行进行了注释
// if (!multipart || options.blob || !this._isInstanceOf('File', file)) {
// options.headers['Content-Disposition'] = 'attachment; filename="' +
// encodeURI(file.name) + '"';
// }
(请参见edit3)
现在它运行良好!:)
[edit2]有人要求我提供一个更完整的代码示例,以使PUT上传工作正常,因此这里有一个Gist,包含我的Symfony应用程序中的相关Twig模板。我希望它足够清楚,并能有所帮助。代码可能可以改进很多,但我想这是一个不错的起点。https://gist.github.com/paulgv/13ff6d194bc0d662de7b
[edit3]我还意识到,对于Content-Disposition
标头的问题,我从未用更干净的修复程序更新过我的代码(请参阅上面划掉的文本)。由于blueimp的帮助,我发现您可以简单地在fileuploadsend
回调中删除此标头:
.bind('fileuploadsend', function (e, data) {
data.headers = {};
})
POST上载支持Multipart,但POST上载不支持可恢复的上载或范围标头。