Sistema de cadastro com upload de imagens (jpg, jpeg, gif, png)

Mais um script completíssimo ai pra vocês amigos da UpInside, neste mostramos um sistema completo de cadastro de usuários com validação de segurança, upload de foto, validação de tamanho, dimensões, extensões da imagem.

No ato do upload este script altera o nome da imagem para um nome único. E o tipo da imagem para jpeg, evitando uso de png no seu site e tornando a navegação mais rápida.

Video aula: Cadastro de usuários com upload de imagem!

Config.php:

<?php
$local = "localhost";
$usuario = "root";
$senha = "";
$selecione = "va";
?>

Script:

<?php include"conexao/config.php";

$conexao = mysql_connect("$local", "$usuario", "$senha")
 or die(mysql_error());
$db = mysql_select_db("$selecione")
 or die (mysql_error());

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Formulário de Contato Up Inside</title>
<link href="estilo.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="box">
<div id="formulario">
<form action="" method="post" enctype="multipart/form-data">
 <fieldset>
 <legend>Cadastre-se</legend>

<?php if (isset($_POST['enviar']) && $_POST['enviar'] == 'send') {

 $nome    = strip_tags(trim($_POST['nome']));
 $email   = strip_tags(trim($_POST['email']));
 $dia     = strip_tags(trim($_POST['dia']));
 $mes     = strip_tags(trim($_POST['mes']));
 $ano     = strip_tags(trim($_POST['ano']));
 $data    = strip_tags(trim($_POST['ano'])).'-'.strip_tags(trim($_POST['mes'])).'-'.strip_tags(trim($_POST['dia']));

 if (empty($nome)) {
 $retorno = '<span>Digite seu nome</span>';
 }elseif (empty($email)){
 $retorno = '<span>Digite seu e-mail</span>';
 }elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)){
 $retorno = '<span>Digite um e-mail válido</span>';
 }elseif (empty($dia)){
 $retorno = '<span>Informe o dia em que você nasceu!</span>';
 }elseif (empty($mes)){
 $retorno = '<span>Informe o mes em que você nasceu!</span>';
 }elseif (empty($ano)){
 $retorno = '<span>Informe o ano em que você nasceu!</span>';
 }if (empty($retorno)) {

$_UP['pasta'] = 'uploads/';
$_UP['tamanho'] = 1024 * 1024 * 2;
$_UP['extensoes'] = array ('jpg', 'jpeg', 'png', 'gif');
$_UP['renomeia'] = true;

$_UP['errors'][0] = 'Não tivemos errors';
$_UP['errors'][1] = 'A Pasta não foi encontrada';
$_UP['errors'][2] = 'O tamanho da imagem e maior que o permitido';
$_UP['errors'][3] = 'As extensões permitidas para o envio do arquivo são: jpg, png e gif';
$_UP['errors'][4] = 'Não foi feito o upload de sua foto, já existia outra com o mesmo nome';

if ($_FILES['arquivo']['errors'] != 0) {
 die("Não foi possivel enviar sua imagem o erro foi:" . $_UP['errors'][$_FILES['arquivo']['errors']]);
 exit;
}

$extensao = strtolower(end(explode('.', $_FILES['arquivo']['name'])));
if (array_search($extensao, $_UP['extensoes']) === false) {
 echo "Formato da imagem não e válido, envie com as extensões: jpg, gif ou png!";
}

else if ($_UP['tamanho'] < $_FILES['arquivo']['size']) {
 echo "O arquivo não pode ter mais de 2mb";
}

else {

 if ($_UP['renomeia'] == true) {
 $nome_final = md5(time()).'.jpeg';
 }else{
 $nome_final = $_FILES['arquivo']['name'];
 }

$tam_name = getimagesize($_FILES['arquivo']['tmp_name']);

if ($tam_name[0] >= '201') {
 echo "A imagem deve ter a largura menor ou igual a 200px";
}
if ($tam_name[1] >= '151') {
 echo "A imagem deve ter a altura menor ou igual a 150px";
}else

if (move_uploaded_file($_FILES['arquivo']['tmp_name'], $_UP['pasta'] . $nome_final)) {

 $cadastro = mysql_query("INSERT INTO usuarios (nome, email, data, foto) VALUES ('$nome', '$email', '$data', '$nome_final')");

 if ($cadastro == 1){
 echo '<span>Seu cadastro foi realizado com suscesso, Obrigado por fazer parte de nosso site!</span>';
 }else {
 echo '<span>Erro ao cadastrar, tente novamente</span>';
 }
}
}
}
if ($retorno == 0){
 echo "$retorno";
}else{
}
}
?>

 <label>
 <span>Nome</span>
 <input type="text" name="nome" />
 </label>

 <label>
 <span>E-mail</span>
 <input type="text" name="email" />
 </label>

 <span>Data de nascimento</span>
 Dia: <input type="text" name="dia" maxlength="2" />
 / Ano: <input type="text" name="mes" maxlength="2" />
 / Mes: <input type="text" name="ano" maxlength="4" />

 <label>
 <span>Foto</span>
 <input type="file" name="arquivo" size="16" />
 </label>
 <input type="hidden" name="enviar" value="send" />
 <input type="submit" name="Enviar" />

 </fieldset>
