S3 multipart upload for large videos, EISDIR fix
This commit is contained in:
@@ -252,42 +252,67 @@ export default function UploadForm() {
|
||||
mtvFile,
|
||||
videoFile.name,
|
||||
videoFile.type || "video/webm",
|
||||
videoFile.size.toString(),
|
||||
runDate,
|
||||
);
|
||||
|
||||
const { parts, uploadId } = initRes.presignedUrls;
|
||||
const totalSize = videoFile.size;
|
||||
const CHUNK_SIZE = 80 * 1024 * 1024;
|
||||
const uploadedParts: { partNumber: number; eTag: string }[] = [];
|
||||
|
||||
await new Promise<void>((resolve, reject) => {
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.upload.addEventListener("progress", (e) => {
|
||||
if (e.lengthComputable) {
|
||||
setProgress(
|
||||
5 + Math.round((e.loaded / totalSize) * 90),
|
||||
);
|
||||
}
|
||||
for (let i = 0; i < parts.length; i++) {
|
||||
const part = parts[i]!;
|
||||
const start = i * CHUNK_SIZE;
|
||||
const end = Math.min(start + CHUNK_SIZE, totalSize);
|
||||
const chunk = videoFile.slice(start, end);
|
||||
|
||||
const eTag = await new Promise<string>((resolve, reject) => {
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.upload.addEventListener("progress", (e) => {
|
||||
if (e.lengthComputable) {
|
||||
const chunkProgress = e.loaded / e.total;
|
||||
const overallUploaded = start + e.loaded;
|
||||
setProgress(
|
||||
5 +
|
||||
Math.round(
|
||||
(overallUploaded / totalSize) * 90,
|
||||
),
|
||||
);
|
||||
}
|
||||
});
|
||||
xhr.addEventListener("load", () => {
|
||||
if (xhr.status >= 200 && xhr.status < 300) {
|
||||
const etag = xhr.getResponseHeader("ETag");
|
||||
if (etag) resolve(etag);
|
||||
else
|
||||
reject(
|
||||
new Error("No ETag returned from upload"),
|
||||
);
|
||||
} else {
|
||||
reject(
|
||||
new Error(
|
||||
`Upload failed with status ${xhr.status}`,
|
||||
),
|
||||
);
|
||||
}
|
||||
});
|
||||
xhr.addEventListener("error", () =>
|
||||
reject(new Error("Upload failed")),
|
||||
);
|
||||
xhr.open("PUT", part.url);
|
||||
xhr.setRequestHeader(
|
||||
"Content-Type",
|
||||
videoFile.type || "video/webm",
|
||||
);
|
||||
xhr.send(chunk);
|
||||
});
|
||||
xhr.addEventListener("load", () => {
|
||||
if (xhr.status >= 200 && xhr.status < 300) resolve();
|
||||
else
|
||||
reject(
|
||||
new Error(
|
||||
`Upload failed with status ${xhr.status}`,
|
||||
),
|
||||
);
|
||||
});
|
||||
xhr.addEventListener("error", () =>
|
||||
reject(new Error("Upload failed")),
|
||||
);
|
||||
xhr.open("PUT", initRes.presignedUrls.video);
|
||||
xhr.setRequestHeader(
|
||||
"Content-Type",
|
||||
videoFile.type || "video/webm",
|
||||
);
|
||||
xhr.send(videoFile);
|
||||
});
|
||||
|
||||
uploadedParts.push({ partNumber: part.partNumber, eTag });
|
||||
}
|
||||
|
||||
setProgress(98);
|
||||
await uploadVideoComplete(initRes.id);
|
||||
await uploadVideoComplete(initRes.id, uploadedParts, uploadId);
|
||||
setProgress(100);
|
||||
|
||||
setSuccess(true);
|
||||
|
||||
Reference in New Issue
Block a user