Selecionar arquivo - File select

Em HTML , um controle de arquivo de seleção é um componente de um formulário web com o qual um usuário pode selecionar um arquivo local. Quando o formulário é enviado (talvez em conjunto com outros dados do formulário), o arquivo é enviado para o servidor web . Lá, quando o arquivo chega, alguma ação geralmente ocorre, como salvar o arquivo no servidor web. No entanto, a ação específica que ocorre é determinado pelo script do lado do servidor para o qual o formulário é enviado.

exemplo de código

Aqui está um exemplo de código de um formulário web com um controle de arquivo de seleção. É o inputelemento com type="file"que cria o controle de arquivo de seleção.

<form action="form-handler.php" method="post" enctype="multipart/form-data">
	<div>
		<input id="myfile" name="myfile" type="file">
		<input value="Upload ►" type="submit">
	</div>
</form>

Renderização

Quando se trata de prestação na tela de um controle de arquivo de seleção, há alguma variação entre os navegadores . Normalmente, em uma plataforma baseada em Windows, os agentes irão processar um controle de arquivo de seleção como um campo de texto, juntamente com um botão "Browse". Quando o botão "Procurar" é pressionado, um diálogo de arquivo é aberto, com a qual a seleção arquivo real em uma plataforma pode ter lugar. Após a seleção, o nome do arquivo selecionado é exibido no campo de texto, com seu caminho completo. Alternativamente, em vez de usar o botão "Procurar", o nome do arquivo podem ser inseridos diretamente no campo de texto.

Alguns navegadores, nomeadamente Firefox , já não permitem um nome de arquivo a ser digitado diretamente no Esta é uma medida de segurança -. É possível enganar o usuário para upload de informações confidenciais.

funcionalidade

O mecanismo de carregamento de arquivo baseado em forma foi originalmente proposto em RFC 1867 (publicada em Novembro de 1995), como uma extensão para HTML 2.0 ( RFC 1866 ), após a sua publicação. Carregamento de arquivo baseado em forma, em seguida, foi incorporado em HTML 3.2, que se refere explicitamente à RFC 1867 para mais informações sobre carregamento arquivo baseado em forma.

HTML 4.01 não, por si só, descrever como o controle de arquivo de seleção é suposto para trabalhar, mas ele faz lista de RFC 2388 e RFC 1867 como referência.

seleção de arquivo múltipla

A intenção no RFC 1867 é que um único controle de arquivo de seleção deve permitir a seleção de vários arquivos. Esta intenção parece refletida em HTML 4.01, o que, para o tipo de controle- arquivo-select, estados

Este tipo de controle permite que o usuário selecione arquivos para que o seu conteúdo pode ser apresentado juntamente com um formulário. O elemento INPUT é usado para criar um controle de seleção de arquivos.

Tem-se observado que os "arquivos" plural na citação acima é uma indicação de que, em HTML 4.01, um único arquivo, selecione-controle ainda era suposto para lidar com seleção de vários arquivos e não apenas um único arquivo.

Esta situação está a ser esclarecido no HTML5, adicionando um atributo "múltipla" quando a entrada de arquivo deve aceitar vários arquivos. O actual projecto especifica o novo comportamento a ser:

A menos que o atributo múltipla é definida, não deve haver mais de um arquivo na lista de arquivos selecionados.

aceitar atributo

RFC 1867 também introduziu o acceptatributo para o inputelemento. Isto permitiria a filtragem do tipo de arquivo com base no tipo de MIME para o controle de arquivo de seleção.

Além disso, propõe-se que a etiqueta de entrada têm um atributo ACCEPT, que é uma lista de tipos de meios separados por vírgulas.

Se um atributo ACCEPT está presente, o navegador pode restringir os padrões de arquivo requisitado para coincidir com aqueles com os correspondentes extensões de arquivo apropriado para a plataforma.

Assim, um usuário-agente pode restringir seleção de arquivo, como, por exemplo, no seguinte, restrita a imagens GIF e PNG ou quaisquer imagens:

<input id="myfile" name="myfile" type="file" accept="image/gif,image/png">
<input id="myfile" name="myfile" type="file" accept="image/*">

