[ DUVIDA ] - File Upload Multipart usando NEXT.js
Fala gente.
Então, to trabalhando em um projeto que faz envio de arquivos para a CloudFlare R2 usando a api do AWS S3.
A parte de envio de arquivo com tamanho pequeno já está pronta e funcionando perfeitamente, porém, para envio de arquivos grandes (200MB por exemplo), é necessário usar o multipart, ou seja, enviando partes do arquivo com no mínimo 5MB por parte.
Fazendo o upload das partes com requisição HTTP pelo lado do cliente, você precisa ter acesso ao header "ETag", disponível no retorno de quando a parte foi enviada. O problema é que no NEXT.js ele não está dando acesso aos headers no lado do cliente. Eu fiz até pelo lado do servidor para testar, enviando somente a parte de envio com 5MB, e funcionou perfeitamente, porém, na vercel, não posso enviar arquivos para o servidor com um tamanho maior que 4.5MB.
Alguem consegue ajudar?
export default async function uploadPart(file: File, url: string, start: number, end: number) {
const blob = file.slice(start, end); // Obter parte do arquivo
const response = await fetch(url, {
method: "PUT",
body: blob,
});
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
return response.headers.get("ETag"); // Retornar ETag para uso na conclusão do upload
}
Oi JP, boa noite !
Eu recentemente implementei um feat sobre upload de vídeos para o provedor pandaVideos, nesse eu usei o protocolo Tus.
Tem algumas libs que são baseadas nesse protocolo que podem ser uma alternativa pro seu caso.