Como posso obter o tamanho de upload de um arquivo usando Javascript simples?

Question

Eu carregar funcionalidade de arquivo em uma das páginas. I verificar a extensão do arquivo usando JavaScript. Agora eu quero impedir que o usuário maior arquivo de upload de 1 MB. Existe alguma maneira eu posso verificar o tamanho de upload de arquivos usando JavaScript.

O meu código atualmente esta aparência:

<script language="JavaScript">
function validate() {
   var filename = document.getElementById("txtChooseFile").value;
   var ext = getExt(filename);
   if(ext == "txt" || ext == "csv")
      return true;
   alert("Please upload Text files only.");
   return false;
}

function getExt(filename) {
   var dot_pos = filename.lastIndexOf(".");
   if(dot_pos == -1)
      return "";
   return filename.substr(dot_pos+1).toLowerCase();
}
</script>

Answer 1

Outro que adquirindo o nome do arquivo não existe uma maneira de você descobrir quaisquer outros detalhes sobre o arquivo em javascript incluindo seu tamanho.

Em vez disso você deve configurar o script do lado do servidor para bloquear um upload de grandes dimensões.

Answer 2

Consulte http://www.w3.org/TR/FileAPI/ . É suportado pelo Firefox 3,6; Eu não sei sobre quaisquer outros navegadores.

Dentro do evento onchange de um <input id="fileInput" type="file" /> simplesmente:

var fi = document.getElementById('fileInput');
alert(fi.files[0].size); // maybe fileSize, I forget

Você também pode retornar o conteúdo do arquivo como uma string, e assim por diante. Mas, novamente, isso só pode funcionar com o Firefox 3.6.

Answer 3

Agora é possível obter o tamanho do arquivo usando JavaScript puro. Quase todos FileReader suporte ao navegador, que você pode usar para ler o tamanho do arquivo, assim como você pode ver a imagem sem fazer upload do arquivo para o servidor. ligação

Código:

    var oFile = document.getElementById("file-input").files[0]; // input box with type file;
    var img = document.getElementById("imgtag");
    var reader = new FileReader();
    reader.onload = function (e) {
            console.log(e.total); // file size 
            img.src =  e.target.result; // putting file in dom without server upload.

   };
   reader.readAsDataURL(oFile );

Você pode obter o tamanho do arquivo diretamente do objeto de arquivo usando seguinte código.

 var fileSize = oFile.size;

Answer 4

A maioria destas respostas são muito out-of-date. Atualmente é possível determinar client-side tamanho do arquivo em qualquer navegador que suporte a API de arquivo. Isto inclui, praticamente, todos os outros do que IE9 e navegadores mais antigos.

Answer 5

Pode ser possível usar um monte de código específico do browser. Dê uma olhada na fonte de TiddlyWiki , que consegue se salvar no disco rígido do usuário ligando ao Windows Scripting host (IE), XPCOM (Mozilla), etc.

Answer 6

Eu não acho que há alguma maneira de fazer isso com JS simples de uma página web.
Com uma extensão de navegador, talvez, mas a partir de um javascript página não pode acessar o sistema de arquivos por razões de segurança.

Flash e Java deve ter restrições semelhantes, mas talvez eles são um pouco menos rigorosa.

Answer 7

Não é possível. seria uma grande preocupação de segurança para permitir scripts do lado do cliente para executar que pode ler informações do arquivo de e usuários finais disco rígido.

Answer 8

Veja aqui:

http: // www.kavoir.com/2009/01/check-for-file-size-with-javascript-before-uploading.html

Como a todas as pessoas dizendo que isso tem que ser do lado do servidor feito, eles são absolutamente local ele faz.

No meu caso, embora o tamanho máximo que será salvo é 128Mb, se um usuário tentar carregar algo que é 130 MB não deve ter que esperar o tempo de upload de 5 minutos para descobrir que é grande demais para que eu preciso fazer uma verificação adicional antes de enviar a página por causa usabilidade.