PHP Login & signup website with basic Security | MYSQL, CSRF tokens, prepared statements & more

hello and welcome to this tutorial so i'm going to teach you how to create a sign up and login system that has security to prevent hacking all right so to begin with i must mention that there is no such thing as absolute security so every security system is only as good as its weakest point so as much as you can put a lot of security on your website if somebody gets your password for example then all that security will do nothing so keep in mind that these are simply basic precautions you have to take for your website to make sure that at least it has a minimum amount of uh security okay so to begin with we're going to be using php so i am using xampp as my server so you must have a server of some kind for you to be able to run this so make sure you have xampp or wamp or whatever it is running and start apache and start mysql because we're going to need to create a database as well all right so once we have that out of the way we can go to our htdocs folder this in my case is drive c xampp htdocs and this is where i put for my website for your particular server if it's different to this that might be different so just find the public html folder and create a folder in there so we're going to name it login for simplicity and then i'm going to open that folder but what i will do since i'm using sublime text as my text editor i must mention that you can use any text editor i can simply go to view sidebar and show open files so that i can drag and drop my folder from here onto my text editor this way it's easier to create files in here okay so the first thing we must do is to uh look at the list of security features we're going to look at here so i've written these down here so the first thing is we're going to look at how to structure your folders so that you have better security the second thing is uh you need double validation then there's whitelisting sanitizing your input and using prepared statements and then you must give vague error messages and then or disable all production error messages and then we're going to see how to use uh cross site request forgery tokens to to avoid getting hacked this way and we're going to look at html escape escaping to avoid being hacked using javascript okay so this is the basic stuff you need to know in order to create a website to have at least some basic security okay so in the other tutorials uh i'm not i don't usually cover all of this because it would make the videos quite long so this is why i decided to do a specific video for web security then i can reference it in other videos all right so let's get started here now to begin with we look at the folder structure now the thing is if your folder is on the internet it's obviously it's obviously accessible to anybody that has uh internet so let's see this uh in action so if i go to my login folder and let me create a new folder in here and i'm going to call this one public just so we can have a folder to look at okay so if i go to my website my my browser here i'm going to type localhost and slash login is our folder slash public because we created a folding there okay so if you can see here the public folder is visible now if i have a file in my public folder here so let me create just a new text document here okay so if i'm on the internet like this somebody can easily browse these files okay so any folder you have on the internet will be accessible to anybody who can simply go to that navigation so for example the images folder somebody can easily go to your website right click and say inspect or view image info and then you'll get the path to that image and then they can simply open that folder to see other images that you didn't want them to see and so on so that is a risk a risk to your security so the first thing you must do to get rid of this situation where somebody can see your content remember that every php website the server looks for an index or home page in that folder so in this case the reason we're having this index of is because our folder doesn't have an index or home page so instead it just shows you the index of that folder so to destroy that issue what we will do is let me delete this file let's go back to our right in the public folder i'm going to create a new file and i'm going to save this as index dot php okay so i'm going to save it in there now if i go back this time and refresh you see that i get an empty page instead and that's because the index.php page was found and therefore it was loaded so this is one way to avoid people snooping around in your folders you can simply put an index.php page that is empty in each and every folder okay so that's one way to do it now the second thing to do is to separate your folders your important files and the public files so any css any uh images and so on will be in your public folder however all the important files like functions and so on will make a new folder and call this one private okay now the reason we're doing this is because you will set well once on the internet you're going to set this public folder as the default folder that somebody lands on when they go to your website so let's say it's www.facebook.com once you open that this is the folder that's going to be accessed this one right here so it's not possible for somebody to go a step a fold out of this folder because when they type your url regardless what page they're accessing they're going inside this folder so they cannot go out of this folder to the private page that's just not possible so this adds an extra layer of security but sometimes you know people are hackers and they can they might manage to get to you somehow so let's see a situation where they do manage to get to you so let's change this public to private like this so again we have this issue of uh the index of being shown in the private right so if for some reason they get here what you could do as well inside the private folder you can put an index.php page that is empty as well to protect yourself now there's another option you can do and that is to create an ht uh access file so let's go in private right click and create a new file and when we're going to save we're going to write something like options capital o options like this and then let's put a minus sign and say indexes like so and then let's save this as dot ht access don't put a file name just dot ht access and then this is all we need for this file so i'm going to close it now let's come back here and try to open this and when i refresh now it's going to tell me that access is forbidden so this will be forbidden for all the subfolders in this folder right here so this is one way to make sure that somebody cannot access uh this folder this is a more robust way of doing it okay so all your important files like functions will be in here so let's go ahead and create a few files inside private so we're going to need two files so new file uh we'll put our php tags here this one will be the connection connection dot php actually what we're going to name it is database database.php this will connect to your database so let's save that so make sure all the files with important information save them as dot php because by default the the server is going to process php files before sending them to the user so you can hide important information that way so the second file we're going to create will be for the functions so let me put my php tags there save functions dot php great so even if you just simply saving text data in these files you have to put them in php tags that way uh nobody can if they try to access those files it would be a bit harder to do so all right so now that we have that we can go back to our index page in the public folder and in here let's put our php tags as well like so and then we can begin creating uh an actual uh website with the login and sign up okay so this takes care of the folder structure right here right there you can have a more robust folder structure but this is the general idea so in order to look at double validation let's actually create a login and sign up page so that we can see that in action so the first thing we're going to do here is include our files here because these files in private are required to run our website so what we will do is just say require like that so because we are going outside the folder we are going to put dot dot slash that's how you go outside the folder and say private that's the folder there and then our first file is database dot php okay so i will duplicate this and then i'm going to say functions this time so i can include the functions file as well now this is all fine it can work uh just fine the only problem is if you have many files let's say you have a hundred files on your website and each one includes a list of files at the top because you must put these files on every website file now the problem is that comes in when you want to add an extra file here it means you have to go through all 100 of your files of your pages and add that new file so to avoid this problem i'm just going to copy this go to private the private folder create a new file in here put some php tags and then i'm going to require these files in here so save this as autoload dot php so these are just names you can give these files but the advantage of doing this is that now in the index page i only need to require one file which is the autoload and then the autoload is going to include the rest of the files so this way if i want to add one file to the website i can simply add it in auto load and automatically to be added to every file on the website that contains the autoload file there so that's how you become more efficient okay so at this point we can close off the tag like this and let me go back here and let's go to public now so we can access the index page so no errors here it means everything went well so let's add our html tags here and the only thing let's let me give it a title of home the only thing i'm going to say here is this is the home page refresh and there we go so that's the home page right there which means everything is working fine okay so now we must this actually uh completes the folder structure section and now we must do double validation there so to do this i must create a sign up and login page so let's begin with a sign up page let me close this auto load so we're going to create a new file in the public folder new file so this one we're going to name signup dot php okay so let's create a very simple form here so i'm going to close off the php tags there and i'm just going to start my html tags and this one is sign up okay so let me create a simple form here i must make sure to add a method which is a post like so okay and then i'm going to add a div which will have the title of sign up all right then below that i'm going to add several inputs i'll put input of type text with a name username and then there will be a password there and then another input a third input for submit button submit we won't put a name here we'll put a value instead and this one is what will show up which is sign up and this one will be actually let's try email email and password great something like this all right so now the important thing uh with security is first of all if you have an email section it's better to uh this is the first uh section for the validation because it's double validation this is the front end so here make sure you write email you give it a type of email that way it will make sure that the user is entering an email and then here make sure you put password so that it can hide the text of the user and then the next thing is you can put these [Music] these inputs as required so just put required there i don't need to do that just that required is enough and required here as well let me remove the word wrap okay so that's the code right there so now what this required does is first of all if i refresh my home page okay let's go to the login page so at the end we'll say slash this is actually the sign up page slash signup dot php okay so this is what we get now the required section make sure that if i click sign up it will highlight these boxes to make sure tell me to fill in these fields so let me fill in this field right here and you see it's telling me please enter an email address because it knows this is not an email address and in the password i get that so this is awesome this is the first layer of validation here now let's go here and put some styles so i'm going to put some styles here so that these guys can look much better so first of all let me put some break tags on these and i'm going to put another brick tag there i'll actually put two here so that there's more space okay so let's uh style the form so i'm going to style the form i'm just going to say form open close bracket i want it to be in the center so say imagine auto and i'm going to put a border solid thin so we can see it aaa gray color there and i'll put a padding of six pixels okay and then i'm going to that's probably it and then there's this div right here so i can give it an id of title like so so that i can style it as well and just say title and i'm going to say background color so just give it a random background color here i'll say padding 1m and then i'm going to say text align center oh where did i go text the line center okay that's uh pretty good and then let me style the body as well even though this is inside the body so what i could do is just put a style there or i could move the styles above the body and here i'm just going to add a font family so that we have a better font uh rodanna you can put whatever you want there whatever font you like and now i can style the inputs so what i will do with these inputs i'm going to give them an id of text box so i can style them together without styling this so i'm going to put text box over here and we will say first of all the border solid oops thin aaa that's a gray color and let's give them a margin so they can be separate from each other of maybe four pixels that should do okay and then a width with oops width of say 98 okay save that so here we are and let's refresh okay so this is what we get not very nice so let's go back and change a few things for starters i don't want how it's filling the whole page so i can easily rectify that by saying max width should be uh 200 pixels like so yeah something like this and then these guys are going a little bit overboard here so let me come back here text box so i would just say margin top so that only the margin at the top is affected let me put six pixels there let's see if that changes anything okay there we go so that looks much much better and now i can easily right click on this thing and it say inspect element and then i'll see my blue color over there just grab that and actually before i do this let's go to the title let me give it a color so i can change the text color as well so i'll give it a color white like this and then i'll refresh so then i can change my blue color there to any color that i want in the spectrum here something like this or whatever it is then i'll copy this color and put it right there and replace that blue okay so for demonstrative purposes this is good enough right so here please enter valid email great so this is the first layer of validation right so now let's let's actually post something so that we can see what's going on so we're going to post to the same exact page right so everything we post will come to this php section so in order to be able to use our functions we're going to get this required file and bring it on the signup.php and simply paste it there like so okay so that's great and now what i want to see is when somebody posts something i'm going to come here and use the server to check if something was posted so that we only process information when something was posted so we're going to say dollar sign underscore server because that's the server variable which contains a a method it will contain the post method if somebody actually posted something because we have the post method right here so if server request method underscore method if that is equal to post like so it means somebody actually posted something okay so once we get to there something was posted so we can uh just show what's inside the post so here i'm just going to say print readable which is print r sorry post so we just want to see what was posted like that so let me add an actual email address and then i'll add a password one two three four and hit that button so as you can see now we have uh the email there and the password in this array so everything seems fine now so we've taken as you can see this is double validation so the first part passes now the problem the first part is an issue is because somebody can easily go to your page right click here and say view page source and then they can copy this create their own version of this form and then they can change these from email to something else and actually send you the wrong data this is why you must now check again at the top here to ensure that you have the correct data before you send it to your database okay so we're going to do that just now so let's go up here this brings us to our other point here which is white listing using regular expressions so what exactly is white listing there's two types of listings there's blacklisting and then there's whitelisting so for example let me uh if for example i need an email from or let's say in password for example in password i just want words in here i don't want numbers why or let's say i want a password with numbers only no letters or symbols or anything like that so what i will do instead of looking for all the things that uh i'm i forbid from this uh section i'm going to look for the thing that i'm actually looking for so for example if i only want numbers in this password i could say something like if it's a number for example if is numeric something like this so this is white listing because i'm looking for a specific uh password which is a number okay as opposed to uh instead of going around and saying make sure that it's not a letter or it doesn't have this symbol or it doesn't have that so instead of looking at what it doesn't have that it should just look for what it actually has so if i want a number i should just check is it a number or not instead of saying is it a letter then don't accept it is it an email then don't accept it the reason is that blacklisting or the things that you've blacklisted can be more than what you need to whitelist and as a result you can think of everything that the user can actually type in here users are very clever sometimes they'll type maybe you didn't account for the percent symbol and somebody will put a percent symbol there and you want to know your software won't know what to do with it but if you're looking for a number it doesn't matter what they type in here as long as it's not a number it's going to be rejected so that is white listing so look for a specific thing give a specific criteria of what you want in your inputs and then just check if it's that if it's not reject it so that is white listing okay so let's see how we can go about doing that so for example we are looking for an email here so we want to see if this is an email or not that's what we want to look for now i'm going to give you a quick crash course on regular expressions and how to check for simple things like that so it turns out that uh sublime text actually checks for regular expressions when you are searching for stuff in your code so let me save this for a bit and then we're going to go down here at the corner here and then we're going to click here where there's a star and the dot that's regular expression so once you click that you enable searching by regular expression so for example regular expressions are very good at searching for things so let's say for example i'm looking for the head tag here now normally without a regular expressions i might just type something like this html like that okay so well i'm good it's going to find that tag right but what if i'm looking for any tag whatsoever in this uh in this page so any tag will do the head tag the html tag how do i select all of those now you can't use normal searches to find such a thing you need to use regular expressions so in order to do that you have to create a like these brackets like that so these brackets will determine what is optional to search for so first of all we all know that these guys have this and that or tags have that so we'll put those outside so i'm going to put this closing tag here and that one there okay great so now we want to look for any text inside in between these two so to find any word in there i'm just going to say a to z like that so once i say a to z it's going to look for everything that has this symbol and any letters in there and then this closing bracket however this only means one letter right so if i had for example i had a tag like an a tag like this you see that this a tag is selected okay it's selected there which means it's been found so if i put another one like a b tag here that would be accepted as well because i'm looking for just a single one now if i want to look for more than one i'm going to put a plus here like so so as you can see now this is also selected now html head is selected title is selected b is selected so you can see the power of regular expressions i can select multiple things here if i want to find all the closing tags for example simply put that there and now i'm looking for all closing tags so as you can see that tag that tag and so on so how exactly does this work so the regular expressions are quite simple what this means here is if you put these brackets you're telling it uh you want to put a criteria what to find anything that is outside this means it's a literal string so it should be found as it is like that okay so you can put a to z and then you can could put capital a to z or you can put because right now if i put a number in this title for example let me put a number here it won't be selected anymore because it doesn't match this criteria it's none of these words here so what i could do is put 0 to 9 and then you see now it's selected which means i'm including numbers as well so you can include as many symbols as you want if i put a dot now here for example oh sorry there if i put a dot here this breaks unless i put the dot as part of the criteria and so on so regular exp uh regular expressions are very powerful so it's a good idea to actually learn the basics of these regular expressions until you find something uh that you are looking for now for us to deal with the email this is what we're going to do so a good way is to go and google what regular expressions do what so and then you can test them in sublime text right here so for example let's look at our email there and say at yahoo.com right so this is what we want to to check for so i'll put it in quotes like that so we can generate a regular expression until we see it selected completely so to start with i can say confidently any email will contain words here right letters and numbers sometimes and sometimes symbols right so we're going to uh [Music] we're going to use something like uh wait a minute here we're going to do that and then okay so this is finding individual letters here so a letter there a letter there a letter there and so on except these symbols are not included so letter letter letter so let's look at numbers if they're included in there and so numbers are included so this is a good way uh to do that and sometimes i've put this because sometimes an email address will have a hyphen like that so we're including that as well so these are the characters of the keyboard here and then we're going to put a plus so that we don't select just one there we're going to say plus like so so now you can see it's selecting all the words here one word there one word there and so on but not selecting these symbols here which is great all right so then we're going to put an ad symbol there which eliminates everything else but then we'll repeat this here let me copy this so an email address is a word here at symbol another word the dot symbol and then another word yeah i think that's about it so this is how the email looks like now to make sure that we just get what's at the beginning and at the end we can put a uh this uh what do you call this uh this carrot sign on top of number six like so so from the beginning it should have this and up to the end we put a dollar sign like that okay so this is how you check for your email address and we can use this in php so let me come here and say uh first of all let's get the variables from here so what we would do is say email is equal to post okay email like that and then password is equal to same thing oops post password like that so we have our email we have our password now the only thing we have to do is pre-match this to make sure that it actually fits and so at the top here i'm going to create a variable called error so that in case we have an error we can just put that error in there and display it later so i'll do that so now here i'm going to say pregmatch so let me give some space here i'm going to say pregmatch this is how you match using a regular expression so we're going to put our pattern in there so that's the pattern we created there so to do that i will put quotes like so and then i will put slashes like that and then i'll put my uh pattern in there like this okay hopefully that's correct and the subject is the email so let me come here and put that subject there so we're checking if preg much so if this is correct if the email is an actual email we're going to uh get a true but if not we're going to get false so i'm just going to look for a force here by doing that and put the closing there like so so if a prick not pregnant this then we're going to have an error so i'm going to put the error there and say please enter a valid email like so and then what we will do is of course this part has to be removed we're going to come here so that we can echo out our error just underneath the form here so just below the title so at this point i'm going to add a div like this and i'm going to put some php tags here and i'm going to check for i'm going to close them there so what i will check for is whether there is an error or not so say if first of all let's check if it is set sorry that is set if is set error because sometimes we may forget to set it and we say and error is not empty like that so if it is set and it's not empty then let's echo what's in there as simple as that okay great we're doing great so far so let me refresh this and it's going to ask me to resend the data oh great let me resend the data so i don't see any errors here so it means things must have gone well uh this is way too big this one m let me put it at point five right so let's intentionally add a wrong email here so let me put let's remove the ad symbol something like this and then hit sign up so of course we will get this here so let's disable it for a second and just type put text here so that we can see the other system in in action so let's do that remove the add symbol so that's no longer an email then sign up okay it needs a password great sign up don't save so it's you see the error please enter a valid email because the email did not match our preg match here which is great okay so that sorts out that problem so now we can come to here white listing we've done with regular expressions now we can come to uh sanitizing and escaping inputs for the db okay so at this point we have our password and we have our email now there are times if you for example you are getting somebody's name okay let's say you have a name field here so somebody could could write a name like john's mom okay so this person is not really trying to hack your system but however this this apostrophe here is going to cause a problem because it actually means something in the database so let's see how that can actually have an effect by testing it out okay so uh we're going to forget about actually what we will do is just add a name field here so i'll put email back here great type email type text and then here i'm going to say username something like this okay then come up here and also get the name here password name so it's what username great so for the username as well we can do another uh preg match okay to eliminate those issues for example so now if you're not going to use the preg much and you have a name like john's mom here this is not going to go into our database very well so in order for us to see that let's create an actual database so i'll go to the tab here and i'm going to go to localhost um phpmyadmin so let's see localhost phpmyadmin uh okay everything there seems fine so let's wait for it to load there we go so let's create a database here so that we can have something to work with so i'm just going to say login underscore db just so we can have a database to work with let me zoom out here and let's create a table called users let's go here right so the first thing we need is an id there and then we're going to have i think instead of a user id let's use something longer like a url address probably something like that this can be anything really username and then we're going to have a password and then let me add one more column here username password and email and of course we may need to add a date so date great so here in the id i like to use bigint on the url address i'm going to use variable character with this is up to you i'll just use 60 that's good enough then the username variable character maybe we can see 20 characters there that are required the password is also 64 because we're going to be hashing this and then email 100 variable character and then the date will be date time and then just make sure that the id has auto increment on and a primary index and so once we do that we can hit save okay great now we can put an index for the url address because that's the identifier for the user and the username we're going to need that when logging in just like the email if you're not going to be searching for a field no need to give it a uh an index just like password we will never search for the password and so on okay so this is good enough so let's try and save some data in the database so to do that we're going to go to our as you can see here there's a post username and post password we're only checking for the email for now so let's leave that as it is and then let's come down here and actually try to to save into the database okay so to save into the db is quite simple let me go to database.php so i can add my values there so i'm going to i'm going to create uh some variables here so i'll use the define uh the define function now this one creates constants because these things are not going to change throughout the the working of the script so we might as well make them constants so here i'm going to say d b let's use capital it is like this db name what would be the name of our database so here it's a login underscore db that's what we named it then let's put a semicolon and then let's copy this a couple of times so here i'm going to say db the user and of course we're going to have the password and then we need the okay we have the db name of the user the password and we have you could add the host if you want and what else so we have the db name the user the password the host and i think that's about it so these are the constants that we're going to have in db.php so since we've created these we can use them anywhere so our username is root so if you have a different username you can put that one there we don't have a password and our host is localhost like this so down here we can create an actual database connection so let's going to say connection is equal to mysqli connect like so that's how we connect so here we're going to give our [Music] uh we're going to give these constants here so let me start with this one so give the db host and then we're going to give the db user i hope this is the correct order because sometimes i get these wrong and then we're going to get the password and then we're going to put the db name so the db name is at the end because sometimes you can omit it and the things will still work okay so we'll put an if statement here to tell us if things went well or not so we're going to say if not we just want to echo an error if this didn't work out then we're going to say die with a message failed to connect like so okay so since this file is already included in our our project if we just refresh the page we should see errors if there are some errors okay so unidentified index username okay that's because we hadn't refreshed that so let me just refresh it as it is so since we are not seeing any error it means the connection actually went through so this is great now we have a connection to use so now i can come to my signup page here since we have the file included there so we can use that connection so i'm going to say result or let's create a query first of all so the query is going to be simple enough to insert something in here so we're going to say insert into users that's the table [Music] open bracket and close values open and close bracket so i usually get this wrong because values doesn't look like this right so there we go so what values do we want to put here so if we go to our users table here we have dates we have email so what we need to put is the url address the username the password and the email okay so we have those so let me start by writing them here i'll say url underscore address coma let's move you over here username password and what's this email and date okay so those are the main ones so i'm going to copy these copy because the order is important i will paste them here and convert these guys into variables by putting the dollar sign at the beginning and move a step back put an inverted comma then put another inverted comma at the end because these are strings so it should be like this great this is going well and so for the moment of truth we're just going to say mysqli query so we're running that query now and we don't need to return a result here so we're just going to say connection and then slash the query itself like that so that's how you run a query okay so at this point we are getting user supplied data which is always unsafe so you should always assume that the user is a hacker or a malicious user who's trying to hack your system that way you can be well prepared for your input but for argument's sake we are simply sanitizing the email but not the username or the password so that we can see a few issues here if we don't do that so let's try with something legitimate and see if it's going to actually work out so we have nothing in our db so let me come back here and let me create a username here let me put my email address and let me put a password and let me hit sign up okay so now we have a problem here and defined variable uh url address and date so but i'm sure it must have saved something oh no it's not so that's great so we didn't create these variables so let's do that now let's start with the date which is much easier so let me copy the date here so i'm going to come here and paste it there wait like that date is equal to let's use the date function like this y m d copy to h i s like so okay now that we're done with the date let's create our url address like so url address is go to so we're going to create a function that will generate this url address so i'm going to call this function get uh it's going to be a random string so let's just say get a random string that's more descriptive and then we're going to supply a length that we will be the maximum so i'll put 60 there because uh in the columns there when structuring this we set this to contain at least 60 characters so it can handle that but 60 will just be the the maximum it can be shorter or longer all right so to finish up let's get this function and uh let's create this function so copy this i'll go to functions.php and we can create our first function in here get random string with a length there of some kind and then let's do that now the function here involves typing a lot so i'm just going to copy what i already have here and that should be enough i'll just explain what this is let's remove the word wrap and let's come back here and push this in there okay so this is our function so our function is starts with an array so this is an array of all the possible values that i want in this random string so if for example i want symbols and such i can put them there just add more uh locations to this array so this one in particular contains all the numbers and all the small letters and then all the capital letters and that's it so there's about 61 items in here so if you add more you have to change this number to suit the number of items there so we start off with an empty text and then we look at the length that was applied so in our case the length is 60. so we're going to say get a random number this is how you get a random number rand between four because we don't want it to be less than four str uh four characters so between four and whatever maximum number was given which is that one so this length is different to this one so let me just make sure it's the same spelling great so now whatever number we get in here is a random number that would be the actual length of our string so it could be something like 20 for example so if we get 20 we're going to loop through this section 20 times because we're using that here so this is going to go 20 times around and each time it's going around it's going to select a random character from this array okay between 0 and 61 which is this array right there it's just going to generate a random number between these two and then we're going to get that number from the array whatever number comes out which is this random here so let's say it gets number two so this will be zero one two so we'll get this two and add it to text which is currently empty so it will start with two and so on and so forth so you get all these numbers a random number here so we're going to see it in action and then we return the final text here so that's our simple function there so it's get random string so let's go back here so now we have our date we have a random string right there so this is great so now let's try and login which should work this time so if i refresh the page i should get no errors this time okay so i get no errors it means we actually managed to sign up but of course we are not seeing anything there that's because our query did not go very well it seems so a good way to figure out what is wrong with your query is to actually echo the query before you actually run it so i'm going to say echo right here just after i create the query and say there echo query so refresh again boom and there's the query so we run that comes here values insert into users so here is the random string that was generated and then we have our username we have our password and we have our email and then we have our date so everything seems fine but in case you're wondering what the problem is we can easily just go to our we copy this query go to our table and go to sql and right here we paste it and then try to run it so already i can see that there's an error here is telling me ending court was expected near the closing site so there's an ending quote that isn't there so this is our error here so let's see where we are missing a quote so the error says was expected ending court was expected near so after near there's a closing bracket now that's the character where an ending quote was actually expected so if you look very closely here you'll notice that each of these items has an opening closing quote this one closing but the email does not have a closing quote so it's assuming that this is the closing code for email and then this one has only one of those so let's go back here to our code and go through that so i missed a this one a quote right there so that should solve the problem now as you can see the quotes are important here because they determine which of these is a string now you can imagine if somebody types in a name called um somebody says john's mom for example john something like john's mom jones is john's mom so this apostrophe here will be included in the name here which will completely distort the whole uh the whole query here that's why this could be dangerous even though it's not malicious but it could be dangerous so what i will do is i'll stop doing this because i've already seen the error then i'll just go and try to run my query this time so instead of running clicking sign up here i'll just refresh so it can resend the previous data and so we get an echo so i should remove that i forgot to remove that but i think if we go now we'll find a record okay so there a record was uh actually entered in there which is pretty good but let's try and enter another record here so we're going to try john's mom for example and let's put an email there and let's put another password so let's try and sign up this time so everything seems fine so let's go back here and check and you're going to notice that this time nothing happened and that's because let's go back and try to echo our query i'll bring back the echo query here and then i'm going to refresh again like this so we can see our query so you see as a result there's this problem here this john so which which now means this becomes a string on its own this john and then the s to here becomes another item altogether so which means they've become there are more items here than they are here now this is a very benign example nothing bad would come of this because it just won't save in your database however there people are very clever who can actually use this to hack your system they can simply simply put some code like let's see john's mom and right after the s here they'll put dash dash like this so this means this is a comment the rest of it becomes a comment and then they can type in some other things in there so they can design a query very well crafted to actually mess with your query and hack your database so to avoid this there's a very simple thing to do is to just go here wherever there is uh suspicious items you just tell it to escape those characters so what what to escape a character means let's come here and say i'm going to type john like this and then i'll say john's mom the same one we had used so now as you can see this uh text editor is getting confusing it doesn't know where the sentence is starting and ending the only way to stop this is to put double quotes outside like this and then now it knows that this is a string right but the way it was it couldn't tell where the string starts and ends so according to it this is one string and this is a constant and then another string is starting here so to avoid this you can escape this character so to escape this character is simply after the character you put a slash like this oh the other one what is it oh you you actually escape it before wait a minute how am i getting confused here so you're supposed to escape the character this is the escape but i was expecting it to actually change but it wasn't changing but anyway we can try to see how this comes into play by redoing the john's mom and then i'm going to put an email address here one let's go back here one two three four and then right here i will put an escape like that to tell it that this is a literal character right here so let's see if that actually works and then let me go back here to the browser and now you see that it has actually managed to sign in and write jon's mom correctly there and that's because i escaped this character so this is character escaping right there i think this is part of the list where is that oh there we go sanitizing and escaping for the database okay now you can't expect the user to write something like that so you do the escaping on your own now to escape a character is very simple you simply add the function add slashes like this so once i say add slashes like that it sanitizes the the contents of this here so now i can go back and write jane's mom like so and then let me put the email address and then sign up and you notice that jen's mom will go through so we have three things there now so this is how you escape a character now a better way to do it is to simply uh create your own function so let's go to functions here and go and say function esc like escape and then write maybe word or something like this and then you just tell it to return an escaped version of this string so it's just going to say return add slashes word like so so all you're doing is escaping it here now the the advantage of doing this is as you are programming in here you're going to be using add slashes a lot now imagine if add slashes for some reason doesn't become enough you realize that you need to do more to escape your text it'll be very difficult to go back and change this to another function so instead all you have to do is write escape here to call that function right the one we created like that and then in functions here you can add some several layers of validation here to make sure that the character the word you're sending back is actually clean after all that okay so if you want to go really deep you can put something here and say type that way you can have a need an if statement check checking what you want to validate this ads do you want it to be a number then you can just say convert this to a number whatever it is because what i need is a number and so on but we won't go that deep this is uh enough okay so that's how you escape a character or the other thing is to use a preg match like this one so you can escape it here or before escaping it you can try to use a preg match and then check if it's only letters and numbers so this is very easy to do so i'm going to copy this right here where i create the uh this part so what i will do is just to make sure that somebody is not trying to put malicious code we're going to say move username here copy that and put it here because we're checking for the username and now our regular expression will change to okay here i want to just trim it to make sure that all the spaces are removed from the beginning and from the end like that so that's how you remove those blank spaces there let me do this and then now to check we'll leave the beginning and end because it has to check from the beginning to the end and then we just change what is in here and then here we have a to z that's what we want to look for and then capital a to copy to z this is all we want we don't want spaces in the name we don't want but if you want to include spaces just leave a space there that will be included so we don't want spaces we just want letters capital letters small letters that's it if you want to include numbers you can say 0 to 9 like so but this is enough so you say please enter a valid username like this okay so at this point we are sure and then just to be sure we can still get this username because now username is inside this username we can escape it after this we can just say equals to like that username so even if it passes this test we can escape it as well and then the password we don't want to do a pretty much uh but you can do that if you want the uh if you want the password to contain maybe capital letters at least a capital letter at least a small letter and so on and so forth so you can use a preg match and design a pattern to suit that okay so the password here escaped escaped and then we can finally save and then once we save let me remove that we can send our user to the login page by going saying header and location login dot php and then to do a clean break we're going to tell it to die all right so this is how you sign up somebody and then send them to the login page to actually log in so the next point is prepared statement using prepared statement now sometimes uh to avoid all this escaping right here if you don't want to do all this uh escaping you can simply use um prepared statements now what prepared statements are is that you can prepare a query in advance so for example this query here has variables there right now what you could do instead of doing this you can have the you can have these variables only with uh their representatives like for example let me come down here let me duplicate this to create a new query let me mute that one okay so here what we will do is remove all this um these variables right there and then replace that with a full colon like so and then let me remove all the other semicolons there i don't need them anymore so you see what we've done here we're not putting our variables but we're putting a four column and a representation of that variable here so what this will do is it's going to make sure that it prepares this query and knows which part of the query is just the commands the query itself and then you're going to send the variables separately then it's going to put those variables one by one here so that way you can avoid that issue of john's mom it won't be an issue even though you don't escape the character because it will know that this whole thing that was given in here is an actual value and not part of the query okay so let's try an example of prepared statements here okay so let me go actually before we even went to that you see as we are getting errors here even if we get an error this part still runs so at this point what you're supposed to do is put an if statement and say if error is empty like this this is the only time this part should run if the error is empty so i sorry i forgot about that when we're running it the first time like this let me move that one here this will ensure that we only save when there are no errors okay so that's great so now let's try and do prepared statements so to prepare a statement is rather simple so what you do is you just say you create a statement so we're going to call it statement short for statement we're going to say connection prepare like this so we're going to prepare our query like this okay so once we prepare our query then the next thing is we'll use this statement now to run the query so we're going to say statement execute so okay uh just like that actually and that should actually work so prepare the query then execute it very good so now what we're going to do is we're going to start with the original query just there like that okay actually what we will do is let's go straight to the other side let me run this one okay so what we do now how do we tell us how do we tell it uh what items to put here what variables to put here so we will create an array of those variables so we may do that array at the top here and just say r should for array and then this is the important part the value whatever word for example url address i used here i should use the same memory in the memory location there so i'll copy this one in the array it should be url address like that then i will put the actual value there like so so all i need to do is put all those values in here every single value it must be the array must be just as long as these values one two three four five so the array should contain five items so url address and then i will change this to date and then we have username and then we have password like so what have i forgotten [Music] email so let's get the email so the order doesn't really matter as long as it's in there that's good enough so once we create that let me copy this array and put it on the execute there like so so we prepare our query and then we simply execute it now once you prepare a query you can execute it multiple times without running the query again you can just keep changing these values so i can have another array here i can i can replace the values in this array the second time here and then simply run execute because i've already prepared the query so this way prepared statements also speed up performance but we're not going to be needing that here we just want to see a simple example and for us to actually be able to see this i want to remove the brake much situation here so that i can i can put an invalid username and i won't escape it as well here so i'll close that so no escaping just that so first of all let's see if we can actually um and let me remove the redirect here for for now let's just see if this will work at all okay so let me come back here so so far we have three items here so let me try and create a new peter's father let's go to an email address just random stuff and sign up so we have a problem here and defined variable con on line 36 so definitely my bad because i used corn instead of connection right so there we go i don't know why i did that but there we go so let me resend this call to a member function execute on boolean so what this means is that a boolean is a value of true or false so we are calling a member function execute on a boolean so what this means is that this statement right here is equal to true or false it's not an actual uh object here so this is equal to either true or false and that's what we are trying to run this execute on which we're not supposed to do so it seems uh prepared statements don't work directly here which i actually thought they did so anyway uh moving on let's create a different kind of connection so that we can try these prepared statements after that so for that we're going to go to our database here so at this point i'm going to create a new connection down here i'm just going to duplicate this this time i'll create a pdo connection now pdo is just like mysqli which creates a connection to the database but pdo is multi-purpose because you can use it to connect different kinds of databases not only mysql database but it could be postgres or something like that so in order to to do this is uh quite easy let's create a connection string so i'm just going to call it a string so it's easier to see what's going on so just say s string sorry e02 now the first thing we have to tell it is the type of connection so because it's a multiple uh it's a multi-purpose connector so my sql like that so that it knows it's mysql full column like that and then we're going to give it the host so we're going to say host is equal to localhost so of course you can put these values there but i just want you to see the way the string is constructed so you can replace these later with db hosts just put the db host there and then we put a semicolon and then we're going to say db name like so is equal to and then we'll put the db name which in our case is what is odb name login underscore db and then let's put uh do we put a semicolon here or not i'm not really sure anyway let's just put the semicolon at the end so the semicolon here is uh segregating these two so this string is enough let's copy that and put it here we replace the host right so we already have the db name so no need for the db name here so string comma user comma password great now we replace my sqli with pdo pd oh so i think we'll put a new new pdo like that okay so let's cancel that just so we can see an error here if it happens so let me refresh and let's try again and as you can see now everything worked out well so i guess pdo is the way to go so let me browse here and as you can see we have our record here peter's father and so on so as you can see without escaping these characters we actually managed to load peter's father there let me try we managed to load peter's further there without escaping the characters let's go back to so let me remove this so from now on we use prepared statements like so okay and now to cement this in case you are wondering how to do this i can just get db host over here and replace that so i will put the brackets like so dot dot and paste that there so i'm connecting that exactly so i will copy this and put it in there like so word wrap keeps coming back okay so yeah i actually don't need this last part because it's an empty string so like this uh [Music] what was that supposed to be db name so there we go db name okay so that's a complete pdo connection right there okay so if you want to use prepared statements it's actually the best way to do it because there you avoid all that issue of being hacked just in case you forget something so and then you just prepare your connection to your query you can make this into a smaller variable like con just so it's easier to type instead of connection and so you prepare and then you execute in the execution you put your array which contains your values so if the number of values is more than what you have given here it will cause an error so just be careful how many you give here and how many you give there okay so at this point we can put our header redirect so that we can take the user to the login page now we can create a login page from this so here i can leave these errors because we need these guys so i can also leave the escape there just in case so these are all layers of security that we can add to make sure that we're getting the right data that we want to put inside our database all right so now let's just copy all this and create a sign up page because it's pretty much the same so i'm going to go to public create a new folder a new file sorry and paste it there and i'm going to call this one login dot php yeah so now we'll have our user login so to log in we don't need their username here i can remove that username change the title to login and change that there as well to login okay so email password required required and if any errors they're going to be showing here that's great and let's change that as well to login dirty goody goody and then once we log in we're supposed to be redirected to the index page okay word wrap is coming back so anyway to change the settings i i keep fighting with this word wrap here because i don't need it so to change your preferences in sublime text just go to settings maximize that and then look for the setting that you want word wrap that's the one i'm looking for right there so you can go through all the settings here one by one to check what they do and there's instructions there so what i want is to get this if so whatever setting you want to change just copy it and put it over here so the comma should be at the previous one like so yeah so no comma at the end this is a json in case you haven't recognized it so here word wrap it says i can have it either on a true or false right so i want it on false permanently so i'm going to put force there like that and i'm going to save ctrl s and close this great all right so this is the login page now now instead of inserting into users this is the part that becomes a bit different and so what we will get from our user is not the url address we don't care about that we don't care about the date we don't care about the username all we want is the email and password right so let's come here and see that we completely remove things that are necessary dates url address and we want to match the email great the username is unnecessary so let's remove that as well that too and then password so we escape the password but you don't need to because you have prepared statements so actually let's remove that great so we just get the password as it is here it's good to want the person to enter valid email so i i would leave that there okay so there we go password email and then now the query itself so here we will ask the question we will tell it to find something in our database select all from users so where should it find it so let's give it away close we're going to say where the email is equal to full colon email yeah because that's what we put it there that's email and so email so we don't need to use that trick which we are using uh in previous times where you just check for the email and then you check for the password later because now we're using prepared statements so the risk of hackers getting into our system is minimum so we're going to say email and password is equal to full colon password and we're going to say limit one we just want one result like that great so that's how we do it where email is email password is password simple and straightforward and then this is the email and password which will be in that array which will give it here so statement execute so here after the connection after the execution here this is simply to check so we're going to call it check is equal to so just checking if this is true or false if a result was returned this will be true so at this point we will just put an if statement and say if check which we're asking if it's true or false so if it is true let's move everything over because everything now needs to be in there like so so if this is true then we manage to find a record so what we will do now is to get our data from that record i'm going to say data is equal to statement statement fetch oh there's no a on fetch so it's a fetch oh like so now depending on what you want to use this for you can put a uh constant in there like pdo uh pdo like that and we're going to say fetch obj so i like to use objects uh if you want to use arrays of of course you can do that fetch a sock like so that's for you who wants to use an array but i like to use objects so i'm going to say obj like that okay so now data is going to contain the data that we've returned great isn't it and then now we can check if data is an array still because it's going to retain an array of objects so we will say if is array data like so let's move this over once more so if that is an array then we can now assign um we can get the username or the url address of this user into the session so we're going to say session like that and then we're going to say url address whatever we want to say there whatever we want to call it there it's just a variable so we're going to say data now remember this is an array of objects so what i will do is to remove to tell it to just get the first item in the array so i'll say zero like that so i will say data is equal to the first item in data now if you want to retrieve all the results that came here you're going to create a loop from here so that instead of doing 0 you say 4 each data as uh maybe you can set it to raw or something and then you can use that here so in my case i'm going to say url address like so because that's the thing i want to get so the session equal to that now an important thing is that since we are using the session we need to activate this session by saying session start so without doing sessions that we can't have a session and the reason why we're using this session right here is because this is a global variable that is available on every page as long as that page is using the same browser that you're using then this session will be available so it's a good variable to use that way the user doesn't have to log in again on every page we can simply know they're already logged in so all we have to do is check for this and know that somebody's logged in okay great so now let's go to uh where is this auto load now if you remember auto load is always included at the top of each page so auto load is always there so let's go to auto load at the very top here we're going to say session start like so so if we don't have session start we cannot use the the session variable okay so once we are done with this we should have a session variable in our session okay great so to know that we're just going to come here and echo it out and say echo session url address like so also we can put the username excuse me username username okay so we have our username the username of the user in the session and their unique identifier which is good so here we can i think username is more friendly to see so let's echo the username so let me come back here and just refresh now this is the sign up page so if i sign up again please enter follow the email okay uh let's create a new uh a new user so i'm going to do that and i'm going to say boom and one two three four and let's go sign up unidentified index on line 43 so it doesn't know what this is because it doesn't exist because we haven't logged in yet okay so that's great so we know it's actually working however we have a slight problem here now if you notice here if i browse here i'm i'm signing up with the same email and then it's not telling me that there's another email existing like this so we can go to the sign up page here and then check for that so at this point once we reach this point here we have our email already set and everything so we can simply read from the database right here and then generate an error if that you that email already exists so we're going to say [Music] check if email exists so at this point we're just going to use exactly what we are using here so a query statement and execute just like that so i think we can do copy what's in the login that's much much better this should come with so let's copy all this up to here boom let's come to sign up and right here we're going to paste it okay so let's push it in just so we can see it so here we're going to select all from users where the email so we're just looking for the email not the password so where email is going to email so of course we're going to have to put this inside this array for the execution so i will come here and say her so it's a good idea to reset this before you use it so just say it's equal to false because you get into the habit of using this several times on one script you find that you forget that you already added some stuff to it and then you end up with more variables than you need here and then it's going to cause an error so it's just a good practice to do this first and then you can give it some stuff in there like email and then let me it's equal to email like this okay so now this is added there to check here okay so select from users connection query and then run the query so if everything went well we're going to get to this point and then if we do get to this point if this data is an array so this thing just tells you if the execution was successful it doesn't tell you whether there's a result or not so here we can check data is equal to that now if this data is an array but just to be sure we can also check if the array contains some data so we can say and count this is the number of items in this array count data is greater than zero like this so this is important as well so let me copy this and actually put it on here on the login as well just to be sure okay so sign up so if this is true then we know that somebody's already using this email so we generate an error so let me just copy this come here and paste this error there so we can just say someone [Music] someone is already using that email and that's it so let's give it a spin so let me go back to my sign up page and just try to sign up again someone is already using that email okay so great everything is good now the thing is we are not in case there is an error we are not retaining the values of our previous whatever we added here is removed so we can quickly solve that problem so to solve this issue let's go to our our input here and then put a value at the end here so this username email and password so the password we don't want to be retaining that so let's just do it on these two first the person should always retype their password so i'm just going to say value i'm going to add a value there and say something like let's use username here oh of course this is uh supposed to be php so since it's html i'm going to say php and actually there's an easier way to to do this just to put an equal sign there and then i will put my variable like username and then close those tags so by simply saying uh this php tag with an ecosign and that username i'm going to echo the username but here i need to echo email so username email now the first time we run this at this point if you sign up if you post something we are going to get username and email variables but if the person has not posted anything we won't get these guys so what we must do to avoid getting an error down there is right here where we're putting the error we can just say that and also use a name same thing there okay all righty then like so so we set them to empty strings and that sorts out the problem so let's try it again let me do this resend and then you see excuse me so you see those values are back here so if i at least you can see someone is already you already using that email i'll see okay it's this email then i can decide to change it okay great so that is done so now what i'm going to do is go to the table go to operations and i want to truncate the table let's delete everything in there so that i can start afresh okay right browse and we have an empty record set great so let me create my name there and put one two three four and sign up okay so now that i've signed up i'm taken to the login page which is awesome so here i have signed up great then now i can put my email in my password and now i've come to the homepage this is the home page now in order to be sure that uh i have actually logged in so let me go to the index page here uh what did i do here sorry to do that okay so here we have to find a way now to check if inside the session the thing that i'm looking for exists which is this one right here either url address there like this one okay so we want to check if that exists so to do that let's create a function to be doing that for us because we can type it here but we need to do this on every page that where you want the user to be signed up or to be logged in you have to do that check on every single page now it becomes a problem if you're typing the data repeated over and over again if you make a mistake on one page you have to change the mistakes on multiple pages so instead we will create a function and we're going to say user underscore data is equal to check login just like that so on every page where you want to make sure that the user is logged in just put this line there and it's going to check now of course we don't have this function so we must create it and that is easy peasy so let's go to functions here and create one more function so say function check login like that all right so this was a mistake here great so how do we check for uh if the user is logged in pretty simple we just check if the the session data uh exists so if is set session so let me just copy it from the login to avoid making mistakes so let me go back to functions there we go boom i think wrong there we go if you set then we know we are actually logged in so let me put a return oh actually instead of returning something we can just redirect the user if we get to this point that the person is not logged in so what i will do is say header location so we are relocating this person to the login page just like that and then put die at the end for a clean break but if we did find something we're going to return the data of the user because that's what we are getting there okay so we're going to return the use of the currently logged in person so to do that let's go to login here where we can we already did a read situation so let's start from there let me copy all this okay this one matches with that one so i'm going to copy all this up to there and so we can read from the database okay now the thing is uh that's inside a function right that is inside a function so we will need a way to get the connection from there wait a minute so this is inside the function so we will not have uh let me paste that there inside so we don't have the connection in here because this is inside a function or maybe we do have the connection wait a minute function check login if it's set okay so even though we do uh it's not a good idea to use global variables in functions to make them more portable so that in case somebody asks me for this function i want a function that checks if i'm logged in i can simply copy this and give the person without worrying about missing variables so let's put connection right there and then what we will do when we go to the index page we will put connection here so we can use this to send it over there okay so you put this on every page you want to the user to be logged in to make sure the user is logged in so let's go back to functions here and let's see what we're actually doing here so the first thing we're doing is we're getting the url address so let me copy this and i'm going to put it here and then i'll copy the name and put it there and remove the email because all we have right now is the url address so once this is equal to whatever is in there and now here we're just going to check for url address instead of email so say url address okay we don't need to check for the password just to know if the user is the one so just add url addresses go to url address so if we reach this point then the person is actually logged in so we can remove all this here except for the data part here and at this point we're just going to say return like so return the first entry great okay so that's good there now if you were using uh if you are fetching a sock here which is an array you would actually would still do this exactly the same the only difference comes in when reading the data like for example at the login here instead of using the arrow you would use the thing like this that's how you deal with arrays okay but i'm using objects so it's like this so now at the heading there at the index page i can actually put something here let's say um let me put a div just to separate it and say hi and then php tags equals and then i can say uh session use a name okay so that's echoing what's inside the session so let me refresh and you see hi i've recorded i've logged in as that person right so let's make a login page so that out page sorry so that we know that we can actually log out and not be allowed if we are logged in so in public new file save this as logout dot php great now to log out is very simple because as you can see in functions we are only checking to see if this actually is set that's it once we check if this is set we can we try to find the user if we find the user in the database then we are good to go so now in the logout all we have to do is check is it set and then unset it so the reason we are checking if it's set is because if you try to unset something that isn't set you get an error so say on set boom that's it so i can unset both so it's better to check one at a time because remember we used username is there as well so that's it this is the logout page so let's go on index page and create [Music] what is this here i can actually make a div here and say this is the header id that's usually better when [Music] you can just include the header page like so okay so at the end we can have this one um let me put a style here and just say float right and then i want this to just be logout okay and then i want to this is like this i want to put an a tag a link to the logout page and that's it logout.php oops it's outside so bam there we go so let's refresh that and you see the logout page is there so if i actually log out oh wait a minute log out here after we log out let it take you to the you can choose which page you want to take the user here so i'll just tell them to go to the index.php page which they will later be redirected back to the login page so refresh hi logout oops what's going on oh it's bringing me back here okay so the reason it's not working here that's because we forgot one important thing and that is we have to require the auto load at the top here because the autoload contains the session file so without a start session you cannot access the session so it cannot be up it won't be set and it cannot be unset so let's go to the header and let me remove that copy that go to logout.php and add it here okay so that should work now so let's look out boom we're in the login page okay so let me try and access the index page here without logging in so index.php and you see i'm taken to the logout page very nice unless i log in one two three four and there we go now i am on the main page and it actually knows my name awesome so this is what you do you can make multiple pages just like this and just make sure that at the very top for every page that you want to be private only for logged in people you use this these two should be there at the top and then here the problem is if the let's say for example the index page is not restricted which means this session variable will be empty if we open the page because there are those pages which can be accessed by both those who are logged in and those who are not logged in so you must put an if statement to make sure that this doesn't happen so a way to do this is just to go up here and just say username is equal to empty all right and then you say if is set we can just copy from here great so if the session is set then we will assign a username to the session name that way username is always present regardless whether we are logged in or not like that so we have username there and then here we can come and instead of just saying hi uh what we could do is put an if statement okay so there's this these are so now i don't want this whole section to show if i'm not logged in so what i will do is just use some php tags and say php like this and i'm going to say if username because i know it's always there is not empty right then let me put a full colon there and close that so this is one way of doing it so let me put that to make sure it's a variable like this and then i'll copy this put it here and simply say end if so say and if like so i don't know whether i should put full color on or semicolon i'm not sure here i think it's semi-colon okay so if this will only show if this is true so let me try this by um [Music] let me remove this user data check login so it doesn't have to check for the login here so if i refresh nothing will change but let me log out then go to the home page so you see now this is the home page but the high section isn't showing as uh because we've put it inside an if statement over here so this is kind of like templating where you don't need you don't want to put this inside an echo statement but you can still use php like this together with html okay so this is great let's look at our list here so these vague error messages and then disable messages error messages there so the vague error messages i'm saying here is for example give the user as little information as possible right so you want to give the user as little information as possible so for example when you are logging in here uh instead of telling you to okay valid email is a valid thing now if the we're actually not telling the the person anything here so let me come here uh wait a minute so if something was posted this will move from here to there so if we do get to this point then it means our email was either our email was wrong or our password was wrong so let's put that inside an error message like this let me copy this so this is on login.php at the end here let's put an error so as long as we have something was posted but we were not redirected it means we will get here and so it means we have a wrong email or password so now instead of you figuring out which of the two is wrong either the email or the password and telling the user that's way too much information because a hacker could be there just testing out all kinds of emails just to make sure that at least one of them will have a hit because it's going to see that every email he tries it says wrong email wrong email and then finally he tries the correct one and then it's going to say wrong password so now he's going to know that at least i have a correct email now i just need to find the password so in a situation like this you're supposed to give as little information as possible so instead you just say wrong email or password this way the person doesn't know which of the two is wrong this is very uh this is what we call security through obscurity you you don't give out too much info so every time you're writing error messages just know that you don't have to be very specific as to the error that's happening if it's a security risk okay so this one takes out this vague error messages and then there's disable error messages so every time you when you're developing the website on your localhost it's very important to see error messages here but once you're online error messages are a problem because somebody could try and break your system just to see the error messages and then they can get information from there on how to hack your system so make sure that error reporting is disabled on all your when you are on the production when you're on the production side after the development is done when you're actually in um running online don't show error messages now to make sure that you just go to a file that you know will always be on uh on every page for example this auto load that has sessions that this we know will be on all the important pages so what we can do here is we can just say ini set underscore set like this so that we can set it explicitly here and say display underscore errors and then we put a comma and put it to zero now if you want errors to show where you're developing you put this at one like this then errors will show because that's important but if i put it at zero so let's test this out what i will do is just intentionally cause an error so let me go to the login page there's this logout let's go to the login page here okay great so right here i want to do something weird so login page uh what i will do for example i just move that d out of there so that that is not found and right there i'll say unidentified request method okay great so this is expected but if we go to the auto load here and i put it at zero i tell it don't show error messages then i can refresh and i won't see anything okay so this is one of the security features you need to think about so let me undo what i did here great all right so what's remaining now is these two so let's start with html escaping and then we can do the tokens right here so html escaping is very simple so if somebody is let's say i have logged in here right let me log in oh let me use my email one two three four okay so we are on the home page right here now as you can see i'm echoing out what's inside my database now it's very important to know that even data in your database is actually unsafe because it might have passed the litmus test when logging in but it doesn't mean it's safe because for example you might be asking your users to write their location like the address which is quite long and they might instead of writing an actual address they might put in some code instead so let me give you an example of that one right here so let's just add an extra column here i'll add one more column i'll call this one address oh let's just say location just to be more specific variable character i will put maybe 1 000 characters can go in here and hit save okay this is great now imagine if for some reason you didn't program your your inputs properly and so let's go here to the browse section and i want to put something in the location here so i will edit this raw oh actually i have to click here great so in location instead of adding my address i decided to add a javascript a script instead so i will say something like alert hacked right just to let you know that i hacked you uh script so the point here to remember is that somebody can craft in a script instead of writing the location just so they can hack into your system so it might not look like this it might be something more clever but this is the the basis of how things are done so let me save that so it can save quite fine inside here you see it escaped the characters on its own like that to make sure that it can load in that okay that's great but now this is a problem if we come here to our index page let's say somebody is logged in and so we now want to use the user data right there okay so we want to get the user data there and echo it here because we want to show maybe this is somebody's profile so let me put a break tag here so i'm going to say user data location like so i'm going to echo this out so i'm simply displaying the user's data here so but what happens is this watch oops something is weird here and that's because i don't have my php tags so i don't know how i forgot that so i'm going to use this shorthand instead like so great so echo that out and now what you see is instead of echoing uh the data there's this thing that comes here and says hacked now this can be very dangerous because this is running some javascript which can send information to the hacker's website on your own system it can also read from your database because now it's part of your system it can also show a banner that your users may click and go to a malicious website so much can be done with this kind of thing so you must try by all means to avoid being hacked this way so to avoid that is very very simple just by getting the variable and telling it to display as html entities so it's going to be like this h html entities or html special charts so i like using special charts i don't remember the actual difference here but i like using special charts so let me do this and that so now i've put this inside this html spatial charts so what i'm telling it is that what is in here is not executable code but html so the browser will do everything it can to escape all the characters that are in here to make sure that they don't run as html as as a script rather so as you can see now even though it's a script i've managed to echo it out without a problem so this is how you do html escaping so let's now go to this uh token thing cross side request forgery now this attack is not as i don't know if it's as common as it used to be but uh it still exists so what this means is that somebody with a different website can use your own website or a website you are on to get uh to send the wrong request so for example i can let's say you are browsing your webs uh your you're using your browser and you are logged in into one website so once you're logged in into a website let's say it's your bank so you're logged into your bank and once you log in as you have seen here what we are doing is we are simply creating a session variable when somebody logs in so the bank obviously has a more advanced system than this but it's pretty much this so all the important variables are stored in the session so every time you every time you access the bank website from your browser it will assume that it is you because you're already logged in now a problem comes in when you your bank tab is open and then you access a hacker's website for some reason somebody with malicious intent so once you're on that new website like here so this website what it could do is it could get it could create a form automatically using javascript and then send that form to your bank okay now that form could have uh could be the form that you use when you want to withdraw money to a specific account right and then it's going to fill in all the details in there that are required and because you're already logged in the bank is going to assume this is you that is actually sending this request using a legitimate uh form from the bank right so then it's going to withdraw all that money into the hacker's account and then you'll be surprised why your bank account is now empty so to avoid doing something like this is to create what we call a session token here which is that one so this is very simple it's just a random string for example here on the login so you use that random screen as a string on all the forms on your website every single form should have that field so to do that so you may be wondering how does that help well it helps because if for every uh form that i send i send also a random generated value just like that url address it means inside the session i'm going to put that same value and then i'll be waiting for a form which contains that very specific value now if for example a cross site hacker is trying to go into my bank since i haven't opened that um the form uh where i want to withdraw my money it means there's no talking inside my session at that time and even if there's a token there the hacker would not know what the token is so even if they send a form to the bank the bank is just going to ignore that form because it will know that there is no such because it's going to have either the wrong token or it's not going to have a token at all so this is how you stop uh that kind of thing so let's do this with an example so that you can see this so let me go to the login part here and at this point i'm just going to add an input field here which is hidden so this type is going to be hidden so it doesn't matter what this is uh so as long as it's hidden and then it's got a name so the name we're just going to call it token you can call it anything you want and then let's put a value here like so okay so we try to log in with the token so the easy way to do this is while you are here you generate a token so let's generate that token real quick we can copy this code from the url address session section there so let me go to the login page and i'm just going to say token is equal to like this and i will do that so token is equal to we're going to generate a random uh number here whatever this is so random number generated so once we generate that a we set it to the session so we're going to say session so that we can remember it session token is equal to token oh yeah actually this is fine here we could simply put this directly here to avoid going round and round so session token is equal to that so we every time we refresh this page we generate a new token which is good so now this token right here actually i should have let the token be at the top there so so we know there's always a token here in the session so i'll copy this and come down to my value over here and i'm going to echo it with my php like that using the shorthand form so session token there so let me come down here and let's log out and go to the login page then i'm going to inspect this element here and once i go to the form where is the form there we go so you will see that there's a hidden thing with a token and there is a token right there so you can give it a length of your choice so the token is there if i refresh the page you see that the token has changed okay great now the thing is since every time we are setting a new token all we need to do now at the very top here before we set a new token we have to make sure that the token is legit that we have so let me remove this just so i can put it down here instead so put it somewhere where it will always run right create a token every time and then what we will do now is go to the top here and copy that so if the server has posted something right great but then we can do something else and say and the session talking right now uh the token of the session is equal to whatever is in the token for the post at that time so like this boom and then we say token okay so if the token in the session is equal to the token that was posted then we continue we know that everything is fine otherwise we simply ignore it but then there are times when maybe we haven't set this token yet so it's always a good idea to check if it is set so we can just say here and is set paste that and then we put another and so if the session token is set and the session token is equal to that so if either it's set and it's equal to that then we pass through here otherwise we're going to ignore this so let me try this right now what i will do is uh remove this token for now so i'm going to comment this out html comment or simply just delete the whole thing right so not token right there so i'm just going to refresh the page here and then i'll try to log in so everything is normal my login is great but then i get this error unidentified index token on line six so this is because i didn't check if it is set okay so i should have checked if this is set right so what i will do is let me undo this part here so that i can keep it in memory so i can actually check for both here so no big deal so i'll just do this duplicate that so the question is it's a request it's a post request and the token session is set in session and also inside post just so we don't get these errors like so okay and then i come down here and remove the hidden field so now let's refresh and let me try again so correct credentials but then nothing happens so here we don't even show an error message because we know if somebody doesn't have a token then they're not worth giving an error message at all because they're trying something weird because normally they should have a token right so we just don't give them anything here but if now i reverse this and refresh the page let me refresh the page send that and then one two three four and now i am logged in so this is how you prevent uh cross site request forgery so you do this on all your forms to make sure that uh nobody will hack you or nobody will take advantage of your users when they are running your website all right so i hope so far you've learned uh something new about security from these folder structures all these things here sanitizing prepared statements uh be vague with your error messages uh so so create a proper folder structure do double validation make sure you are using whitelisting instead of blacklisting you don't have to use regular expressions but they are pretty cool and then you sanitize or escape your inputs for the db use prepared statements be very vague with your messages disable all error messages when you're in production or when you're online use tokens and escape your html you will be at least having basic security for your website all right so i will see you in a later tutorial when we learn something else see you then

Channel: Quick Programming

Views: 16,203

Keywords: Web Design Programming Tutorials, web development, quick programming, PHP, MYSQL, HTML, CSS, tutorials, Learn, quickprogrammingtv1, html, web development tutorial

Id: pIO0pmMTJ6Y

Length: 134min 0sec (8040 seconds)

Published: Wed Jan 06 2021