Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. PHP
Code

Área de membro com PHP

by
Difficulty:IntermediateLength:LongLanguages:

Portuguese (Português) translation by Damião Brito (you can also view the original English article)

Um tutorial para iniciantes absolutos! Não importa onde você vá na Internet, há um grampo que você encontra em quase todos os lugares - registo de utilizador. Se você precisa que seus usuários se registrem por segurança ou apenas por um recurso adicional, não há nenhuma desculpa para não fazê-lo com este tutorial simples.  Neste tutorial nós veremos os conceitos básicos de gerenciamento de usuários, finalizando com uma área de membro simples que você pode implementar em seu próprio site.

Introdução

Neste tutorial nós vamos passar por cada etapa para fazer um sistema de gerenciamento de usuário, juntamente com um sistema de mensagens privadas do usuário. Vamos trabalhar com PHP e com um banco de dados MySQL para guardar todas as informações do usuário.  Este tutorial foca em iniciantes em PHP, portanto nenhum conhecimento avançado é necessário - de fato, talvez você fique um pouco entediado caso você seja um usuário experiente em PHP!

Este tutorial destina-se à uma introdução básica às sessões e ao uso de bancos de dados em PHP. Embora o resultado final deste tutorial possa não parecer imediatamente útil para você, as habilidades que você ganhar com este tutorial lhe permitirá continuar a produzir um sistema de membros de sua preferência; adequando às suas próprias necessidades.

Antes que você comece este tutorial, certifique-se de ter em mãos as seguintes informações:

  • Nome do host do banco de dados - este é o servidor hospedado no seu banco de dados, na maioria das situações, este será simplesmente o 'localhost'.
  • Nome do banco de dados , nome de usuário do banco de dados, senha do banco de dados - antes de iniciar este tutorial, você deve criar um banco de dados MySQL, se você tiver a habilidade, ou ter na mão a informação para se conectar a um banco de dados existente. Esta informação é necessária durante todo o tutorial.

Se você não tiver esta informação, então o seu provedor de hospedagem deve ser capaz de providenciar isto para você.

Agora que já temos as formalidades do caminho, vamos começar com o tutorial!

Passo 1 - Configuração Inicial

Configurando o banco de dados

Como indicado na introdução, você precisa de um banco de dados para continuar com o prosseguimento do tutorial. Para começar, vamos criar uma tabela neste banco de dados para armazenar nossas informações de usuário.

A tabela que precisamos irá armazenar nossas informações de usuário; para nossos propósitos, usaremos uma tabela simples, mas que seria fácil armazenar mais informações em colunas extras, se é isso que você precisa. No nosso sistema, nós precisamos das quatro colunas a seguir:

  • UserID (Primary Key) - IDdeUsuario (Chave Primária)
  • Username (NomeDeUsuario)
  • Password (Senha)
  • EmailAddress (EnderecoDeEmail)

Em termos de banco de dados, uma Chave Primária (Primary Key) é o campo que identifica a linha. Neste caso, UserID será a nossa Chave Primária. Como nós queremos incrementar cada vez que um usuário se registra, nós vamos usar a opção especial do MySQL - auto_increment.

A query SQL para criar a nossa tabela está incluída abaixo, e será geralmente executada na guia 'SQL' do phpMyAdmin.

Criando um arquivo Base

Para simplificar a criação de nosso projeto, vamos criar um arquivo de base que podemos incluir em cada um dos arquivos que criamos. Este arquivo irá conter as informações de conexão de banco de dados, juntamente com certas variáveis de configuração que vão nos ajudar ao longo do caminho.

Comece criando um novo arquivo base.php, e insira nele o código a seguir:

Vamos dar uma olhada em algumas dessas linhas, bora lá? Haverá algumas funções aqui que nós usaremos e que ainda não as explicamos, portanto vamos dar uma olhadinha nelas cuidadosamente e conseguir entendê-las -- se você já entende os fundamentos básicos do PHP, talvez você queira pular esta explicação. 

Esta função inicia uma sessão para o novo usuário, e mais adiante neste tutorial nós vamos armazenar informações nesta sessão, que nos permitirá reconhecer quem já fez login. Se uma sessão já foi criada, esta função vai reconhecer e, então, carrega essa sessão para a próxima página.

