Como criar um SISTEMA DE CADASTRO com LOGIN, FORMULÁRIO e SESSÕES #02

143.1k просмотров6189 СловКопировать текстПоделиться
Gustavo Neitzke
Neitzke Academy: https://neitzkeacademy.com Repositório no GitHub: https://github.com/Gutoneitzke/si...
Транскрипция видео:
o Olá pessoal não sabonete que sejam muito bem-vindos a mais uma aula aqui nesse canal e hoje hoje é pra vocês como trabalhar com o sistema de cadastro sistema de login e sessões com PHP muito bem então vamos começar elencando Quais são os itens necessários para aula de hoje e o nosso primeiro item é uma tela de login que eu já isso aí fazer e alguns vídeos anteriores então vou deixar o Card aqui em cima e o link aqui na descrição para você usar uma conferida e o segundo item é o nosso formulário que eu também Já ensinei fazer e alguns vídeos anteriores aqui no canal que inclusive já sei fazer também a conexão com o banco de dados e cadastrar registros utilizando esse formulário vou deixar o Card aqui em cima e o link na descrição e dessa ao novamente esse caso você não ter assistido eu super recomendo pois digamos cola de hoje vai ser uma continuidade do nosso formulário e do nosso blog presa Mas agora vamos parar de enrolar e vamos colocar a mão na massa E aí é muito bem já abre aqui o exemplo o quê que vocês vão aprender na aula de hoje Então primeiramente nós temos uma tela de home Vejam Só um pano pegar P se inscreva no canal e professor Gustavo nesse E essa tela ela tem dois botões um para o cadastro que redireciona para o formulário Que Eu Já ensinei em algumas aulas anteriores beleza bem bacana E aqui outro botão é o login que redireciona para a tela de login que eu também Já ensinei a fazer aqui no canal e o funcionamento é bem bacana então o cadastrar aqui ó um e-mail e uma senha beleza eu adicionei esse campo sem Depois eu mostro pra vocês como é que eu faço isso ele vai cair aqui na mas tela do login então colocando aqui o meu e-mail e a senha que eu registrei lá no meu formulário Então o meu e-mail Gustavo@gmail. com e com uma sem couve lá que é um dois três Vejam só aquele logo no sistema e também ele já cria uma sessão PHP E essas sessões é mais um ponto muito importante muito interessante que eu vou ensinar na aula de hoje e já dando exemplo aqui para vocês vejam só se sair do meu sistema e tentar acessar aqui pela URL no meu sistema ponto pega pé Vejam só que como não existe uma sessão ele retorna para o login e esse é mais um esquema de segurança digamos assim mas agora se eu vi aqui e colocar meu e-mail então novamente o Gustavo@gmail. com e-mail senha 123 vejam que ele acessou agora se eu voltar lá para o home Olha só home ele acessa o login ele também acessa pois não precisa nenhuma nenhuma sessão E agora se eu tentasse sala lá novamente o meu sistema pronto PHP ele deixa pois tem uma sessão ativa mas se eu mandar sair ele não vai deixar eu acessar o meu sistema e também se eu colocar qualquer palavra que qualquer e-mail qualquer senha vejam que ele não deixa esses A pois não existe no banco de dados e agora que eu já apresentei para vocês todo o fluxo e tudo que a gente vai fazer na hora de hoje hoje podemos começar a colocar a mão na massa quê que vocês acham muito bem para começar eu juntei os 3 arquivos que eu ensinei nas aulas anteriores que é Nossa até ao a beleza que é uma aula e a outra aula é ensinando fazer o formulário e esse config que é conexão com o banco de dados então para começar eu vou criar um novo arquivo home.
PHP e o que que vai ter ele Gustavo aqui nós vamos ter o nosso se inscreva no canal para o fogo estava nesse que essa devia se nosso dois botões para redirecionamento então eu posso criar uma estrutura básica HTML e simplesmente o. Exclamação Copa o título o título é site para higiene então se eu colocar aqui ó site vou fazer igualzinho né site FIPE higiene já posso colocar um H1 se inscreva no canal se inscreva no canal já fazendo mexeria se você não é inscrito se inscreva qual comeu H2 que meu H2 é Prof Gustavo leite que então prof. do estava nem isso que beleza e também depois creme é divi.
Box Então vai ter uma div com uma creche box com dois botões um é para o login né Por enquanto nenhum redirecionamento ainda então login O que é esse botãozinho aqui e o próximo é cadastre-se então vou simplesmente duplicar salinha e coloca aqui cadastro cadastro três e show de bola então para vocês ai eu vou colocar aqui local host local host/YouTube Toque a minha pastinha que ele tá lá você vai colocar o só passa né No meu caso aqui se não me engano ta forme e sem login eu acho acho que esse mesmo assim já acessou aqui ó o meu home. Pegar pessoal Vejam Só como ponto pegar P pai quer que mesmo com o nosso se inscreva no canal Prof Gustavo nesse que o nosso login e o nosso cadastro Já vamos trabalhar no CSS que é bem tranquilo então vamos ver aqui me a tag Style logo após o nosso site e eu vou começar definindo que o nosso Body ele vai ter uma font-family Arial tão font-family Arial cadê cadê cadê a dessa maneira aqui vão almoçar o Vando e vão atualizando a página atualizei já mudou já ficou bem melhor posso definir também uma cor de fundo através de um background linear é linear Gradiente para direita beleza pois aqui nós somos esse Gradiente olha vai dar um azul para esse preto e eu vou definir que as cores são essas aqui ó Então vai desse azulzinho 2050 e 720 para esse outro aqui então salvei volta alisar página Vejam Só já ficou com o mesmo fundo posso definir também um text-align Então text-align-center beleza e um color White color White eita laia tô Cruzeiro duro de tanto frio que tá aqui no sul color White Agora sim atualizar a página já ficou melhor agora Passou passo é centralizar se nosso botões lidar com a nossa div Então vou vir aqui qual que é a nossa Diva é Nossa classe. Box então ponto para chamar a classe vou começar definindo uma centralização para ela então position Absolute beleza top de cinquenta por cento eu sei que eu ensinei nas outras aulas também então left cinquenta por cento beleza se forme translate -50% -50% vejam que desta maneira já vai centralizar aqui ó atualizei a página já centralizou posta aí fininho um background-color tão background-color não veio para mim que de sugestão background-color Agora sim Vou definir um RGB Ah beleza então Vou definir tudo zero esse RGB a é para definir uma transparência Beleza então aqui o alfa ele vai dizer era um se eu deixar um ele vai ficar sem por sento perto Vejam Só ficou preto se eu colocar a zero ele fica sem por cento transparente show de bola então vou colocar aqui 0.
6 que ele fica meio termo ali ficou bom posso colocar agora um Pede pode ser e trinta por cento 30 pixels né Então pede em 30 pixels e devo colocar um border radius que é para arredondar as nossas bordas pode ser de 15 pixels então vim aqui atualizar a página Beijo já ficou bem igual aqui só e o CSS o nosso estilo dos nossos links então para isso eu posso imprimir de chamar a sua tag que é a e passar aqui ao text-decoration None beleza para tirar ali aquele aquele nosso sublinhado digamos assim né Posso colocar também uma color White para ele o valor White muito bom já tá ficando bem bacana pode vir também uma borda tão border border né border 3 pixels Solid e é qual que é aquela cor lá veja um tem sabor né três pixels pode ser um Dodgers Blue acho tão dodgerblue dessa maneira aqui é que eu escrevi errado né por isso que ele não sugeriu então é só com um the border dessa maneira ouvir aqui atualizei a página vejo que já ficou com a borda bem parecida pode vir também um border radius para ele então border-radius pode ser de 15 pixels e um Pede pode ser se lá simples seus então agora assim atualizei a página e olha já ficou bom mas acho que eu vou fazer um pouquinho diferente vou colocar 10 e 10 aqui para esse prédio e para o nosso border-radius o pede é o espaçamento entre o elemento e as bordas Agora sim mas só tá quase igual só muda aqui que esse aqui tem um pouquinho mais arredondados nossos bordas que a gente colocou 15 nessa colocar dessa eu acho que vai ficar perfeitamente igual atualizei a página Vejam Só que já não tem diferença agora basta apenas definiram o ver aqui para os nossos links para quando ele passar o mouse por cima colocar essa cor de fundo Então vou vir aqui colocar um ar: o verdão para mim quando eu passar o mouse por cima ele vai dar um background-color Dodgers Blue que é o mesmo aqui a mesma cor do Nossa borda né mesma cor então agora assim vem aqui atualizei a página quando passar o mouse por cima é Vejam Só que agora isso aqui tá sem por cento idêntico ao nosso exemplo e feito isso basta eu definir os nossos redirecionamentos então o nosso cadastro ele vai redirecionar para nós o ponto PHP eu vou colocar aqui ó formulário. PHP salvei atualizei a página quando eu clicar Vejam Só que ele já redirecionou perfeitamente e agora vou fazer um mesmo plugin mas antes eu vou renomear este arquivo para simplesmente um login. PHP não vai ser mais.
HTML e agora do meu home aqui eu vou vir colocar o login. Pega P beleza atualizar a página quando clicar eu limpei um só que ele já já redirecionou aqui para o nosso login beleza e vamos lhe dar nele vamos receber as mesmas cores de fundo aqui do nosso home e do nosso formulário também aqui blog Então já fomos engatar isso aí digamos assim Posso copiar essa nossa linha vou vir aqui no meu login e vou substituir aqui ó beleza agora sim seu atualizar página veio aqui nós já temos o mesmo fundo para todos os nossos arquivos e agora passou basta colocar aqui e onde voltar tanto para o login quanto para o nosso formulário é muito simples basta eu vim aqui logo após o bode colocar um link que vai redirecionar para o nosso Roma e ponto Era p e vou escrever simplesmente não voltar bem simples bem simples mesmo posso salvar ou copiar e vou colar aqui no nosso formulário logo após o nosso Body também então vim aqui de encontrou ver beleza deixou arrumar do homem tá vizinho aqui agora assim você vê aqui atualizar página Vejam Só que eu já tenho botão de voltar tanto aqui no nosso formulário quanto no nosso Lobinho feito isso agora vou fazer o seguinte eu vou adicionar um campo aqui no nosso formulário que é senha beleza Vejam Só que eu não tinha colocado na anterior então eu posso acessar o nosso formulário Beleza já estou nele aqui e posso simplesmente colocar mais uma div e agora vai ser peço Word né que a senha em inglês pass word' Qual que é o name o nenê vai ser senha beleza aposta dando contra você quando ver sem a Wide também sem aqui no Four e aqui nós vamos colocar simplesmente uma senha beleza salvei só que atualizei e Vejam Só que nós já temos a nossa senha só tem colocar um BR entre esses elementos Agora sim só atualizar página já está igual o nossos formulários tamos só mas agora fiquei na dúvida Nós criamos aqui um novo input no formulário mas consequentemente eu não tenho que criar um novo Campo lá na tabela do banco de dados exatamente o pessoal então vocês podem lá e simplesmente definir um novo Campo no seu banco de dados varchar mesmo com o nome senha e foi exatamente o que eu fiz aqui na nossa tabela usuários do nosso banco formulário então se você ainda não trouxe banco Foi esse banco que isso aí é criar lá na nossa aula e formulários Beleza então veja só que eu já tenho esse campo aqui senha pode ser varchar mesmo então eu só vim aqui na estrutura de tabela como eu estou utilizando o dente né então se você está utilizando outro programa vai ser mais ou menos a mesma lógica só queria uns e fechar 45 e note no mandei aplicar e ele já criou o novo Campo aqui senha e a simplesmente definir uma senha que manualmente mesmo e agora o que que eu vou fazer vamos trabalhar aqui no nosso a tela de login e hoje eu vou começar colocando um formulário logo após o nosso H1 sem nenhuma Action e com o método já passando aqui um post beleza posso fechar lá embaixo logo após o nosso botão Vou definir alguns nomes aqui para nós ir Putz então aqui vai ser Leme e meio né E aqui também é mais nome e sim e-mail e-mail e também definir um nele para nossa senha Então nem senha show de bola Vejam só aqui nós já mudamos então o nosso e-mail e a nossa senha tá ok e eu tava vendo que aqui o nosso login ele tá um pouquinho mais transparente Aqui tá um pouco mais escuro então para isso eu vou definir 10. 6 deixou achar aqui onde é que tá o rgba aqui tá 0.
9 voltará 0. 6 também atualizei a página Vejam Só e também igual e agora próximo passo eu vou tirar esse botão e colocar um input do site submit pois ele sim que vai subir imitar o nosso formulário com ele submit e também com velo e enviar beleza só que agora você vai vir aqui ver aqui atualiza a página vejo que ele perdeu os ISS pois o CSS tava para o nosso botão então eu vou simplesmente colocar uma classe aqui sei lá input submit input submit só colocar um B aqui ó agora sim e vou chamar minha classe aqui no lugar do botão tá um ponto em Porto submit aqui novamente ponto e possivelmente se atualizar pai já vejam que já voltou ao normal só que agora ele vai se botão eu tenho input que vai subir militar esse meu formulário com as informações para algum lugar e já adiantando para vocês pessoal eu vou enviar esse meu formulário para um outro arquivo teste login teste login Já coloquei aqui ó teste login. Pegar p e o que que esse teste login.
pt e é aqui dentro que nós vamos conseguir manipular toda a lógica PHP para ver se existe o registro com esse e-mail com essa senha no banco de dados se existir ele inicia uma sessão e ele acessa o sistema se não existir ele retorna para o login e não deixa acessar o nosso sistema então aqui na nossa Action no meu formulário eu já vou redirecionar para o nosso teste login. com HP choro igual e agora até posso fechar o meu login pois ele já está pronto para começar a nossa lógica PHP eu vou abrir nossas Teles pega p é óbvio e também já vou dar um print R na minha requeste que são os parâmetros que estão vindo lá do formulário do meu login agora se eu vi aqui atualizar página para garantir vou colocar o meu e-mail que é Gustavo@gmail. com e vou colocar uma senha que é um dois três deu em ter ai não encontrou o teste login esqueci do teste aqui né então a teste login Agora sim posso fechar o meu login a beleza vou retornar atualizei a página vou voltar meu e-mail Gustavo@gmail.
com e minha senha que é um dois três nenhum em ter Vejam Só que ele já mostrou aqui minha requeste trazendo um e-mail coloquei e a senha que eu coloquei lá e também já trouxe o nosso botão aqui submit Enviar e feito isso agora a gente sabe que está vindo perfeitamente todos os nossos parâmetros então se eu vier aqui de estar qualquer coisa ou qualquer coisa aqui mesmo e digitar uma senha um dois três quatro cinco Vejam Só que tá vindo perfeitamente Então feito isso agora nós podemos dar continuidade a nossa lógica aqui vou comentar o meu print r e vou fazer uma verificação para ver se foi solicitado o realmente ou não lá o meu formulário Então se existir aqui uma variável post Então dessa maneira aqui submit beleza submit ele vai acessar o meu sistema caso contrário o que que vai fazer ele vai retornar lá para o meu login Então vou da a beleza location o login com PHP login. Pega pé pois o que é Gustavo pois é agora vou dar um possível aqui no final pois é agora eu voltar aqui atualizei a página e tentar acessar aquele meu teste login como não existe nenhuma variável ele retornou aqui para o meu login. PHP isso aqui é bem tranquilo entender né então se existir minha variável possue submit ele vai deixar acessar o meu sistema Então vou vai aqui um comentário acessa caso não existir ele não acessa e ele retorna lá para o meu login consequentemente eu posso fazer aqui mais algumas validações como eu estou enviando aqui um e-mail e uma senha tem que Obrigatoriamente então existir aqui o meu submit que é meu botão Então tem que existir uma um parâmetro submit Tem que existir um e meio e também tem que existir uma senha Então vou colocar um e aqui e não estiver vazia a minha variável post o post e-mail dessa maneira teu nome pode tá vazia o meu posto e-mail e também não pode estar vazio o meu post senha Beleza então essa mais uma maneira de segurança aí para vocês irem pegando a manha e agora quando ele for acessar o sistema eu vou fazer o seguinte eu vou primeiramente incluir o inclusion se lá minha configuração aqui minha conexão beleza que eu Já ensinei lá no a parte dos formulários aqui ó Vejam Só que eu tenho uma conexão passando BB host caminho local host o meu de beijar nem me que é root a minha senha que eu não tenho uma senha e o nome do meu habilidades Beleza então vou incluir aqui através de um config.
pro nome do arquivo beleza já está incluída a nossa conexão com o banco de dados já vou passar aqui para uma variável que se chama e-mail porque tá vindo lá no meu parâmetro com post é meio Beleza e como vai vir e-mail e senha eu tenho que fazer o mesmo para nossa senha Então vou renomear aqui para senha e também tá vindo meu pô a senha beleza posso dar um print R em cada uma dessas variáveis então print R e-mail né Vou escrever aqui dentro e-mail um dois pontos agora um espaço um pontinho para concatenar e colocar meu e-mail que tu vai trazer meu e-mail vou dar aqui um print aí agora para mim a senha né Tem um print R vou escrever aqui senha: espaço. A concatenar e colocar minha variável sem você dá um. E, e agora eu mandar aqui atualizar página para garantir mandar um e-mail que Gustavo@gmail.
com e uma senha 123 Se eu mandar vejo o sol já apareceu aqui o meu e-mail que é Gustavo@gmail. com e a senha 123 posso até quebrar uma linha Entre esses elementos estão print R vou passar minha tag BR lá do nosso HTML Beleza agora passar um pouco de vergonha no final se eu vir aqui e atualizar página continuar vejo que ele já quebrou a linha e fica melhor de visualizar então eu gosto muito de fazer isso aqui pode eu tenho certeza que está chegando lá o meu Pou e nessa variável meio e tá chegando eu Parando para o posto de senha lá na minha variável senha posso comentar esse nossos primos aqui e vou criar aqui a nossa nossa SQL para verificar se esses parâmetros existem lá no banco de dados então eu vou simplesmente passar aqui é um select* from usuários que o nome da nossa tabela né usuários onde o e-mail seja igual a nossa variável e-mail Beleza o e-mail seja igual a nossa variável e-mail e nem senha seja igual a nossa variável senha Beleza agora dessa maneira ele vai estar verificando o braço vai tá fazendo um select verificando se existe um e-mail exatamente que o e-mail digitar lá da metade login e uma senha exatamente como digitei lá na metade do login Eita esqueci que que é como é texto eu tenho que passar com as para simples Beleza então posso passar estamos aqui para senha também e agora eu posso o único tá isso aqui no banco de dados Então vou criar uma variável result que vai ter o resultado E vou passar uma variável conexão certinha Harry passando aqui essa minha querem então que a nossa variável SQL tá Gustavo o que que essa conexão essa conexão Oba agora sim essa conexão foi feita lá no arquivo config. php que essa variável conexão aqui beleza então lava o banco de dados ele vai estar executando essa quer que é dessa variável Então essa galera que select essa Bispo usuários ou com essas condições aqui e posso dar consequentemente um print R nessa pra variar o resultado para ver o que que ele vai mostrar então agora você vê aqui atualizar página continuar Vejam Só que ele retornou o número de linha azul isso que isso aqui quer dizer que existem novidades um registro com aquele e-mail e com aquela senha e para melhorar mais ainda entendimento eu posso der do Picasso aqui passando a eu vou aqui é sik é beleza atualizei a página continuar Vejam Só que ele vai estar mandando lá no banco de dados um select Assis foi usuários onde o e-mail seja esse meio aqui e a senha seja um dois três então ele encontrou aqui com o nome do de Rose um se eu voltar aqui e mandar qualquer outra senha vendo só se eu mandar enviar ele vai dar o select Gustavo@gmail.
com com aquelas em que eu coloquei só que agora o número de Rose o número de linhas é zero porque isso pois não existe nenhum registro do banco de dados correspondente a este meio aqui e com esta senha aqui bem trocando entender então agora a gente já sabe que se existe o banco de dados ou não vai ter um número aqui em não Rose então eu posso fazer um bife posso comentar esse Springs também posso fazer um if logo após verificando o número de linhas então ele vai vai verificar aqui no mais kieling mas Kelly e o time num Rose ele vai verificar se o número de linhas lá dormir à variável result for menor que 1 isso aqui quer dizer que não existe né então vou dar um print Eric não existe não existe Beleza mas se o número de linhas for maior que zero Então ela fazer o seguinte ó para colocar aqui senão ele vai dar um print R existe então existe show de bola agora Vou atualizar a página continuar não existe mas agora colocar minha senha que é um dois três Vejam Só que existe lá no banco de dados vejo que incrível que esse aqui agora a gente já sabe se o que o colocar aqui o login existe no volume de dados ou não então agora basta eu fazendo redirecionamentos mais claro que depois a gente já vai começar nesse aquilo que mesmo que a as nossas sessões então eu posso tirar esse print e retirar aqui esse print também se existir ele vai rede o sistema Então vou criar um novo arquivo aqui sei lá sistema sistema pronto PHP então ele vai redirecionar para esses tempo pode pegar PC existir ou através de um header location location com l maiúsculo mesmo o sistema pronto PHP dessa maneira aqui mas se não existir pessoal eu vou sentimento passar um líder onde ele vai redirecionar lá para o nosso login novamente dá um login. PHP beleza; aqui no final agora se eu retornar atualizar a página aqui vou mandar um registro que não existe qual que é e-mail e qualquer senha vejam que ele vai permanecer aqui no login mas se eu mandar o Gustavo@gmail. com com a senha 123 vejam que ele acessou o sistema pronto PHP então dando continuidade João 11 engatar o HTML CSS aqui do nosso sistema Então qual que é o nome aqui vai colocar sistema mesmo sistema aip eu vou colocar um bora aqui H1 acessou o sistema beleza que a gente sabe que vai estar acessando o sistema e eu já vou começar a trabalhar com as nossas sessões tá gostava mas eu nunca nem vi sessão na vida o que que é isso beleza pessoal sessões de uma forma bem simples explicar para vocês eu Digamos que uma forma de armazenar os dados dos usuários individuais então a gente usa uma sessão quando a gente quer persistir as informações entre requisições das páginas mas indo para prática Isso aqui vai ficar muito mais fácil de vocês compreenderem como que funciona então voltando aqui no meu teste login pode pegar pé eu vou iniciar nessa sessão até mais um Fashion start; estão sempre a gente for trabalhar concessão Nós temos que colocar essa tag Fashion Star Vejam Só que quando eu acessar o sistema aqui ele vai criar duas variáveis através um Fashion e-mail e-mail Qual que é o e-mail foi meio está na nossa variável o quê E aí agora eu posso fazer o mesmo aqui para nossa senha Então vou criar uma variável senha lá na seção passando a minha senha para ela e criar essas variáveis caso não exista nenhum registro com aquele e-mail aquela senha e vou mandar destruir qualquer variável que tenha a certinho aqui e meio e acerte-o senha Beleza então Quatro meses e 17 eu consigo destruir todos os seus dados agora no sistema vou vir aqui vou abrir uma tag HTML pega a pena até me perdi aqui PHP e vamos mostrar essa mês e são a televisão print R7 acham Beleza agora quando eu acessar lá uma sistema e vir aqui eu vou atualizar página tá vou de voltar aqui atualizei Agora sim aqui no meu login se eu der um estava@gmail.
com e de senha 123 Vejam Só que ele não achou nenhuma sessão por que será que aconteceu isso claro pessoal agora que eu lembrei sempre gente vai trabalhar com seções o tormento que a gente tem que iniciar a sessão não é mesmo então agora sim se eu atualizar página vejam que já existe uma seção com esse é meu Gustavo@gmail. com e com essa senha 123 só que vejo o pessoal que se eu retornar aqui pro meu login e tentar acessar o meu sistema ele vai deixar acessar Independente se existe sessão ou não então vamos fazer uma verificação aqui no sistema pronto PHP para ver se existir uma sessão com e-mail e com senha ele mantém aqui nessa página caso contrário ele retorna lá para o nosso Lobinho eu postou aqui um if se não existir uma variável aqui ó mas não só se não existir uma variável e-mail na minha sessão esse esse isso aqui foi igual ao outro e a não existir uma variável senha lá na nesse são ele vai lá um reader location tão header location vai isso que quer dizer que não ensina mais atenção né então reader location o login ele retornará para o login com PHP caso e se existir ele vai criar uma variável aqui ó logado beleza logado e ele vai jogar a minha variável o e-mail da minha sessão dessa maneira aqui; no final mas é claro que você não existir uma sessão além de ele retornará para o nosso login eu vou querer que ele destrua qualquer dado que tem a minha sessão um e-mail e uma senha Beleza então agora você vê aqui atualizar a página é normal pois esse são existe mas se eu fazer o seguinte eu vou copiar se meu RL vou fechar aqui fechei o Chrome ele encerra totalmente nesse são vocês a novamente copia aqui no RL eu vou esperar ele carregar vejam que ele caiu no meu login. Pegar pia pois não existe nenhuma sessão então quando eu tento acessar que o sistema apelidam enter ele retorna para o login pois não existe nenhuma sessão inclusive Se eu tentar acessar aqui pelo URL o sistema né novamente e sistema tenta se sai ele retorna no login pois não existe negociação mas se eu criar uma sessão a arroba gmail.
com com a minha senha que é um dois três ele deixa esses Acre a sessão e agora Se eu tentar vocês aquela URL ele deixa Pois existe exceção né então pra gente finalizar de vez essa aula Vamos só ver como que está o exemplo lá do nosso sistema veja o que está utilizando Bootstrap já tem essa navbar tem o bem vindo com o e-mail que está a nossa sessão e esse botãozinho aqui de sair onde ele vai encerrar a sessão então eu vou começar a lidar vou copiar aqui o CSS Bootstrap vou colar logo após o nosso último meta aqui do meu sistema atualizar a página veja só que já mudou a fonte vou tirar aquele meu Arlei aqui de cima que é as informações a minha sessão surgimento comentando esse print r71 atualizei a página já está aqui e agora vou colocar essa cor de fundo né que a mesma cor de fundo da nossa as outras telas Então você sabe o login vou copiar aqui o bode Beleza vou copiar esse embora todo aqui vou colar aqui e abrindo as tags Style beleza Colei o bode posso tirar font-family né atualizei a página vejo que eu já tenho a cor de fundo e vamos adicionar essa nave barco esse botão sair e é claro que eu sei lá a documentação do Bootstrap e peguei uma navbar lá mesmo mas é claro que vocês têm Liberdade Total você pode pegar as coisas que vocês quiserem pode fazer a maneira que vocês quiserem vocês que mandam beleza atualizei a página veja só meu tem esse navbar Vou definir um color White aqui para geral então color White show de bola atualizar a página veio aqui um branco né Posso colocar meu botãozinho também aqui de sair e para esse botão basta eu vim aqui logo após a minha div eu posso criar uma outra div de Flex estão Classic de flex com botão sair então vai ser um link né que vai redirecionar para uma página sair Vou definir aqui uma classe para ele por essas btn btn danger que é do Bootstrap né O que é vermelho atualizei a página Acre Vejam Só que eu já tenho aqui o meu botãozinho sair só vou definir uma margem rite agora me5 agora sim atualizei a página já temos o nosso exemplo Bem igual só basta colocar esse bem vindo com o e-mail do a sessão E para isso eu vou vir aqui vou excluir esse meu H1 e vou colocar um PHP com eco H1 bem vindo esse ué para deixar sublinhado bem igualzinho está aqui ser meio e eu vou dar um logado essa variável logado mas Oi que tá separava o lugar do pessoal lembro que a gente colocou um logado aqui em cima que está pegando o e-mail da sessão Agora você vê aqui atualizar a página vejo sogra já veio bem vindo com um e-mail da sessão basta eu centralizar isso aqui então para isso vou dar um text-align-center pode ser aqui mesmo eu acho text-align Center a Center com ele né Center agora deixa eu ver sinto salvei beleza atualizar pai já alinhou e vou dar um sei lá vou dar um espaçamento entre as a navbar e esse texto e para isso também Basta vir aqui só colocar um BR Vejam Só que dessa maneira você vê aqui e atualizar página já está perfeitamente igual os dois exemplos e agora pra gente finalizar de vez essa aula a última coisa que nós vamos fazer é fazer funcionar esse botãozinho aqui sair para encerrar sessão Então vou criar um novo arquivo sair. PHP bem simples pessoal tô fazendo a forma mais simples para vocês entenderem a lógica e eu vou simplesmente colar essa tag PHP passando 171 start ele vai estar destruindo as nossas variáveis e-mail e senha e ele vai redirecionar para o nosso login beleza atualizei a página quando eu clicar aqui ele tem que chamar esse meu sair poder à P então aqui no sistema eu vou redirecionar lá meu botão tá na karê karê sair aqui HF para nós o ponto PHP Agora sim deixa eu ver só ver Aí salvei atualizei a página quando eu clicar em sair vejo que ele já tem que já tem que ter encerrado essa minha sessão para mim ter certeza se isso aqui funcionou não basta simplesmente eu vi aqui colocar sistema vejo que na sessão foi encerrada pois ele é feio direção ou por meu sistema agora vamos testar se eu colocar um e-mail que não existe uma sangue não existe ele permanece aqui no meu login agora vou colocar um e-mail que existe que Gustavo@gmail. com e a senha sei lá um dois três né veja só que ele é sensor meu sistema seu redirecionar lá para o meu home o meu home ele deixa eu voltar aqui para o meu sistema ele deixa pois está com a sessão ativa mas eu clicar no botão saiu dentro da acessar o sistema e vejam que ele já não deixa mais e agora sim pessoal vamos fazer o último teste aqui ó quando eu cadastrar quando finalizar o cadastro eu quero que ele redirecione lá para o meu formulário de login Então logo após ao nosso formulário aqui logo ele salvar no banco eu quero perder um reader location login.
PHP salvei só aqui vamos testar agora galera aí agora é parte legal vou fazer um novo cadastro aqui ó vou colocar teste né então teste vou colocar uma senha teste123 qual o e-mail teste arroba gmail. com beleza vamo colocar um telefone trará colocar um sexo masculino vou selecionar uma data Nascimento cidade tal estado tal que endereço tal beleza uma lá enviar ele tem que redireciona redirecionar para nossa tela do login ele que aqui ele já redirecionou vamos ver se tá funcionando já o nosso teste então teste@gmail Oi tudo bom e se não me engano a senha teste123 beleza vejam que eu errei eu coloquei alguma coisa errada aqui vamos verificar nosso novidades fazer um select aqui nossos usuários vejo eu tenho o teste a no colocar em uma senha beijo eu esqueci de trabalhar com a senha aqui no formulário então eu vou definir uma variável aqui para senha né então senha senha também no post sendo post aquele mais seria uma senha também e qual que é a senha ou copiar esse aqui ó beleza agora não é mais nome e sim senha beleza show de bola Vamos testar novamente uma nova inserção de registro vou colocar TST test123 a senha teste@gmail. com a beleza telefone um dois três sexo masculino com qualquer data qualquer cidade Beleza qualquer estado e qualquer endereço mandei enviar Vamos testar agora teste arroba gmail.
com com a senha teste123 show de bola Vejam Só que ele já acessou aqui o meu sistema com e-mail teste@gmail.
Похожие видео
Aprenda como ligar um FORMULÁRIO com BANCO DE DADOS #01
18:57
Aprenda como ligar um FORMULÁRIO com BANCO...
Gustavo Neitzke
330,718 views
CRUD with PHP, MySQL & Bootstrap 5 (Create, Read, Update, Delete) | PHP Tutorial
37:42
CRUD with PHP, MySQL & Bootstrap 5 (Create...
Canal TI
2,593 views
APRENDA como criar um FORMULÁRIO com HTML e CSS
28:57
APRENDA como criar um FORMULÁRIO com HTML ...
Gustavo Neitzke
219,687 views
Sistema de Login com PHP e MySQL
31:59
Sistema de Login com PHP e MySQL
Professor Eliel
24,399 views
Aprenda como criar uma TELA de LOGIN com HTML e CSS
12:43
Aprenda como criar uma TELA de LOGIN com H...
Gustavo Neitzke
228,372 views
Como Criar um Formulário em HTML e Salvar os Dados 💾?
1:16:40
Como Criar um Formulário em HTML e Salvar ...
Programação Web
13,657 views
[TUTORIAL] Sistema de Login com PHP e MySQL (Fácil e Rápido) 2024 - TUTORIAL
25:55
[TUTORIAL] Sistema de Login com PHP e MySQ...
Zero Bugs - Programação em Tutorial
121,075 views
Projeto Prático de Programação |Criando uma Tela de Login  | HTML + CSS
41:34
Projeto Prático de Programação |Criando um...
DevClub | Programação
14,049 views
COMO CRIAR UM FORMULÁRIO DE CADASTRO DE CLIENTES NO GOOGLE FORMS | Passo-a-Passo
19:07
COMO CRIAR UM FORMULÁRIO DE CADASTRO DE CL...
Gabriela Palma Turismo
22,557 views
Cursos De Programação - criando sistema de cadastro em python flet e salvando no banco de dados
1:42:05
Cursos De Programação - criando sistema de...
Curso de tecnologia e programação
7,966 views
Como criar um formulário com HTML, CSS e PHP
21:03
Como criar um formulário com HTML, CSS e PHP
Inteliogia - Dev's Insights
10,418 views
Multitenancy - Banco de dados único ou um banco para cada cliente?
1:46:23
Multitenancy - Banco de dados único ou um ...
99 Coders
9,827 views
Como trabalhar com as sessões no php | Além do básico
22:59
Como trabalhar com as sessões no php | Alé...
Clube Full-Stack
11,598 views
How to Create Login System with PHP and MySQL | PHP Tutorial
22:47
How to Create Login System with PHP and My...
Canal TI
246,945 views
Aulão de Access - Criando um Sistema
1:31:57
Aulão de Access - Criando um Sistema
Adriano Henrique de Souza @muitomaisquetecnologia
116,725 views
Como fazer VALIDAÇÃO de FORMULÁRIOS com JavaScript
25:08
Como fazer VALIDAÇÃO de FORMULÁRIOS com Ja...
Gustavo Neitzke
38,248 views
RELÓGIO DIGITAL Simples e Profissional com HTML, CSS e JavaScript
21:58
RELÓGIO DIGITAL Simples e Profissional com...
Gustavo Neitzke
3,599 views
Como criar formulário e cadastrar com PHP e MySQLi no Banco de Dados
21:37
Como criar formulário e cadastrar com PHP ...
Celke
236,262 views
PHP/MySQL: Upload de arquivos e imagens com salvamento no banco de dados (Atualizado 2024)
47:48
PHP/MySQL: Upload de arquivos e imagens co...
Zero Bugs - Programação em Tutorial
48,778 views
Авторское право © 2025. Сделано с ♥ в Лондоне YTScribe.com