Login básico usando MySQL database

3

Tagged

Stats

9,495 visits, 10,448 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 3 May, 2015. Last updated 25 Feb, 2019

Olá à todos! Neste tutorial eu estou ensinando como fazer um login (básico) no Construct 2. Antes de começar o tutorial, é recomendado que você conheça um pouco de mysql (sabendo que mysql é um banco de dados, e não é muito complicado, depois acostumamos, e é preciso ter acesso à ele, o phpmyadmin é um bom utilitário, crie uma conta no hostinger.com e tenha um gratuitamente), e é preciso que você ter um servidor web instalado localmente em algum local (dica: você também pode usar o Hostinger para ter um, hostinger.com).

Vamos criar uma tabela de banco de dados que irá conter a informação do membro.

Vamos usar o script do lado do servidor para falar com o banco de dados, neste caso, php, uma vez que é mais comumente disponível em sistemas Linux.

Vamos usar AJAX plugin para acessar o script do lado do servidor, na forma de uma solicitação GET.

Primeiro, para criar uma tabela, você terá que executar isso em um estúdio de gestão mysql como phpmyadmin.

Criar tabela `mydatabase`.`members` (

    `id` int( 11 ) NOT NULL AUTO_INCREMENT ,
    `username` varchar( 30 ) NOT NULL ,
    `email` varchar( 50 ) NOT NULL ,
    `password` varchar( 128 ) NOT NULL ,
    PRIMARY KEY ( `id` ) ,
    UNIQUE KEY `username` ( `username` )
    ) ENGINE = MYISAM DEFAULT CHARSET = utf8;

Agora, temos a tabela que armazena a nossa informação do membro. Por favor, note que eu não estou usando criptografia para manter as coisas simples ou saneantes sql além de remover o extra "Eu adicionei intencionalmente". É muito recomendado para criptografar a senha, se você estiver indo para usar isso em ambiente de produção.

Agora vamos adicionar algumas informações de login.

INSERT INTO `members`(`username`, `email`, `password`) VALUES ('myuser','myemail@domain.com','mypassword')

Para acessar o banco de dados que está usando um script php intermediário que nós ligamos com o plugin AJAX de forma a proteger o nosso banco de dados.

Carregue o script a seguir e salve-o como "login.php" (sem aspas) no seu servidor WEB.

<?php

    $username = $_GET['fname'];
    $password = $_GET['fpass'];
    $con=mysql_connect("mysql","database_user","database_password","mydatabase");
    // Check connection
    if (mysqli_connect_errno())
      {
      echo "Failed to connect to MySQL: " . mysqli_connect_error();
      }
    $qz = "SELECT id FROM members WHERE username='".$username."' and password='".$password."'" ; 
    $qz = str_replace("\'","",$qz); 
    $result = mysqli_query($con,$qz);
    while($row = mysqli_fetch_array($result))
      {
      echo $row['id'];
      }
    mysqli_close($con);
    ?>

Na terceira linha, você verá as informações de conexão.

$con=mysqli_connect("mysql","database_user","database_password","mydatabase");

Mysql normalmente é localhost na maioria dos servidores web.

Mudam comforme necessário para tentar se conectar ao seu banco de dados.

Se você tiver problemas ao acessar o seu servidor web de outros sites, acrescente a primeira linha:

header('Access-Control-Allow-Origin: *');

Então, a primeira linha mudaria para:

    <?php header('Access-Control-Allow-Origin: *');


Agora vamos para o Construct 2. Precisamos adicionar ao nosso projeto umas trêws variáveis globais.

Username (text)

Password (text)

UserID (number)

Agora teremos que adicionar à nossa layout dois "Text Box" (caixa de texto) plugins vamos chamá-los de usuário e senha para facilitar a consulta.

Também vamos adicionar um "botão/button" para usar o evento de autenticação.

Vamos nomear este botão de "Login".

Agora, para acessar o nosso script php, vamos utilizar o plugin "AJAX" para adicioná-lo ao seu projeto.

Para fazer com que o usuário tenha que preencher algo antes de clicar em "Entrar", vamos definir o botão Login para começar como deficientes (Faça isso usando a seção atributos após clicar em "Login", à sua esquerda).

Primeira coisa a fazer é usar as caixas de texto para preencher nossas variáveis globais.

Adicione um evento para cada uma das caixas de texto em texto alterado.

ie

event Username On text Changed

action System Set Username to Username.Text

Para realizar uma verificação simples para o usuário preencher as duas variáveis, podemos adicionar uma verificação se algum deles são iguais a nenhum evento.

Então, adicione um evento, na forma de:

System Username = ""

or

System Password = ""

action

Set Login Disabled

Agora, o usuário é capaz de dar um clique no botão Login, a menos que as duas variáveis tênha alguma coisa lá dentro.

Agora, adicione mais um evento para habilitar o botão Login (Use o botão direito para fazer isso).

event else

action Set Login Enabled

Agora precisamos adicionar um pedido AJAX para obter o acesso autenticado. Nós vamos usar o botão Login para fazer isso. Então adicione agora um evento para o botão Login.

event Login On clicked

action AJAX Request Tag "Login" URL "http://mydomain.com/login.php?fname='"&Username&"'&fpass='"&Password&"'"

Altere o caminho de acordo com onde você enviou o script php.

Agora precisamos obter as informações de Login de volta.

Então, adicionar um evento, na forma de:

event

AJAX on "Login" Completed

action

System Set UserID to AJAX.Lastdata

Agora precisamos ter um gatilho em execução uma vez para cada canal verificar se temos uma resposta válida e ter limpeza em nosso layout.

event

System UserID>0

System Trigger Once

action

Login Destroy

Password Destroy

Username Destroy

E agora temos o UserID de volta e fez com que o usuário tenha sido autenticado em nosso banco de dados.

Sua folha de evento deve ser algo como isto.

Obs: O tutorial não pertence a mim, eu apenas di uma pequena traduzida. Tutorial por: emperorkk - Link original do tutorial: scirra.com/tutorials/525/simple-login-using-a-mysql-database

  • 2 Comments

  • Order by
Want to leave a comment? Login or Register an account!