Simple Login using a MySQL database

5

Tagged

Stats

152,535 visits, 204,241 views

Tools

Share

Translations

Create a translation

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 5 Apr, 2013. Last updated 19 Feb, 2019

First of all I'm assuming that to read this tutorial you have some basic familiarity with mysql (that is you know it's a database, you know what phpmyadmin is or have used some sort of db management studio, you have access to one) and that you have a webserver installed locally or somewhere on the net.

We will create a database table that will contain our member information.

We will use server-side script to talk to the database, in this case php since it is more commonly available in linux systems

We will use AJAX plugin to access the server-side script in the form of a GET request.

First to create the table, you will need to run this on a mysql management studio like phpmyadmin.

    CREATE TABLE `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;

Now we have the table that stores our member information. Please note that I'm not using encryption to keep things simple or sanitizing sql apart from removing the extra ' I've intentionally added. It is highly recommended to encrypt the password if you are going to use this in production environment.

Now lets add some login information.

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

To access the database we will be using an intermediate php script that we will call with the AJAX plugin so as to protect our database.

Upload the following script and save it as login.php on your web server.

    <?php
    $username = $_GET['fname'];
    $password = $_GET['fpass'];
    $con=mysqli_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);
    ?>

On the third line you will see the connection information

    [i]$con=mysqli_connect("mysql","database_user","database_password","mydatabase");[/i]

mysql is ussually localhost in most web servers

Do change as necessary to be able to connect to your database.

If you have issues accessing your web server from other sites add on first row header('Access-Control-Allow-Origin: *');

so the first line would change to 

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

Now let's go to Construct 2

We will need to add to our project

three global variables

Username (text)

Password (text)

UserID (number)

Now we will need to add to our Layout two "Text Box" plugins

let's call them Username and Password for easier reference.

Also let's add a "button" to use for the authentication event.

Let's name this button Login.

Now to access our php script we will use the "AJAX" plugin so add this to your project.

To make the user have to fill in something before clicking Login we will set the Login button to start as disabled (Do this using the attributes section, after clicking on "Login" to your left).

First thing to do is to use the text boxes to fill our global variables.

Add an event for each of the Text Boxes on text changed

ie

event Username On text Changed

action System Set Username to Username.Text

To accomplish a simple check on the user filling the two variables, we can add an event checking if any of them are equal to nothing.

So add an event in the form of

System Username = ""

or

System Password = ""

action

Set Login Disabled

Now the user is unable to click the Login button unless the two variables have something in there.

Now add an else event to enable the Login button (use right click to accomplish that)

event else

action Set Login Enabled

Now we need to add the AJAX request to get the login authenticated. We will use the Login button to accomplish that. So add now an event for the Lgin button.

event Login On clicked

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

Change the path according to where you uploaded the php script.

Now we need to get the login info back

So add an event in the form of

event

AJAX on "Login" Completed

action

System Set UserID to AJAX.Lastdata

Now we need to have a trigger running once for each chane to check if we got a valid reply and cleanup our layout

event

System UserID>0

System Trigger Once

action

Login Destroy

Password Destroy

Username Destroy

and we now have the UserID back and made sure the user has been authenticated against our database.

Your event sheet should look something like this

  • 5 Comments

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

  • HI! I exported my game to android but it doesn't work on mobile( I mean Login and Register are works on only browsers? Can u help me please?

  • Hi! Where in my webserver should i upload the php file? public_hmtl? cgi-bin?

    • i know this is an old comment but in case others have the same question in the future, here is what you need to know :)

      1. first of all, public_html and the www folder are usually the same - public_html directory will be a shortcut to your www directory or vice versa. this is known as your websites "root" directory. dont worry about the cgi_bin folder. or any others that are not located within your public_html (www) folder unless you are changing your server configurations and know what you are doing.

      2. if you upload your php file to your public_html (www) folder, your file will be accessible from yourdomain.com/login.php

      3. personally, i would add an additional directory ie "login" inside of my root directory so resulting directory structure would look like www/login, then add my php file in there. this will make your file accessible at yourdomain.com/login/login.php

      hope this helps

  • Hi! i have some issue; i cant work this tutorial, i do everything; and i put the conection data in the line, localhost, user and password and name of database like the example.

    I put the login.php into the folder of the localhost server but i cant work

  • I have a similar application using Construct, only my application log in

    form is mostly text boxes, listboxes, and a user avitar image.

    I need to allow users to create a profile and enter in some basic info.

    Does anyone have a php script that I could learn with?

    Basically name, age, email, current date, image file, and some other misc.