Cada uma dessas funções trabalham separadamente, mas com tarefa vinculada. A função mysql_connect conecta o nosso script com o servidor do banco de dados usando a informação que nós demos a ela acima, e a função mysql_select_db, em seguida, escolhe qual o banco de dados a ser usado com o script.  Se a propósito as funções falharem ao completar, a função die automaticamente vai intervir e parar o script de processar - deixando na tela uma mensagem de que houve um erro de MySQL.

Passo 2 - Do Back ao Front-End

O que Precisamos Fazer Primeiro?

O item mais importante na nossa página é a primeira linha do PHP; esta linha incluirá o arquivo que nós criemos acima (base.php), e que essencialmente nos permitirá acessar qualquer coisa desse arquivo em nosso arquivo atual. Nós faremos isto com a seguinte linha de código em PHP. Crie  um arquivo chamado index.php, e coloque este código no topo.

Comece a página HTML

A primeira coisa que vamos fazer para o nosso front-end é criar uma página onde os usuários inserirão seus detalhes de  login, ou se eles já estão loggados na página onde podem escolher o que desejam fazer. Neste tutorial, eu vou presumir que os usuários tenham conhecimento básico de como o HTML/CSS funciona, e, portanto, não vou explicar este código detalhadamente; no momento esses elementos serão desestilizados, mas seremos capazes de mudar isso mais tarde quando nós criarmos a nossa folha de estilos (CSS).

Usando o arquivo que acabamos de criar (index.php), insira o seguinte código HTML abaixo da linha do PHP que nós já criemos.

O que Mostramos a Eles?