Em uma plataforma Windows, isso pode significar que o usuário agente iria mostrar apenas os arquivos dos tipos especificados na caixa de diálogo de arquivo de procura.

limitações do navegador

Suporte básico para o controle de arquivo de seleção foi adotado rapidamente por fabricantes de navegadores. Por exemplo, já o Internet Explorer 4, Netscape Navigator 2.0 e Opera 3,5 reconheceu o inputelemento type="file"como um controle de arquivo de seleção.

No entanto, a maioria dos navegadores modernos ainda não implementar o controle de arquivo de seleção como foi planejado, ou a falta de certos recursos.

Não é possível selecionar vários arquivos

Upload-baseado forma de vários arquivos com um único controle arquivo-select é suportado nas versões atuais do Chrome, Firefox, Internet Explorer, Safari e Opera. Uma fonte afirma que o Opera suporta a seleção de múltiplos arquivos através de um único controle de arquivo de seleção. Isto era verdade para as versões do Opera a partir de 3.5, em que o recurso de carregamento de arquivo foi introduzido. No entanto, com a primeira versão beta do Opera 7 linha, esta função não estava mais disponível. Firefox versão 3.6 começou a apoiar a seleção de múltiplos arquivos, permitindo que o desenvolvedor algum acesso limitado aos arquivos de si antes de ser enviado para o servidor, através do HTML5 API Arquivo. Esse recurso também permite aos usuários arrastar e soltar arquivos a partir de aplicativos externos (como Windows Explorer ) diretamente no aplicativo web. Um exemplo notável de apoio para esta função é Gmail permitindo anexos para ser adicionado desta maneira.

HTML5 permite carregar múltiplos arquivos usando o múltiplo atributo em elementos de entrada.

alternativa JavaScript

Uma solução é usar scripts do lado do cliente , tais como JavaScript para gerar um controle de arquivo de seleção extra para cada arquivo que o usuário seleciona para upload. Usando CSS , esses controles de arquivo-select extras pode ser configurado para não exibir. Um exemplo desta técnica é demonstrado no upload de múltiplos arquivos de plugin para jQuery . Desta forma, o problema de upload de múltiplos arquivos é resolvido, fornecendo o maior número de controles de arquivo de seleção que o usuário tenha arquivos para upload. Ainda assim, isso não resolve o problema de selecionar vários arquivos para upload no Internet Explorer.

Aceitar o apoio atributo

O atributo aceitar é suportado pelo Opera 11+, 16+ Chrome, Safari 6+, Firefox 9 + e Microsoft Internet Explorer 10+.

Referências

  1. ^ "388.784 - (CVE-2007-3511) arquivo Firefox foco de entrada roubar vulnerabilidade" . Bugzilla.mozilla.org . Retirado 2013/09/02 .
  2. ^ "Arquivo Mozilla Firefox OnKeyDown Evento Vulnerabilidade Upload" . Juniper.net. 2010-11-15 . Retirado 2013/09/02 .
  3. ^ "Referências HTML 4 Specification" . W3.org . Retirado 2013/09/02 .
  4. ^ "Forms em documentos HTML" . W3.org . Retirado 2013/09/02 .
  5. ^ A b c "entrada de arquivo (ou "upload") em formulários HTML" . Cs.tut.fi . Retirado 2013/09/02 .
  6. ^ "Especificação HTML 5.1" . W3C.
  7. ^ "Input type = objeto de arquivo" . Msdn2.microsoft.com. 2013/07/22 . Retirado 2013/09/02 .
  8. ^ Um b "History Browser: Opera" . Blooberry.com . Retirado 2013/09/02 .
  9. ^ Em 10 de dezembro de 2009 por Paul Rouget (2009-12-10). "arquivo de entrada múltipla em Firefox 3.6 ✩ Mozilla Hacks - o blog do desenvolvedor Web" . Hacks.mozilla.org . Retirado 2013/09/02 .
  10. ^ "Usando arquivos de aplicações web - MDC" . Developer.mozilla.org. 2013/08/23 . Retirado 2013/09/02 .
  11. ^ HTML especificação 5.1: 4.10.5.3 atributos do elemento de entrada comum

links externos