</form>
</div><!--formulario-->
</div>

</body>
</html>

Formatação:

*{margin:0; padding:0;}
body {background:#999; margin:50px;}

#formulario form {width:300px; display:block; margin:0 auto; background:#FFF;}
#formulario fieldset {border:0; padding:0 15px 10px 15px;}
#formulario legend {font:18px Tahoma, Geneva, sans-serif; color:#069; font-weight:bold; padding:10px 0; border-bottom:2px;}
#formulario label {display: block; padding:3px 0;}
#formulario span {display:block; font:16px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#069; font-weight:bold;}
#formulario input {padding:3px; width:260px; border:1px solid #069; font:16px Tahoma, Geneva, sans-serif; color:#069; font-weight:bold;}
#formulario textarea {padding:3px; width:260px; border:1px solid #069; font:16px Tahoma, Geneva, sans-serif; color:#069; font-weight:bold;}
#formulario .send {width:120px; display:block; margin:10px auto; cursor:pointer; border:0; background:#069; color:#FFF;}
#formulario .send:hover {background:#036;}

#formulario {color:#069;}
#formulario .diames {width:25px; text-align:center;}
#formulario .ano {width:60px; text-align:center;}

.yes {padding:3px; background:#EAFFD5; border:1px solid #0F0;}
.no {padding:3px; background:#FDD; border:1px solid #F00;}
Bookmark e Compartilhe

  • Cadastro de usuários com upload de imagem! | MX Masters – Conhecimento a um clique Falou

    Em: 28 de fevereiro de 2010 as 9:20

    [...] Os scripts desta vídeo aula você encontra em: http://www.upinside.com.br/codigo-pronto/sistema-de-cadastro-com-upload-de-imagens-jpg-jpeg-gif-png [...]

  • Deregudegu Falou

    Em: 12 de março de 2010 as 17:29

    cara adorei essa video aula!
    Valew!

  • rafa Falou

    Em: 16 de março de 2010 as 4:07

    Vlw Man VocÊ so Esqueceu Como se Chama o Estilo =D

    “estilo.css” Ta AE

  • Robson V. Leite Falou

    Em: 16 de março de 2010 as 10:56

    Ola Rafa, não necessariamente. O nome da folha de estilo pode ser definido como quiser, basta que chame por ele!

  • Adriano José Falou

    Em: 16 de março de 2010 as 21:50

    Robson, gostei do seu script, só que copiando seu código e fazendos os testes, não consegui enviar para o banco de dados! O css também não tá funcionando como o seu exemplo, não tem nada faltando ou to fazendo alguma coisa errada!
    (banco de dados configurado) e (css feito o apontamento certo).

    Valeu!
    Parabéns!

  • Robson V. Leite Falou

    Em: 16 de março de 2010 as 22:47

    Olá Adriano José, bem vindo. No link abaixo você encontra os scripts e arquivos usados nas aulas para download. baixe e compare com os seus!

    Qualquer dúvida fique a vontade para interagir novamente, forte abraço!

    http://www.upinside.com.br/video-aulas/exibindo-usuarios-cadastrados-e-aniversariantes

  • Fernando Falou

    Em: 21 de março de 2010 as 14:36

    Muito bom o Script!!!

    Só uma dica, que ao meu ver é importante…

    Para formularios grandes, com muitos input’s, seria bom colocar o value (ex.: value=”") para não perder os campos digitados corretamente. Caso a verificação encontre algum erro…

  • Fernando Falou

    Em: 21 de março de 2010 as 14:38

    Agora sim: (value = ” “) sem espaços

  • Karlaille Falou

    Em: 23 de março de 2010 as 15:50

    Gostei não, não acessa o banco de dados e está com vários erros

  • Ray Falou

    Em: 28 de março de 2010 as 4:11

    Vei essa -.- da para fazer automatico pelo dreanweaver so clicando em botões e vc metendo meio mundo de codigo manual, vai te lascar

  • Robson V. Leite Falou

    Em: 28 de março de 2010 as 10:37

    @Ray:Ola meu querido, a vídeo aula referente a este script foi de PHP, não de dreamweaver, a intenção da mesma e ensinar a programar e não a clicar com o mouse!

    Mas se você quiser gravar vídeo aulas de DW e nos enviar será bem vindo no site!

  • @fer Falou

    Em: 30 de março de 2010 as 11:18

    opa amigo, muito xou esse código e funciona só que será que vc poderia adicionar o redimensionamento da imagem antes de inserir, cara desde ja agradeço,,,vlw.

  • Aislan Renedy Falou

    Em: 6 de abril de 2010 as 17:59

    Olá Robson baixei os arquivos mudei o caminho p/ meu banco de dados mas esta dando esse erro
    Warning: move_uploaded_file(uploads/d0a13e1d99bfa6d17b89bdd81ca47377.jpg) [function.move-uploaded-file]: failed to open stream: Permission denied in /home/topagitus/www/cadastro/index.php on line 92

    Warning: move_uploaded_file() [function.move-uploaded-file]: Unable to move ‘/var/lib/php/phpPK5Vi8′ to ‘uploads/d0a13e1d99bfa6d17b89bdd81ca47377.jpg’ in /home/topagitus/www/cadastro/index.php on line 92

    oq pode ser isso ?

    gostei muito da aula estou doido p/ ver isso em meu site mas ainda nao descobri o erro.

    desde já agradeço sua ajuda !

  • Aislan Renedy Falou

    Em: 6 de abril de 2010 as 19:36

    olhei aq a linha 92 é
    if (move_uploaded_file($_FILES['arquivo']['tmp_name'], $_UP['pasta'] . $nome_final)) {

    oq sera q esta errado ?

  • Eliabe Falou

    Em: 24 de abril de 2010 as 1:51

    e ai robson será que tinha como você criar um tutorial de um sistema de uploads de videos em flv, avi, 3gp, e os mesmos sendo exibidos na index. vlw cara abraço.

  • thiago Falou

    Em: 28 de abril de 2010 as 9:32

    muito boa a video aula, mas num achei a base de dados?????

  • emanuel Falou

    Em: 19 de maio de 2010 as 10:10

    Robson, gostaria de saber qual os dados do banco de dados.

  • weliton Falou

    Em: 21 de maio de 2010 as 0:04

    estou terminando meu site da radio queria esse negocio de cadastro de usuarios so q nao intendi muito bem..
    e tipo nao tem a parada para enviar para o
    phpadmin do cpanel?
    q eh arquivo sql?

    se voce poder me ajudar entre em contato!
    Ajuda em divulgação pos possuo site de hospedagem site de mu online e a radio!

    obriago ate mais.

  • Rik Falou

    Em: 30 de maio de 2010 as 18:33

    MANOLO, POEM O CÓD SQL DA TABELA USUÁRIOS MANO!!!

  • fabio Falou

    Em: 2 de junho de 2010 as 23:58

    ola ! Robson
    logo no inicio do meu código ocorrendo o erro “No database selected”
    possivelmente esse erro esta vinculado ao banco de dados talvez não esta encontrando vc tem alguma video aula de como exporta o banco de dados ?
    agradeço desde ja.

  • Ivanildo Pereira Falou

    Em: 13 de junho de 2010 as 0:34

    Vocês resolveram o erro do Aislan Renedy aí em cima. Tô com o mesmo problema. Dá pra dar o bizu…

  • Peter Falou

    Em: 16 de junho de 2010 as 3:45

    Olá Robson, parabéns pela video-aula, 10 cara, só que estou com um probleminha, eu crie o Formulário que vc postou, só que não consigo conectar ao Banco de Dados Mysql, meu site é este http://www.jcimoveisbrasil.com então meu site esta hospedado no UOL-HOST, e uso o Wamp-server para conexão em PHP, sabendo eu que tbm no UOL-HOST têm o php my adm, o próprio banco de dados, só que nem no prórprio banco do UOL e nem pelo WAMP consigo me conectar, agora me diga é possivel se conectar aos dados do meu site na UOL usando o wamp-server, desde já agradeço a sua Atenção… Abraço.

  • Peter Falou

    Em: 16 de junho de 2010 as 3:47

    Ah ia me esqueçendo o link onde esta o Formulário da sua veideo-aula é este http://www.jcimoveisbrasil.com/novoform.php
    Valew…

  • Robson V. Leite Falou

    Em: 16 de junho de 2010 as 8:27

    @Peter: o Wamp-Servr é um servidor local, ele cria uma banco de dados, uma apache, um PHP. não server para se conectar a um banco e sim para criar! no item que você não consegue se conectar, entre em contato com o suporte de sua hospedagem para obter as informações de acesso ao seu banco de dados!

  • Peter Falou

    Em: 16 de junho de 2010 as 14:47

    Ah sim blz obrigado pela dica Robson, então este formulário se eu configurar a entrada no banco de dados ele têm que funcionar direitinho para o usuário enviar as fotos correto, este script em php que manda os dados para o servidor, ele têm que ficar mesmo dentro do código HTML, ou pode ficar numa pasta separada, como mostra na sua página.

  • Robson V. Leite Falou

    Em: 16 de junho de 2010 as 17:33

    @Peter: pode ficar em uma página separada, mas lembre de salvar o arquvio com extenção PHP (arquivo.php) do contrario não será executado o script!

  • Jeovane Falou

    Em: 17 de junho de 2010 as 1:25

    Obrigado vou tentar configurá-lo caso não consiga, vou te perturbar de novo..rsrsrsr. valew mano abraço…

  • bruno Falou

    Em: 24 de junho de 2010 as 9:03

    Bom dia Robson, primeiramente gostaria de parabeniza-lo pela excelente vídeo aula, o sistema de cadastro ficou show de bola. Gostaria de saber se tem como você fazer uma nova versão desse sistema. Eu tenho um sistema de cadastro com login e senha e tentei integra-lo ao seu, algo do tipo:
    o usuario preenche o cadastro do meu sistema com
    – nome , usuario e senha
    logo após ele será redirecionado para a pagina perfil.php onde entrará o seu sistema

  • bruno Falou

    Em: 24 de junho de 2010 as 9:13

    ao entrar em perfil.php ele terá a opção de atualizar os dados que será o seu sistema, com fotos, data de nascimento, email e por ai vai. Tentei integrar esses sistemas porem sem sucesso. Não sei como fazer com que a página perfil.php apresente somente os dados do usuario logado, sei que tem como pegar as veriáveis através de cockies ou sessões mais não consegui implementar. Fiz as modificações no BD e não adiantou. Teria como você passar algum macete, a lógica que devo usar para alcançar este meu objetivo??? Estou querendo demais já né rsrs, mais acho que seria um ótimo tutorial tendo em vista que não se encontra algo tão completo assim na internet.
    No mais deixo a minha proposta e aguardo um retorno

    Att
    Bruno

  • Robson V. Leite Falou

    Em: 24 de junho de 2010 as 13:10

    Olá Bruno deixe seu pedido em nosso Fórum

  • jesus vieira de lima Falou

    Em: 8 de julho de 2010 as 3:32

    Olá á todos, o Site Upinside sempre renovando…

    Robson sera que nao teria como vc fazer as imagens alto redimencionar para outro tamanho , tipo a pessoa faz upload com uma imagen de qualquer resoluçao ai quando ela for salva no servidor ela teria um redimencionamento especificado pelo programado tipo se a imagem original é de 1024 x 768 ela ser redimencionado para 500 x 500 e salva na pasta uploads…..

  • JEOVANE Falou

    Em: 10 de julho de 2010 as 1:58

    Oi poderia me ajudar com este formulario que criei…http://www.jcimoveisbrasil.com/f3000.php.

    Agradeço…

  • Deregudegu Falou

    Em: 10 de julho de 2010 as 18:11

    @Jeovane, me add no meu msn que eu te ajudo:

    andrezinho_dede_10@hotmail.com

  • Jeovane Falou

    Em: 16 de julho de 2010 as 15:07

    Olá Robson então achei um sistema de light-box que se chama High-slide, tem o mesmo efeito que o Light-box só que com mais recursos, fiz tudo por aqui para fazer ele rodar em meu site, da uma olhadinha em meu código fonte deste link do meu site: http://www.jcimoveisbrasil.com/ligthbox.html só que ocorre o evento agora veja este site:
    http://www.spaziomooca.com.br/detalhe_imovel.php?id=107

    Este site funciona direitinho, poderia me ajudar desde já agradeço.

  • Eddy Santos Falou

    Em: 18 de julho de 2010 as 11:48

    Oi Robson.. Em primeiro lugar quero parabenizar vc por essa excelente video aula.. Bem Explicada e muito util..
    Fiz todos os passos, deu tudo certinho.. Só que ta acontecendo um erro, quando faço o cadastro ele faz normalmente, só que ele só ta gravando 1 Registro.. Quando coloco pra gravar o outro ele da erro.. O que será que devo ta fazendo errado?!! Por favor não apenas ele mas se alguem souber por favor responde por favor.. OBS: Sou leigo ainda nessa area mas sempre buscando os conhecimentos.. Grato! Abraços!!

  • Robson V. Leite Falou

    Em: 18 de julho de 2010 as 13:39

    @Eddy Santos: Olé meu querido, isto geralmente acontece quando esquecemos do auto increment no campo ID!

  • Leandro Falou

    Em: 18 de julho de 2010 as 16:49

    Olá, excelente vídeo aula. Me tire uma dúvida: Como eu faço para cadastrar, além do que você já fez, uma senha para cada usuário e depois uma opção, onde o usuário faz o login para alterar a foto?

  • Peter Falou

    Em: 26 de julho de 2010 as 18:34

    OLA ROBSON PODERIA ME AJUDAR NESTE FORMULÁRIO, http://www.jcimoveisbrasil.com/f3000.php coloquei mais alguns campos para meu site só que estes campos que add não chegam as informações no banco de dados poderia me dar uma força…
    Desde já fico grato..

  • Eddy Santos Falou

    Em: 29 de julho de 2010 as 11:56

    Consegui resolver aqui Robson.. Já esta funcionando a alguns dias.. O que tou achando estranho agora é que tem algumas pessoas que não estão chegando a data.. Só ta chegando 0000-00-00.. Alguns chegam normalmente.. Agora outros chegam só 0.. E ai sabe como poderia solucionar??!!
    Grato!! Abraços!!

Leave a comment

Sobre o Autor

Robson V. Leite

23 Anos, Residente da cidade de Florianopolis SC. Trabalha com web desde 2006, sempre busca aprender novas tecnologias.

http://www.upinside.com.br/ contato@upinside.com.br

Dados do Artigo

27 fev 2010 as 16:02

4.984 Visitas

39 Comentários

RSS deste Artigo

OPNIÕES

  • Quais dos conteúdos abaixo te chamam mais atenção!

    View Results

    Loading ... Loading ...

Publicidade

Notícias