Ir para conteúdo
Fórum Script Brasil
  • 0

Diminuir tamanho imagem antes de fazer upload pro servidor


CriandoBits

Pergunta

Olá, pessoal!

Preciso diminuir o tamanho em bytes e em pixels de imagens antes de upar pro servidor. No entanto, só estou conseguindo exibir as imagens já alteradas mas, ao enviar para o servidor, a imagem que vai é a original, do computador, não alterada. Veja:

HTML:

<input type="file" name="file" id="file" accept="image/*">
<img class="img-responsive" id="image-preview" src="" alt="foto">

JAVASCRIPT:

const compress = new Compress()
const preview = document.getElementById('image-preview')
const upload = document.getElementById('file')

upload.addEventListener('change', (evt) => {
  const files = [...evt.target.files]
  compress.compress(files, {
    size: 4,
    quality: 0.75, 
    maxWidth: 1280, // the max width of the output image
    maxHeight: 720, // the max height of the output image
    resize: true 
  }).then((images) => {

    const img = images[0]
    // returns an array of compressed images
    preview.src = `${img.prefix}${img.data}`    
  })
}, false)

No Javascript acima as imagens são convertidas para 1280x720 com até 2MB. O preview mostra a imagem já convertida (ao "salvar como" o tamanho em byte e dimensões estão ok). Somente quando envio pro servidor é que a imagem vai "crua", ou seja, sem a conversão.

Preciso muito resolver esse problema.

Link para o comentário
Compartilhar em outros sites

0 respostass a esta questão

Posts Recomendados

Até agora não há respostas para essa pergunta

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152k
    • Posts
      651,8k
×
×
  • Criar Novo...