Ir para conteúdo

POWERED BY:

Arquivado

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

Kharel

[Artigo 3] Cadastro com upload de imagens

Recommended Posts

Bom dia pessoal!!

Hoje vamos ver uma função bem legal e útil.

Cadastro de contatos com upload de imagem, mas com um detalhe muito importante, não podemos permitir que os nomes se repitam no servidor, imagino? Imagem de 2 contatos se misturando? Catástrofe, né?!!

Este artigo admite que você já saiba criar um banco de dados

Blog de referência:

http://blogdokhal.valtingojer.com.br/

Disponibilizo também, uma cópia das páignas utilizadas neste artigo com os códigos fonte sem coments: http://blogdokhal.va...er.com.br/?p=29

Recomendo sempre que mantenha os comentários assim você pode sempre ter uma boa referência no seu arquivo fonte :).

Vamos começar vendo nossa estrutura de pastas.

 

Imagem Postada

 

Para facilitar a manutenção, usamos as boas práticas de utilizar uma pasta separada para cada área do sistema, de maneira como se fossem módulos.

Neste caso temos 4 pastas principais para a execução deste artigo.

Pasta img - Esta comportará as imagens gerais de nosso sistema, dentro delas temos uma Pasta específica de nosso Artigo que comportará as imagens do contatos, as que vamos fazer upload neste artigo.

Pasta do artigo que contem nosso arquivo de execução do sistema (arquivo.php).

Pasta Connections - Que comporta hoje nosso arquivo de conexão com o banco de dados.

Vamos agora construir nossa base de dados. Utilizaremos a mesma base MySql do artigo anterior.

A base criada foi.

 

CREATE TABLE `blog_do_khal_artigos`.`contatos` ( 
`id` INT( 11 ) NOT NULL AUTO_INCREMENT ,
`nome` VARCHAR( 255 ) NULL ,
`descricao` VARCHAR( 255 ) NULL ,
`email` VARCHAR( 255 ) NULL ,
`foto` VARCHAR( 255 ) NULL ,
PRIMARY KEY ( `id` , `email` ) 
) ENGINE = MYISAM CHARACTER SET utf8 COLLATE utf8_general_ci COMMENT = 'Cadastro de contatos'; 

 

Vamos dar uma checada em nosso arquivo que fará conexão com o banco de dados.

<?php
$hostname_artigos = "localhost"; // endereço do banco de dados
$database_artigos = "blog_do_khal_artigos"; // nome da base de dados
$username_artigos = "root"; // nome do usuário
$password_artigos = ""; // senha no caso sem senha
$artigos = mysql_pconnect($hostname_artigos, $username_artigos, $password_artigos) or die (mysql_error()); //função para conectar no banco, se nao conectar retorna o código de erro.
mysql_select_db ($database_artigos); // seleciona o banco de dados utilizado
?>

 

LEMBRETE: Sua estrutura de pastas deve estar previamente criada e a pasta que irá receber as imagens DEVE estar com permissão de escrita. Verifique com seu provedor o procedimento correto para atribuir as permissões, GERALMENTE e eu disse GERALMENTE um botão direito na pasta de destino atravéz do ftp lhe permitirá editar permissões, entenderam o GERALMENTE ??? que bom :).

No caso de você estar utilizando um servidor local seja ele na sua máquina ou na sua rede ou até mesmo em um hamachi da vida temos algumas dicas!

Para usuário Linux, de acordo com sua configuração pode ser necessário fazer um "chmod 777".

Para usuários Windows, de acordo com sua configuração pode ser necessário dar um botão direito > propriedades e adicionar permissão de escrita.

Vamos agora criar nosso form para cadastro de nossos contatos:

 

<!-----
temos aqui a abertura do formulario, action estamos setando nosso próprio arquivo para
resolver nosso formulário "artigo3.php" e adicionando o parâmetro "?envia" como referência
de quando executar a inserssão no banco - damos destaque também ao comando enctype="multipart/form-data"
com isso indicamos que o formulário terá campos com arquivo anexado
------>
<form method="post" action="artigo3.php?envia" name="envia_foto" enctype="multipart/form-data">
<!-----
Esta linha tem o seguinte destaque, no campo type onde escolhemos (type="file")
isso informa que este campo terá um arquivo anexado.
----->
Foto:<input name="foto" type="file" id="foto" size="1" /><br>
Nome:<input name="nome"><br>
Email:<input name="email"><br>
Descricao:<input name="descricao"><br>
<input name="Enviar" value="Enviar" type="submit">
</form>

 

Com o form feito, vamos pedir a conexão com o banco.

Na primeira linha do teu arquivo coloque o seguinte comando.

 

<?php require('../Connections/artigos.php') ?>

 