Antes que o resto da página seja mostrado, temos algumas perguntas a nos perguntar:

  1. O usuário já está loggado?
  • Sim - precisamos mostrá-los uma página com opções para que eles escolham. 
  • Não - nós continuamos para a próxima pergunta.
  • O usuário já enviou seus dados de login?
    • Sim - precisamos checar seus dados e, se sim, nós loggaremos eles no site.
    • Não - nós continuamos para a próxima pergunta.
  • Se ambas as respostas acima foram respondidas como Não, nós agora podemos assumir que precisamos mostrar um formulário de login ao usuário. 
  • Essas perguntas são, de fato, as mesmas que vamos implementar dentro do nosso código PHP. Vamos implementar isto no formulário do if statements (instruções if). Sem inserir nada dentro de qualquer dos seus novos arquivos, vamos dar uma olhada na lógica que usaremos primeiro.

    Parece confuso, não? Vamos dividir isso em seções menores e revisá-las uma de cada vez.

    Quando o usuário faz login no nosso site, nós armazenaremos suas informações em uma sessão - depois disso, a qualquer momento, podemos acessar essas informações em uma matriz (array) global especial do PHP - $_SESSION.  Nós estamos a função empty para checar se a variável está vazia, com o operador ! na frente dela. Portanto, dizemos:

    Se a variável $_SESSION['LoggedIn'] não estiver vazia e $_SESSION['Username'] não estiver vazia, execute este código.

    A próxima linha funciona da mesma forma, só que desta vez usando a matriz (array) global $_POST. Esta matriz (array) contém qualquer dado que foi enviado do formulário de login, que você criará mais adiante neste tutorial.  A linha final só será executada se nenhuma das afirmações anteriores são atendidas; neste caso vamos exibir ao usuário um formulário de login.

    Então, agora que entendemos a lógica, vamos pegar algum conteúdo entre essas seções. No seu arquivo index.php, digite o seguinte abaixo do que você já tem.

    Felizmente, os primeiros e os últimos blocos de códigos não vão te confundir muito. O que precisamos realmente se apegar agora é o que vem neste tutorial - o código PHP. Agora vamos pela segunda seção de uma linha de cada vez, e vou explicar o que cada trecho de código aqui é destinado.

    Existem duas funções que precisam de explicação para isso. Em primeiro lugar, mysql_real_escape_string - uma função muito útil para limpeza de banco de dados de entrada. Não é uma medida de segurança, mas isso vai manter longe a maioria dos hackers maliciosos lá fora descascando partes indesejadas de tudo o que tem sido posto em nosso formulário de login. Em segundo lugar, md5. Seria impossível entrar em detalhes aqui, mas essa função simplesmente criptografa tudo o que é passado para ela - neste caso, a senha do usuário - para evitar olhares indiscretos de lê-la.

    Aqui temos o núcleo do nosso código de login; em primeiro lugar, podemos executar uma consulta em nosso banco de dados. Nesta consulta, que estamos procurando por tudo relativo a um membro, cujo nome de usuário e senha correspondem aos valores da nossa $username e $password que o usuário forneceu. Na próxima linha temos uma instrução if, na qual estamos verificando quantos resultados recebemos - se não existem quaisquer resultados, esta seção não será processada. Mas se houver um resultado, sabemos que o usuário existe, e então nós vamos deixá-lo fazer login.

    As próximas duas linhas são para obter o endereço de e-mail do usuário. Já temos esta informação da consulta que já executamos, então podemos facilmente acessar essa informação. Primeiro, temos uma matriz de dados que foi obtida do banco de dados - neste caso nós estamos usando a função mysql_fetch_array do PHP. Então atribuí o valor do campo de EmailAddress para uma variável, para nós usarmos depois.

    Agora podemos definir a sessão. Estamos armazenando o nome de usuário e endereço de e-mail na sessão, juntamente com um valor especial para nós sabermos que eles fizeram login usando este formulário. Depois de dito e feito tudo isso, então eles irão redirecionar para a Área de Membros usando o META REFRESH no código.

    Então, como aparecerá o nosso projeto para um usuário?

    Ótimo! É hora de seguir em frente, para certificar-se de que as pessoas realmente podem entrar em seu site.

    Deixe As pessoas Se Cadastrarem

    É bom ter um formulário de login em seu site, mas agora precisamos deixar que o usuário seja capaz de usá-lo - nós precisamos fazer um formulário de login. Crie um arquivo chamado register.php e coloque o seguinte código dentro dele.

    Então, não há muito de novo no PHP que nós ainda não aprendemos nessa seção. Vamos dar uma rápida olhada nessa consulta SQL e ver se podemos descobrir o que está fazendo.

    Então, aqui estamos adicionando o usuário ao nosso banco de dados. Desta vez, em vez de recuperarmos dados nós estamos o inserindo; então nós estamos especificando primeiro quais colunas estão inserindo dados (não se esqueça, nosso UserID mudará automaticamente). Na área de VALUES(), vamos dizer o que é para colocar em cada coluna; neste caso, nossas variáveis que vieram do input do usuário. Então, vamos dar uma chance; uma vez que você tenha feito uma conta no seu novo formulário de inscrição em folha, aqui está o que você verá para área do membro.

    Tenha Certeza Que Eles Possam Sair

    Estamos quase no final desta seção, mas há mais uma coisa que precisamos antes de acabarmos aqui - uma forma do usuário sair de suas contas. Isto é muito fácil de fazer (felizmente para nós); crie um novo arquivo chamado logout.php e digite o seguinte nele.

    Neste primeiro vamos redefinir a nossa matriz (array) global $_SESSION e então nós vamos destruir a sessão inteiramente.

    E isso é o fim da seção e o fim do código PHP. Vamos agora avançar para a nossa seção final.

    Passo 3 - Obter o Estilo

    Não vou explicar muito nesta seção - se você não entende de HTML/CSS eu recomendo um dos muitos excelentes tutoriais neste site para você começar. Crie um novo arquivo chamado style.css e insira o seguinte nele; isto vai estilizar todas as páginas que criemos até agora.

    Agora vamos dar uma olhada em algumas capturas de tela e ver como ficou o nosso projeto final.

    O formulário de login.

    A área de membro.

    O formulário de registro.

    E finalmente...

    E é isso aí! Você agora tem uma área de membros que você pode usar no seu site. Vejo muita gente sacudindo a cabeça e gritando com seus monitores que não servem para eles - vocês estão certos. Mas o que realmente eu espero é que qualquer iniciante de PHP tenha aprendido o básico de como usar um banco de dados e como usar sessões para armazenar informações. As habilidades vitais para a criação de qualquer aplicação web.

    • Inscreva-se no Feed NETTUTS RSS para mais tutoriais e artigos sobre desenvolvimento web diariamente.


    Advertisement
    Advertisement
    Advertisement
    Advertisement
    Looking for something to help kick start your next project?
    Envato Market has a range of items for sale to help get you started.