 Creating A Log-in Page With Xampp And Php |
Welcome Guest ( Log In | Click here to Register a free account now! )
Register a free account to unlock additional features at BleepingComputer.com
Welcome to Bleeping Computer, a free community where people like yourself come together to discuss and learn how to use their computers. Using the site is easy and fun. As a guest, you can browse and view the various discussions in the forums, but can not create a new topic or reply to an existing one unless you are logged in. Other benefits of registering an account are subscribing to topics and forums, creating a blog, and having no ads shown anywhere on the site.  |
 Jul 1 2008, 08:00 PM
Post
#1
|
|
 Hail Groovicus!  Group: Site Admin Posts: 7,961 Joined: 5-June 04 From: Centerville, SD Member No.: 689  |
For starters, I will assume that you have already downloaded and installed XAMPP, and it is working properly. Here is the link: XAMPP download. I am also going to assume that you are using XAMPP for Windows, although it does not really matter which version you are using. It is pretty much the same. When you have it installed, open your browser and type localhost in the address bar. If everything is working properly, you should see the XAMPP main page. If not, refer to the XAMPP docs to figure out how to start XAMPP. You can close your browser for now. The first thing we need to do is to create a folder for our project. Open Window’s explorer, and drill down to wherever you installed XAMPP (on Windows it will be installed in your C: drive). Open the subfolder called htdocs and create a new folder called password_test. This becomes our project folder. Next, we are going to create the first of three files that will be placed in this folder. For starters, create a text file called password.txt, and type in the following line: qwerty:123456 Save the file and close it. That is the file we will use to check our username and password combinations. The next file we want to create is the index page, which is the page that PHP defaults to when a project is run. Use the following code. Before any html purists jump down my throat, I fully realize that I omitted the doctype declaration. For this exercise it is not necessary, and only detracts from the lesson. So create a page called index.php, and make sure to save it in the password_test folder. Place the following code in it: CODE <html> <head> <title>Password test</title> <head> <body> <h1>This is a test</h1> </body> </html> Save it. Open your browser again (with XAMPP running), and type in the following: localhost/password_test. If everything is working correctly, you should see a plain web page that displays ‘This is a test’ in large letters. If not, back up and make sure that XAMPP is running, and that you followed the instructions to this point. An important note here, unless you want to mess with the XAMPP configuration files, the name of the file must be index.php, otherwise Apache will not know what to do. Some of you may have noticed that, so far, this looks suspiciously like HTML. It is. Apache (the ‘A’ in XAMPP) can be used to serve up plain HTML, even when disguised as a PHP file. Without worrying about the nuts and bolts behind how all that works, let’s go ahead and create a form that will accept a username and password combination. Using a form I borrowed from HTML Code Tutorial dot com, I modified the index.php file to look like the following: CODE <html> <head> <title>Password test</title> <head> <body> <FORM ACTION=process_form.php METHOD=POST> name: <INPUT TYPE=TEXT NAME="realname"><BR> password: <INPUT TYPE=PASSWORD NAME="mypassword"> <P><INPUT TYPE=SUBMIT VALUE="submit"> </FORM> </body> </html> Save it, and run your project again (open your browser and type in localhost/password_test. If you hit the submit button, you should get an error message since we have not created a file called process_form.php yet, which is the next step. So let’s go ahead and create that file now, which is simply a text file. This is where it starts to get a bit tricky, so we will go step-by-step. Paste in the following code: CODE <html> <head> <title>Password test, page 2</title> <head> <body> <?php $name = $_POST['realname']; $pass = $_POST['mypassword']; echo $name; ?> <br> <?php echo $pass; ?> <br> </body> </html> Save the code, and then run your project. If all is working properly, you should see your username and password displayed on the screen. If not, back up and make sure that you followed all of the steps. Now for a quick explanation of what is happening with the code. Quite simply, the majority of it is HTML, but you will notice some sections that start with <?php, and end with ?>. This tells Apache that whatever comes between those sections is PHP, and it must be handled differently. All we are doing at this point is making sure that our username and password combination is being properly handed to the .php file that is going to do the actual work (process_form.php). These two lines get the information from the form: $name = $_POST['realname']; $pass = $_POST['mypassword']; If you go back to the index.php page, you will see in our form that the field where we type in our name has a parameter called ‘Name’, and the value assigned to it is ‘realname’. Likewise, the password field also has a parameter called ‘Name’, and it is assigned a value of ‘mypassword’. You should also notice that the password field has a parameter called ‘TYPE’, and it is assigned a value of ‘PASSWORD’. The next two lines just echo the output to the browser, and are only used to make sure that we have no errors so far. Coding this way is a good practice; do a little code and then test it. It is easier to find an error in four lines of code than it is to find the error in four hundred, or four thousand, lines of code. At this point, if everything is working properly, we are going to alter our code a bit: CODE <html> <head> <title>Password test, page 2</title> <head> <body> <?php $name = $_POST['realname']; $pass = $_POST['mypassword']; ?> <br> </body> </html> Since we know our password and user name are making it through, then we can drop those two lines of code. Now we need to read our password and user combination from our password text file. Let’s add the following code. I added comments throughout to explain what is happening, so hopefully that is enough: CODE <html> <head> <title>Password test, page 2</title> <head> <body> <?php $name = $_POST['realname']; $pass = $_POST['mypassword']; //read the contents of our password file. $myFile = "password.txt"; $fh = fopen($myFile, 'r'); $data = fgets($fh); fclose($fh); //echo the data from the text file echo $data; //print out an HTML line break print "<br>"; //now we need to split our line of data from the text //file so that we can do the comparison. //split the text into an array $text = explode(":",$data); //echo the split user name echo $text[0]; //print out an HTML line break print "<br>"; //echo the split password echo $text[1]; //assign the data to variables $good_name = $text[0]; $good_pass = $text[1]; //print out an HTML line break print "<br>"; //compare the strings if( $name === $good_name && $pass === $good_pass){ echo "That is the correct log-in information"; }else{ echo "That is not the correct log-in information."; } ?> <br> </body> </html> So now for a quick summary of the entire project; First, we created a text file that holds our username and password combination. Then we created a simple html form to accept our user name and password combination. Finally, we created a ‘controller’ that took the password and user name combination from the form, read in the user name and password combination from the password.txt file, and then compared them to see if they were the same. A message was then displayed, which depended on whether or not the combinations matched. That’s really all there is to it. In the real world, passwords would likely be stored in a database, and there would be more than one valid username/password combination, but this provides a quick start. If the password and username matched, one would also set a cookie on the user’s computer so that the server could keep track of which users were logged in, and which users were not. -------------------- |
 |
 
|
|
Feb 15 2009, 07:41 PM
Post
#2
|
|
 Senior Member Group: HJT Sophomore Classmen Posts: 440 Joined: 26-August 08 From: Victoria Member No.: 233,642 |
If your web server supports mySQL, i would also suggest giving this one a go... works fine for me.
PHP, mySQL login form/database Note: you will need to be able to either create tables in the database or do it via command line (explained in the link) -------------------- If I am helping you and don't reply in 24 hours please send me a PM
Currently in training... There's no place like 127.0.0.1 There are 10 types of people in the world, those that can read binary, and those who can't. |
|
|
|
|
Apr 30 2009, 05:30 AM
Post
#3
|
|
 Forum Regular Group: Members Posts: 332 Joined: 6-March 09 From: The inside Member No.: 304,801 |
u make a tiny typo i think:
QUOTE for starters, create a text file called pass.txt and later on: QUOTE Now we need to read our password and user combination from our password text file. and in the code you also refer to password.txt: QUOTE //read the contents of our password file. $myFile = "password.txt"; the problem is that we have an "pass.txt" which should be named "password.txt"? If i'm missing something, please say so  Note: i first didnt got the localhost-start-page working, i found out that windows was blocking it. -------------------- Every one goes fun fun fun Who is this doin' this synthetic type of alpha beta psychedelic bleepin'? ~Chemical Brothers - Elektrobank |
|
|
|
|
Apr 30 2009, 12:18 PM
Post
#4
|
|
|
Hail Groovicus! Group: Site Admin Posts: 7,961 Joined: 5-June 04 From: Centerville, SD Member No.: 689 |
That was a typo. I'll fix it.
-------------------- |
|
|
|
|
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:
| Lo-Fi Version | Time is now: 21st November 2009 - 08:45 PM |
© 2003-2009 All Rights Reserved Bleeping Computer LLC.