使用 Tus 协议恢复文件上传 [英] Resume file uploading using Tus protocol
问题描述
我正在使用 Laravel 开发网站,并且我正在使用 tus-js-client 将文件直接上传到 Vimeo 而无需通过我的服务器.上传工作完美.
I am developing a website using Laravel, and I am using tus-js-client to upload files directly to Vimeo without going through my server. The uploading works perfect.
但是,假设上传达到了 44%,然后用户刷新了浏览器......据我所知,当用户再次开始上传相同的文件时,它应该从 44% 继续上传......但这不会发生它从头开始.
But, lets say the uploading reached 44%, and then the user refreshed the browser... as I understand It should continue uploading from 44% when the user start uploading the same file again.. but that doesn't happen and it start from the beginning.
我认为这是因为当我向 Vimeo 发送 API 请求以获取 upload_link ( 步骤 1 ) 每次用户刷新页面时,它都会给我一个新的 upload_link..
I think this is happening because when I send an API request to Vimeo to get the upload_link ( step 1 ) It will give me a new upload_link every time the user refresh the page..
// Upload process start
var self = this;
// Send request to server to get (upload.upload_link) from Vimeo API (Step 1)
var uploadEndPoint = self.getUploadEndPoint();
// Start uploading ( Step 2 )
self.uploader = new tus.Upload(file, {
uploadUrl: uploadEndPoint,
retryDelays: [0, 1000, 3000, 5000],
metadata: {
filename: file.name,
filetype: file.type
},
resume: true,
uploadSize: file.size,
onError: function(error) {
console.log("Failed because: " + error);
},
onProgress: function(bytesUploaded, bytesTotal) {
var percentage = (bytesUploaded / bytesTotal * 100).toFixed(2);
console.log(bytesUploaded, bytesTotal, percentage + "%");
},
onSuccess: function() {
console.log(
"Download %s from %s",
self.uploader.file.name,
self.uploader.url
);
}
});
处理此问题的最佳方法是什么,以便用户可以继续上传?
What is the best way to handle this, so the user can resume the upload?
推荐答案
我做了什么:
- 设置 Laravel 后端端点以获取下载链接
- 对于第一个端点请求,从后端向 Vimeo 发出请求并在后端保存上传链接
- 对于进一步的请求,检查客户端是否要下载相同的文件(通过名称和大小,或通过哈希),如果是,则返回保存的上传链接,如果不请求新的
这样做我解决了两个问题:
by doing that i solve two problems:
- 保留上传链接的记录,直到文件未完全上传
- 在服务器上保持我的永久 Vimeo 访问令牌不受损害,仅在客户端发送上传链接
这篇关于使用 Tus 协议恢复文件上传的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!