Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

vitorhenrique

Envio de File por Ajax

Por , em Javascript

Recommended Posts

vitorhenrique    0

vitorhenrique
Postado

Boa tarde Pessoal,

Estou com uma duvida já algum tempo.

Acontece que eu gostaria de saber como posso adaptar umas das funções do ajax no meu script para possibilitar o envio de arquivos para a página PHP.

 submitHandler: function( form ){
	             

                    var nome  = $('#nome').val();
                    var nick = $('#nick').val();
                    var item   = $('#item').val();
                    var valor  = $('#valor').val();
                    var forma = $('#forma').val();
                    var caixa   = $('#field').val();
                    var hd1   = $('#hd1').val();
                    var hd2   = $('#hd2').val();
                    var mensagem   = $('#mensagem').val();
                    var urlData = "&nome=" + nome + "&nick=" + nick + "&item=" + item+ "&valor=" + valor+ "&forma=" + forma+ "&caixa=" + caixa+ "&hd1=" + hd1+ "&hd2=" + hd2+ "&mensagem=" + mensagem;



	            $.ajax({ 
                        
	                type: "POST",  
	                url: "mensagem.php",  
	                data: urlData,
			   success: function(data) { /* sucesso */
       /* alert(data) */
       /* pode ser utilizado um alert para ver o retorno */
      $('#retornoHTML').html(data); /* imprime o retorno no HTML */
   },
   beforeSend: function() { /* antes de enviar */
      $('.loading').fadeIn('fast'); /* mostra o loading */
   },
   complete: function(){ /* completo */
      $('.loading').fadeOut('fast'); /* esconde o loading */
   }
	            });  

	            return false;  
	        }  
	    });

Grato desde já.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

ajax não envia arquivos.

Compartilhar este post

Link para o post
Compartilhar em outros sites

GustavoKatel    1

GustavoKatel
Postado

Olá amigo, na verdade tem como sim. Vou descrever os passos. Estou procurando tempo para escrever uma biblioteca para isso.

 

1 - Você precisará que o navegador tenha suporte para a API FileReader no JavaScript. (Mais em https://developer.mozilla.org/en-US/docs/Web/API/FileReader )

2 - De posse da API FileReader você irá ler o arquivo e codificar o mesmo em base64. Segue um exemplo de como ler o arquivo e como fazer a codificação.

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
window.onload = function(){
	$('#file-input').on('change', function(e) {
		var files = e.target.files;

		if (!files || files.length == 0) return;
		var file = files[0];

		var fileReader = new FileReader();
		fileReader.onload = function (e) {
			// Here we get the b64 file string
			var b64 = e.target.result.split(",")[1];
			$('#file-b64').text(b64);
		};
		fileReader.readAsDataURL(file);
	});
}
</script>

</head>
<body>

<input type="file" id="file-input" value="Load a file" />
<div id="file-b64"></div>
</body>
</html>

3 - Com o arquivo codificado, você terá uma string (provavelmente muito grande!) que representa o conteúdo do arquivo. Faça o POST para o php.

4 - No php, a função base64_decode() irá recuperar o arquivo codificado e a função file_put_contents() irá escrever o conteúdo em arquivo.

5 - Upload feito.

Compartilhar este post

Link para o post
Compartilhar em outros sites

vitorhenrique    0

vitorhenrique
Postado

Muito obrigado pela resposta GustavoKatel,

Estou com um pequeno problema na hora de gerar o file no php :

$arquivo =   base64_decode($file);
$nome = "vitor.jpg";
$arquivo2 =  file_put_contents($nome,$arquivo,FILE_APPEND);

Ele não gera o arquivo.

Compartilhar este post

Link para o post
Compartilhar em outros sites

GustavoKatel    1

GustavoKatel
Postado

Provavelmente sua string em base64 está sendo truncada.

Está colocando ela dentro de um input? Se sim, verifique o tamanho máximo desse input.

Tente também enviar a string diretamente ao PHP usando o método POST do jquery ou ajax diretamente.

Se nada funcionar cole a string em uma variável em PHP e escreva seu conteúdo diretamente.

<?php
   $arq_content = base64_decode("MY_BASE64_STRING");
   $nome = "meu_arquivo.jpg";
      file_put_contents($nome, $arq_content);
?>

 

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito