Slide 05 implementando o login , logout e flash data

24
Implementando o Login e Logout Exibindo mensagens com o FlashData Implementando o Login e Logout Exibindo mensagens com o FlashData Criado por: Raniere de Lima

Transcript of Slide 05 implementando o login , logout e flash data

Page 1: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Implementando o Login e LogoutExibindo mensagens com o FlashData

Page 2: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Implementando o Login e Logout

Page 3: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Hoje nós iremos aprender a criar uma função de Login e Logout para os clientes no Mercado Online, e hoje nós faremos as seguintes configurações:

• Criaremos um formulário para Login;• Criaremos a função de Login;• Aprenderemos a utilizar a Session;• Criaremos a função de Logout;• Aprenderemos a utilizar o Anchor;• Aprenderemos a utilizar o FlashData.• Exercício;

Page 4: Slide 05   implementando o login , logout e flash data

Implementando o Login e LogoutExibindo mensagens com o FlashData

Criado por: Raniere de Lima

Inicialmente para criar um sistema de login, precisaremos de alguns dados do cliente para autenticar, neste caso utilizaremos o E-mail e Senha para autenticar, precisaremos de um formulário de Login, e este formulário deve enviar as informações para um novo controller chamado login que terá apenas o método autenticar.

Utilize o helper FORM para lhe auxiliar.

Page 5: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

No controller login, criaremos a função autentica e dentro desta função pegaremos o E-mail e Senha que o usuário informou, e consultaremos no nosso Banco de Dados para verificar se existe algum cadastro com o e-mail e senha informados. Para verificar criaremos uma função no Usuarios_model chamado autentica, que receberá o e-mail e senha.

Lembre-se de transformar a senha em MD5.

Page 6: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Nosso Controller deve estar semelhante a este:

Page 7: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Agora vamos criar nossa função autentica no usuarios_model. Para criar essa funçãodevemos receber como parâmetro um usuário, porém temos que verificar se o E-mail e senha estão no nosso banco de dados e depois retorna se achou ou se não achou,para verificar dados específicos em um Banco de dados precisamos utilizar um Where.

Porém como fazer isso no CodeIgniter?

Podemos fazer de duas maneiras simples.

1. Antes de consultar informa o Where;2. Mudar nosso código para utilizar o get_where, que passamos a tabela e uma array com os dados do Where.

Page 8: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

1. Informando o Where antes da consulta:

public function autentica($usuario){ $this->db->where("email", $usuario["email"]); $this->db->where("senha", $usuario["senha"]); $usuario = $this->db->get("usuarios")->row_array(); return $usuario; }

Page 9: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

2. Utilizando o get_where:

public function autentica($usuario){ $usuario = $this->db->get_where("usuarios", array(

"email"=>$usuario["email"],"senha"=>$usuario["senha"]))->row_array();

return $usuario;}

Page 10: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Agora nós temos nosso código que verifica se existe um usuário com o E-mail e SenhaInformados. Porém, aonde vamos armazenar aquele resultado? Seria legal que depois que localizarmos um usuário criar uma sessão para ele, algo quesó o usuário que eu acabei de achar e o servidor tivessem. No CodeIgniter existe uma função chamada userdata, que fica dentro da classe session, para adicionar um valor nesta função, utiliza o set_userdata, mas vamos passar umaMensagem também, para deixar nosso código mais compreensível para o usuário, e depoisDirecionaremos para uma view que exibirá está mensagem.

Então nosso código irá ficar semelhante a este:

Page 11: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Realize um teste, utilizando o seu usuário cadastrado.

Page 12: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Só que quando vamos testar, ele já cai em um erro.

Page 13: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Mas espera um momento, nós já vimos este erro em outro slide:

A PHP Error was encounteredSeverity: NoticeMessage: Undefined property: Login::$sessionFilename: controllers/login.php

Erro de propriedade indefinida?

Neste caso, nossa propriedade está correta, mas porque não está carregando? Por um simples e pequeno motivo, esquecemos de carregar a library da session, mas a Session é algo muito importante para todo meu código e eu vou utilizar bastante ela.

Então vamos voltar no AutoLoad, e além de carregar o database, iremos carregar a Session automaticamente.

Page 14: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Mas se eu já fiz o login no sistema, não quero que apareça o formulário para fazer o loginOu o formulário de cadastro novamente, eu quero que apareça apenas os produtos.

E se eu estou logado no sistema, eu também quero fazer o Logout.

Vamos fazer uma parte de cada vez:

1. Alteraremos a index, para caso estejamos logados, não exibir os formulários;2. Criar um botão para fazer o logout;3. Melhorar a visualização da mensagem de “Logado com Sucesso” ou “Login ou Senha inválidas”;

Page 15: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Começaremos com o mais fácil e rápido, vá na pasta Produtos e no arquivo Index.php,e antes de criar os formulários faça uma verificação utilizando um if.

- Mas if o que?

Se nós utilizamos o set_userdata, para atribuir um valor no userdata, vamos utiliza-loPara verificar se existe algum valor “setado” ou não.

Para realizar esta verificação fazemos:

<?php if($this->session->userdata("usuario_logado")) : ?>

E logo após criarmos o ultimo formulário, terminaremos o nosso if:

<?php endif ?>

Page 16: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Agora que fazemos uma verificação para ver se tem algum usuário ativo ou não no sistema, só que falto o botão de deslogar. Para criar este botão, utilizaremos um anchor, que recebe 3 parâmetros, o primeiro é qual a ação dele quando clicado, o segundo é o nome queserá exibido e o terceiro é um array que contem as informações dele, como class, id, name e outras Tag de HTML.

Page 17: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Page 18: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Nosso anchor direciona para o login/logout, porém ainda não criamos está função.

Vamos no Controller Login e criaremos a função logout, que ela ira retirar o valordo login.

public function logout(){ $this->session->unset_userdata("usuario_logado"); }

Page 19: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Agora nós temos um sistema de Login e Logout de usuários, mas ainda falta melhorar na questão das mensagens, seria legal utilizar alguma função que exibisse a mensagemapenas uma vez e depois desaparecesse.

Para isso nós temos a função flashdata, que recebe 2 parâmetros. O Primeiro parâmetro é o nome do flashdata e o segundo é a mensagem que dele.

Vamos adicionar um valor no flashdata quando fazemos o login. Para isso retorne a funçãoAutenticar e caso ele ache um usuário, adicione uma mensagem de:

“Login realizado com sucesso”

E depois, redirecione para a pagina inicial.

Page 20: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Page 21: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Depois de ter criado a mensagem, vamos exibi-la.

Vá na pasta Produtos e abra o arquivo Index, e antes da tag h1 Produtos, verifique se tem algum flashdata do tipo “success”, e se tiver vamos exibi-lo.

Page 22: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Este é o código que deve ser adicionado na Index:

<?php if($this->session->flashdata("success")) : ?> <p style="text-align:center;" class="alert alert-success">

<?= $this->session->flashdata("success"); ?> </p>

<?php endif ?>

Agora temos uma index mais bonita e com uma mensagem mais agradavel.

Page 23: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Exercicio

Page 24: Slide 05   implementando o login , logout e flash data

Criado por: Raniere de Lima

Implementando o Login e LogoutExibindo mensagens com o FlashData

Crie um flashdata para caso o login ou senha estiverem erradas, e para quando o Logout

for realizado.