Jquery Vimeo使用块上传

我遇到了与这里相同的问题：使用“contentrange”标题，但给出的解决方案都不适合我。我正在使用javascript将视频放到Vimeo端点。我得到一张上传票证，并通过php在另一台服务器上处理初始化和完成上传。javascript所做的就是将视频数据放到一个端点

我的客户有一个不可靠的互联网连接，因此我正在建立一个可恢复的上传程序，试图自动恢复

我注意到，如果我删除“Content Range”标题并将块大小设置为大于上传的视频，它将正确上传。我一加上标题，事情就不对劲了。 据我所知，标题的格式应为“内容范围”：“字节1001-4999/5000”，但由于某些原因，这会导致问题。当我使用这种格式时，chrome不发送“Content Length”头，请求失败。FF发送标头，但也失败

我尝试了“内容范围”标题的不同组合，包括：“1001-4999/5000”，“范围=1001-4999-5000”。不会给出错误，但vimeo无法识别，因为当我请求上传字节时，我总是得到最后上传的块的长度。我也尝试过发送第一个不带头的块，其余的带头的块，但是没有正确发送的是头本身

Javascript:

/*
*将原始数据上载到服务器
*
*/
var uploadRawData=函数（起始字节、结束字节、数据发送）{
$（'.auto_uploader#play_pause_button'）。addClass（'pause'）。removeClass（'disabled'）；
$（'.auto#uploader#stop#u按钮'）。removeClass（'disabled'）；
$（'.auto#uploader#status#display'）.attr（'class'，''）.fadeIn（）；//删除所有其他类
_偏移量_start_from=parseInt（起始字节）| 0；
_上传程序\u进程=$.ajax({
url:_端点，
键入：“PUT”，
发送前：功能（请求）
{
//如果（起始字节！=0）{//发送第一个包含但不包含内容范围标头的块
//如果调用此函数以恢复文件，请添加起始偏移量
var content_range_header=“bytes”+起始字节+“-”+结束字节+“/”+\u file.size；
setRequestHeader（“内容范围”，内容范围标题）；
//}
setRequestHeader（“内容类型”，“文件类型”）；
//setRequestHeader（“内容长度”，data.bytellength）；
},
processData:false，
xhr:function（）{//自定义xhr
myXhr=$.ajaxSettings.xhr（）；
if（myXhr.upload）{//检查upload属性是否存在
myXhr.upload.addEventListener（'progress'，progressHandlingFunction，false）；//用于处理上载的进度
}
返回myXhr；
},
//Ajax事件
成功：函数（）{
如果（结束字节<文件大小-1）{//未完成（块模式）
var next_upload_字节=结束_字节+1；
retryUpload（）；//在下一个块上载之前检查上载的字节（这会创建一个无限循环，因为vimeo只报告最后上载的字节，因为上面的内容范围标头未被识别）-或
//uploadFilePart（下一个上传字节，下一个上传字节+区块大小-1）；//-在发送下一个区块之前不检查上传字节（上传所有部分，但vimeo只注册最后一个区块）
}否则{//完成！
//retryUpload（）；//检查以确保已上载整个文件
$（'.auto#uploader#status#display'）.attr（'class'，'tick'）；
重置按钮（）；
_completeFunction（）；//调用用户定义的回调
}
},
错误：函数（数据）{
console.log（data.responseText）；
如果（！\u paused&&u file！=null）{//中止（暂停）会导致错误
//如果我们失败，请重试上载
如果（\u重试\u计数<\u重试\u限制）{
_重试次数=\u重试次数+1；
console.log（'上载文件“+_file.name+'”时出错，请重试“+#”+_retry_count+'中的“+_retry_count*10+'秒”）；
setTimeout（函数（）{//在特定时间后调用click事件
retryUpload（）；//在10秒内调用重试上载方法
}, 10000);
}否则如果（\u重试\u计数=\u重试\u限制）{
//我们已经试够了！}）；
重置按钮（）；
$（'.auto#uploader#status#display'）.attr（'class'，'error'）；
警报（'超过最大重试次数！'）；
}
}
},
//错误：errorHandler，
//表单数据
数据：要发送的数据，
//告诉JQuery不要处理数据或担心内容类型的选项
cache:false，
contentType:false
});
}

我在这里上传了一个测试版本：完整的源代码在这里：标题被添加到autoUploader.js的第121行。请注意，如果您使用它，它会将端点硬编码到index.html中，并且可能已过期

---

如果有人已经解决了这个问题，或者已经成功地使用javascript实现了这个功能，请告诉我。

在服务器上获取字节的正确方法是在请求头中使用

内容范围：bytes*/*

进行PUT：

var byte_request = new XMLHttpRequest();
byte_request.open('PUT', upload_url, true);
byte_request.overrideMimeType('application/octet-stream');
byte_request.setRequestHeader('Content-Range', 'bytes */*');
byte_request.send();

这将返回308响应。在成功处理程序中，scape

范围

标题：

function onByteRequestSuccess(e) {
    var range_header,
        bytes_received;

    if (byte_request.status === 308) {
        range_header = xhr.getResponseHeader('Range');

        // The Range header will return something like "bytes=0-215235".
        // This grabs the group of numbers AFTER the "-" character,
        // which is the total bytes on the server.
        bytes_received = parseInt(range_header.split('-')[1], 10);
    }
}

---

至于您的

内容类型

标题不可用，我发现大多数库（jQuery和MooTools）对于此类请求都不可靠。如果您仍然遇到问题，可能需要深入研究jQuery的代码库。

我也遇到了同样的问题，并设法构建了一个上传vi的实现

function onByteRequestSuccess(e) {
    var range_header,
        bytes_received;

    if (byte_request.status === 308) {
        range_header = xhr.getResponseHeader('Range');

        // The Range header will return something like "bytes=0-215235".
        // This grabs the group of numbers AFTER the "-" character,
        // which is the total bytes on the server.
        bytes_received = parseInt(range_header.split('-')[1], 10);
    }
}