Isso permitirá buscar nosso arquivo de conexão com o banco.

 

Agora vamos resgatar os dados enviados e inserir no banco!

 

<?php
if ( isset( $_GET[ 'envia' ] ) ) //primeiramente usamos o isset, ele nos permite verificar se um valor foi
//recebido, neste caso queremos verificar se o $_GET['envia'] existe, $_GET['envia'] significa um
//parâmetro em GET que é um parâmetro no endereço da página. Lembra em nosso formulário que
//fizemos action="artigo3.php?envia" o "?envia" faz com que o action carregue a página com o
//parâmetro "envia" em formato get. Desta maneira ele vai recarregar a página e ativar esta
//primeira parte de nosso código.


{
if ( isset( $_POST ) ) //Nesta linha verificamos se o $_POST está presente, assim evitamos alguns
//acidentes, o $_POST foi o formato de envio de informações que utilizamos em nosso formulário
//lembra? na criação do formulário (method="post"). Então só teremos nosso sistema executado se
//a página for carregada com ?envia e vierem dados em $_POST do forumlário, essa verificação
//dupla evita que tenhamos algum erro ao favoritar a página com parâmetro "?envia".
{
	$nome = $_POST[ 'nome' ]; //Aqui criamos a variavel "$nome" e atribuimos a ela um valor
	//igual aos dados enviados pelo forrmulário em métido post no campo nome.


	$email = $_POST[ 'email' ]; //Aqui criamos a variavel "$email" e atribuimos a ela um valor
	//igual aos dados enviados pelo forrmulário em métido post no campo email.


	$descricao = $_POST[ 'descricao' ]; //Aqui criamos a variavel "$descricao" e atribuimos a ela
	//um valor igual aos dados enviados pelo forrmulário em métido post no campo descricao.


	$foto = $_FILES[ 'foto' ][ 'name' ]; //Neste ponto criamos a variável foto, atribuímos a ela o
	//$_FILES['foto'] assim ele identifica o campo foto do nosso formulário e adicionamos o ['name']
	//utilizamos desta maneira porque o $_FILES tem uma sintax diferenciada onde ele identifica o
	//campo e com o ['name'] ele recebe o valor desse campo, que no caso seria o nome do arquivo anexado.


	$tmp_foto = $_FILES[ 'foto' ][ 'tmp_name' ]; //Neste ponto criamos a variável $tmp_foto que
	//guardará uma posição temporária do seu arquivo para ser utilizado durante a transferência do
	//anexo.
	do { //Neste ponto começamos um loop, este loop tem o destino de não permitir que tenhamos
		//dois arquivos com o mesmo nome no servidor, por mais que sejam enviados duas fotos com o
		//mesmo nome, é este loop que cuidará de renomear este arquivo. E caso seja renomeado com um
		// nome existente, ele o fará novamente até que o nome seja único.


		$num = rand( 0 , 9999999999 ); //Aqui criamos a variavem $num e atribuimos a ela um
		// random entre o numero 0 e o numero 9999999999, veja, este número é o maior número que a
		// variável rand comporta. Fato até o momento em que este artigo foi escrito 30/Março/2010 com
		// PHP 5. Neste campo poderia ser utilizado da seguinte maneira também.
		// rand(-9999999999, 9999999999) dando assim uma gama maior para o randon trabalhar.


		$diferencia = $num . "-"; // Nesta linha criamos o $diferencia, ele é responsável por
		// concatenar o random com um separador, escolhi o "-" como separador.


		$local_foto_serv = "../img/artigo3/" . $diferencia . $foto; //Neste ponto concatenamos o local
		// onde ficará nossa foto, com o $diferencia, com o nome do arquivo, lembrando que este será o
		// campo inserido no banco de dados, ou seja o BD vai receber apenas o caminho da imagem, e o
		// campo img no html que utilizará este caminho para exibir a foto.


		$consulta = sprintf( "SELECT * FROM contatos WHERE foto='$local_foto_serv'" ); //Neste momento atribuimos a variável $consulta, a consulta que
		// faremos ao banco de dados, verificamos se já existe algum campo no banco de dados com o exato
		// caminho que estamos tentando inserir, ou seja com o mesmo nome de imagem e o mesmo
		// random.


		$sql_consulta = mysql_query( $consulta , $artigos ) or die( mysql_error() ); //Nesta linha
		// executamos a consulta feita na linha de cima utilizando a conexão existente no nosso arquivo de
		// conexão.


		$sql_rows_consulta = mysql_num_rows( $sql_consulta ); //Utilizamos aqui o
	// mysql_num_rows ele conta o número de linhas que nossa consulta retornou, ou seja se a consulta
	// ao banco de dados retornou 2 resultados, issa variável terá o valor 2, referente a duas linhas, se a
	// consulta não retornou resultados então o valor dessa variável será 0 referente a nenhuma linha.


	} while ( $sql_rows_consulta != '0' ); //Aqui fechamos o loop falando o seguinte: "Olha aqui
	//servidor, enquanto o número de linhas da minha consulta for diferente de '0' quer dizer que existem
	//nomes iguais de imagens!! E isso não pode acontecer, então me faz um favor, crie novamente o
	//nome até que a consulta ao banco retorne '0' o que significa que não existem nomes iguais de
	//imagem" :).


	if ( move_uploaded_file( $tmp_foto , $local_foto_serv ) ) //Nesta linha verificamos se o arquivo que
	// está guardado na variável tmp_foto foi enviado com sucesso para o local_foto_serv, ou seja se a
	// foto saiu do seu computador e chegou no servidor com sucesso.


	{
		$sql_inserir = "INSERT INTO contatos (nome, descricao, email, foto) VALUES ('$nome', '$email', '$descricao', '$local_foto_serv')"; //Caso o arquivo tenha sido inserido com sucesso
		// atribuimos a variável $sql_inserir o comando sql para inserir dentro do banco de dados os dados
		// digitados no formulário.


		if ( $query = @mysql_query( $sql_inserir ) or die( "Erro ao enviar a imagem " . mysql_error() ) ) //Aqui verificamos se a inserção foi executada, lembrando que esta linha pode
		// dar como inserção OK e por algum motivo os dados podem não chegar ao seu banco, então na
		// primeira execução sempre verifique no banco de dados se os dados estão sendo inseridos com
		// sucesso!
		{
			echo "<h2>Cadastro efetuado com sucesso!</h2>"; //No caso de ter tido sucesso
		// mostramos a mensagem ao lado.


		} else
			echo "<h2>Erro ao enviar imagem, tente novamente<h2>"; //No caso de erro usamos a
	// mensagem ao lado
	} else
		echo "<h2>Erro ao enviar imagem, tente novamente<h2>"; //No caso de erro ao enviar a
// imagem, usamos a mensagem ao lado
}
}
?>

 

Legal! Nosso envio de arquivo já está funcionando como deveria!

Que tal exibirmos os dados ? Vamos usar esta mesma página, que conforme for cadastrando já exibirá para nós os itens cadastrados!

Fizemos um pequeno código abaixo do formulário::

<hr />
// hr faz uma linha de ponta a ponta
<h2>Usuarios Cadastrados</h2>
<hr />
<?php
$sql_cadastro = "SELECT * FROM contatos"; // Guardamos o comando de consulta no $sql_cadastro
$consulta_cad = mysql_query( $sql_cadastro ) or die( mysql_error() ); // Executamos a consulta no banco
$result_consulta_cad = mysql_fetch_assoc( $consulta_cad ); // Guardamos o resultado na variável $result_consulta_cad - para isso utilizamos o comando mysql_fetch_assoc
do { // Iniciamos um loop para exibir todos os resultados
?>
<!---- Abaixo linha a linha vamos exibindo os dados com $result_consulta_cad para puxar o resultado ['campo_no_banco'] para exibir o resultado referente aquele campo. O comando echo permite imprimir este resultado na tela, em resumo. Seria algo como Mostre (echo) resultado da consulta ao banco ($result_consulta_cad) no campo XXX (['XXX']). ---->

<img src="<?php
echo $result_consulta_cad[ 'foto' ];
?>">
<br />
Nome: <?php
echo $result_consulta_cad[ 'nome' ];
?><br />
E-mail: <?php
echo $result_consulta_cad[ 'email' ];
?><br />
Descricao: <?php
echo $result_consulta_cad[ 'descricao' ];
?><br />
<hr />
<?php
} while ( $result_consulta_cad = mysql_fetch_assoc( $consulta_cad ) );
?>
<!----- Finalizamos a exibição com o fim do loop, pedindo para que ele execute este comando enquanto existirem resultados na consulta ao banco ---->

 

É isso ai galera!!

Espero que tenham gostado deste artigo, em breve teremos mais !!

 

@Carlos Eduardo

Carlos! tudo em conformidade? <> como pode ver deixei uma página externa só para os códigos sem coments assim o post não fica mostruoso, sem problemas ? Qualquer coisa da um halo! que agente vai ajustando pra ficar na melhor conformidade :).

 

Abraços!

Kharel Mourel Valtingojer

Compartilhar este post


Link para o post
Compartilhar em outros sites

Legal @Kharel,

 

Só não se esqueça de utilizar BBCode ao postar códigos pois facilita a leitura dos mesmos.

 

;)

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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