Encrypt passwords - encryption

I have a problem with a script. When recording a new user password is recorded normally. I tried to encrypt with MD5 or sha1, is properly encrypted in the database, but it is automatically changed the value of the password. For example:
If I register with the password "mypassword", in the database is encrypted properly. But if I log out, and then I connect again by entering the password "mypassword", does not recognize it more, but recognizes only one encrypted.
It is not normal do so. I try to paste some code.
<?php
session_start();
include '../_database/database.php';
if(isset($_REQUEST['signup_button'])){
$user_email = $_REQUEST['user_email'];
$user_firstname = $_REQUEST['user_firstname'];
$user_lastname = $_REQUEST['user_lastname'];
$user_username = $_REQUEST['user_username'];
$user_password = $_REQUEST['user_password'];
$sql="INSERT INTO user(user_firstname,user_lastname,user_email,user_username,user_password,user_joindate,user_avatar) VALUES('$user_firstname','$user_lastname','$user_email','$user_username', '$user_password',CURRENT_TIMESTAMP,'default.jpg')";
mysqli_query($database,$sql) or die(mysqli_error($database));
$_SESSION['user_username'] = $user_username;
header('Location: ../update-profile-after-registration.php?user_username='.$user_username);
}
?>
And,
<form class="form col-md-12 center-block" action="components/registration.php" method="post" autocomplete="off">
<div class="row">
<div class="col-lg-6" style="z-index: 9;">
<div class="form-group">
<input type="text" class="form-control input-lg" placeholder="First Name" name="user_firstname" required>
</div>
</div>
<div class="col-lg-6" style="z-index: 9;">
<div class="form-group">
<input type="text" class="form-control input-lg" placeholder="Last Name" name="user_lastname" required>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="form-group">
<input type="email" class="form-control input-lg" placeholder="Email Address" name="user_email" required>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">
<!-- http://<?php echo $rws['domain_websiteaddress'];?>/user_username= --> know.me/
</span>
<input type="username" class="form-control input-lg" placeholder="username" name="user_username" id="user_username" required>
<span class="input-group-addon" id="status"></span>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="form-group">
<input type="password" class="form-control input-lg" placeholder="pasword" name="user_password" required>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<button class="btn btn-primary ladda-button" data-style="zoom-in" type="submit" id="SubmitButton" value="Upload" style="float:left;" name="signup_button"/>Register</button>
</div>
</div>
</div>
</form>

The hash algorithms MD5 and SHA-* are not appropriate to hash passwords, because they are too fast and therefore can be brute-forced too easily. Instead one should use slow hash functions with a cost factor:
// Hash a new password for storing in the database.
// The function automatically generates a cryptographically safe salt.
$hashToStoreInDb = password_hash($password, PASSWORD_DEFAULT);
// Check if the hash of the entered login password, matches the stored hash.
// The salt and the cost factor will be extracted from $existingHashFromDb.
$isPasswordCorrect = password_verify($password, $existingHashFromDb);
This example shows how to use the PHP function password_hash() and password_verify(). They will produce a salted BCrypt hash.
EDIT:
Ok i will try to do the modifications in your example code. Note that i used prepared statements, because your example is prone to SQL-injection. The code is not tested.
<?php
session_start();
include '../_database/database.php';
if(isset($_REQUEST['signup_button']))
{
$user_email = $_REQUEST['user_email'];
$user_firstname = $_REQUEST['user_firstname'];
$user_lastname = $_REQUEST['user_lastname'];
$user_username = $_REQUEST['user_username'];
$user_password = $_REQUEST['user_password'];
$passwordHash = password_hash($user_password);
$sql = "INSERT INTO user(user_firstname,user_lastname,user_email,user_username,user_password,user_joindate,user_avatar) VALUES(?,?,?,?,?,CURRENT_TIMESTAMP,'default.jpg')";
$stmt = $database->prepare($sql);
$stmt->bind_param('sssss', $user_firstname, $user_lastname, $user_email, $user_username, $passwordHash);
$stmt->execute();
$_SESSION['user_username'] = $user_username;
header('Location: ../update-profile-after-registration.php?user_username='.$user_username, true, 303);
exit;
}
?>

Related

Functioning of Wordpress Contact form to Laravel Method

On my website there is a contact form on footer which is working fine.
Site Blog is on wordpress have same contact form.
I don't wan't to create working again for wordpress contact form
<form action="/yocreativ/contact-us" method="post">
<?php
//Generate a random string.
$token = openssl_random_pseudo_bytes(20);
//Convert the binary data into hexadecimal representation.
$token = bin2hex($token);
//Print it out for example purposes.
// echo $token;
?>
<input type="hidden" name="_token" value="<?php echo $token; ?>">
<div class="form-group col-lg-4 wow fadeInDown animated" data-wow-delay="0.2s">
<input type="text" name="name" class="form-control" id="name" placeholder="NAME" required="required">
</div>
<div class="form-group col-lg-4 wow fadeInDown animated" data-wow-delay="0.2s">
<input type="email" name="email" class="form-control" id="email" placeholder="EMAIL" required="required">
</div>
<div class="form-group col-lg-4 wow fadeInDown animated" data-wow-delay="0.2s">
<input type="tel" name="phone" class="form-control" id="subject" placeholder="PHONE" pattern="^\d{3}\d{3}\d{4}$" required="required">
</div>
<div class="form-group col-lg-12 wow fadeInDown animated" data-wow-delay="0.2s">
<textarea name="message" id="message" cols="30" rows="5" placeholder="MESSAGE" required="required"></textarea>
</div>
<div class="row">
<div class="col-lg-12">
<button type="submit" class="btn contact-submit">SEND</button>
</div>
</div>
</form>
Form action="/yocreativ/contact-us" which is the route of my laravel app.
When i submit the form it says.
The page has expired due to inactivity.
Please refresh and try again.
For WordPress wp_nonce_field and wp_verify_nonce field to verify.
https://codex.wordpress.org/Function_Reference/wp_nonce_field
Form field like:
<form method="post">
<?php wp_nonce_field('name_of_my_action','name_of_nonce_field'); ?>
</form>
In action file
<?php
if ( empty($_POST) || !wp_verify_nonce($_POST['name_of_nonce_field'],'name_of_my_action') )
{
print 'Sorry, your nonce did not verify.';
exit;
}
else
{
// process form data
}

Bootstrap 4 d-print classes for form

I've created a form that I give the user the option to submit online or print and mail. I use a simple javascript print command and turn off all other elements for printing besides the form using the .d-print-none class. It's probably really simple problem, but when I print it it doesn't output the entire form. It fills one page and then a second blank page. Wondering if it would help to add one of the other d-print classes to the form element or maybe there's a way to the height of the form to fit one page. Is this a bug or am I missing something?
There's not much special about the code, but I've displayed the form below.
<div class="col-lg-7 col-sm-12 d-print-inline-flex h-100 w-100" id="donationForm">
<div class="card">
<div class="card-header"><h4 class="text-center">Donation Request Form</h4>
</div>
<div class="card-body">
<form name="donationRequest" id="donationRequest" novalidate>
<h5>Event Information</h5>
<div class="form-group">
<label for="orgName">Name of Organization: </label>
<input type="text" class="form-control" id="orgName" required placeholder="Name of Organization">
</div>
<div class="form-group">
<label for="taxID">501(c)(3) Tax ID Number: </label>
<input type="number" class="form-control" id="taxID" required placeholder="Tax ID Number">
</div>
<div class="form-group">
<label for="eventName">Event Name: </label>
<input type="text" class="form-control" id="eventName" required placeholder="Event Name">
</div>
<div class="form-group">
<label for="eventDate">Date of Event: </label>
<input type="date" class="form-control" id="eventDate" required placeholder="Event Date">
</div>
<div class="form-group">
<label for="eventLoc">Event Location: </label>
<input type="text" class="form-control" id="eventLoc" required placeholder="Event Location">
</div>
<hr>
<h5>Contact Information</h5>
<div class="form-group">
<label for="contact">Contact Name: </label>
<input type="text" class="form-control" id="contact" required placeholder="First & Last Name of Contact Person">
</div>
<div class="form-group">
<label for="address">Address: </label>
<input type="text" class="form-control" id="address" required placeholder="Address of Organization">
</div>
<div class="form-group">
<label for="city">City: </label>
<input type="text" class="form-control" id="City" required placeholder="City of Organization">
</div>
<div class="form-group">
<label for="state">State: </label>
<input type="text" class="form-control" id="State" required placeholder="State of Organization">
</div>
<div class="form-group">
<label for="zipcode">Zip Code: </label>
<input type="number" class="form-control" id="zipcode" required placeholder="Zip Code of Organization">
</div>
<div class="form-group">
<label for="phone">Phone: </label>
<input type="number" class="form-control" id="phone" required placeholder="123-456-7890">
</div>
<div class="form-group">
<label for="email">Email: </label>
<input type="email" class="form-control" id="email" required placeholder="email#provider.com">
</div>
<hr>
<h5>Type of Donation Request:</h5>
<div class="form-group">
<label class="form-check-inline"><input type="checkbox" value=""> Financial Contribution</label>
<label class="form-check-inline"><input type="checkbox" value=""> Auction/Drawing Item</label>
<label class="form-check-inline"><input type="checkbox" value=""> Other</label>
</div>
<div class="form-group">
<label for="description">Please briefly note how this event will benefit our community:</label>
<textarea class="form-control" rows="7" id="comment"></textarea>
</div>
<hr>
<div class="form-group">
<div class="row">
<div class="col-md-6"><button type="submit" class="btn btn-primary btn-block"><em class="fa fa-send"></em> Submit Request</button></div>
<div class="col-md-6"><button class="btn btn-primary btn-block"><em class="fa fa-print"></em> Print Form</button></div>
</div>
</div>
</form>
</div>
</div>
</div>
I was dealing with this issue a week ago, and I solve it using this:
<div id="printbody" class="d-none d-print-block"> /*load elements to print via js*/ </div>
<div class="d-block d-print-none"> /*all my html body with funtionalities*/ </div>
I use the event onbeforeprint to load the print element to Mozilla, Chrome, Safari, EI, Edge. Using something like this:
window.onbeforeprint = function () {
$("#printbody").html("")
$("#printbody").append($("#list1").html())
$("#printbody").append($("#msg1").html())
$("#printbody").append($("#things").html())
$("#printbody").append($("#foo").html())
$("#printbody").append($("#faa").html())
if (/MSIE 10/i.test(navigator.userAgent) || /MSIE 9/i.test(navigator.userAgent) || /rv:11.0/i.test(navigator.userAgent)) {
$("#printbody").append($("#flag").html())
$("#printbody").append('<div class="row w-100 overflow-hidden">'+$("#boo").html()+'</div>')
$("#printbody").append('<div class="col-12 col-sm-10 offset-sm-1 col-xl-4 offset-xl-4 pt-3 px-0">' + $("#vudlist").html() + '</div>')
$("#printbody").append('<div class="col-12 text-center mb-3" >'+$("#tmvus").html()+ '</div>')
$("#printbody").append($("#tmksla").html())
} else {
$("#printbody").append($("#foos").html())
}
$("#printbody").append('<div>' + $("#objs").html() + '</div>')
$("#printbody").append($("#lmsg").html())
}
Actually iOS doesn't trigger the event onbeforeprint so I did the same handle but using the event onclick="fillPrint()". Seen like this:
function fillPrint() {
$("#printbody").html("")
$("#printbody").append($("#list1").html())
$("#printbody").append($("#msg1").html())
$("#printbody").append($("#things").html())
$("#printbody").append($("#foo").html())
$("#printbody").append($("#faa").html())
if (/MSIE 10/i.test(navigator.userAgent) || /MSIE 9/i.test(navigator.userAgent) || /rv:11.0/i.test(navigator.userAgent)) {
$("#printbody").append($("#flag").html())
$("#printbody").append('<div class="row w-100 overflow-hidden">'+$("#boo").html()+'</div>')
$("#printbody").append('<div class="col-12 col-sm-10 offset-sm-1 col-xl-4 offset-xl-4 pt-3 px-0">' + $("#vudlist").html() + '</div>')
$("#printbody").append('<div class="col-12 text-center mb-3" >'+$("#tmvus").html()+ '</div>')
$("#printbody").append($("#tmksla").html())
} else {
$("#printbody").append($("#foos").html())
}
$("#printbody").append('<div>' + $("#objs").html() + '</div>')
$("#printbody").append($("#lmsg").html())
}
The issue generate when you try to print a large element with multiple sections (div) because of that I decided to bring it a higher level of element on the DOM.
I hope this can help someone.

How can I debug twitter bootstrap v4-alpha grid? col-sm-offset-* not working

I've changed something, somewhere and now col-sm-offset-*s aren't working at all. For example, if I wanted to split the screen in half, and display content only on the right hand side, I would usually use:
<div class="container">
<div class="row">
<div class="col-sm-6 col-sm-offset-6">
This content isn't on the right hand side, it's on the left as if the col-sm-offset-6 isn't even there.
</div>
</div>
</div>
How can I check what's wrong?
I'm using NPM and Laravel Elixir (gulp) to minify (make production ready) the files and short of me copying the entire CSS file here, I don't know what else to do. Is there anything obvious? Has anyone come across this before?
Update
<div class="container">
<div class="row">
<div class="col-sm-6 col-sm-offset-6">
<div class="row">
<form role="form" method="POST" action="/register">
<input type="hidden" name="_token" value="abcdefghij">
<div class="col-xs-12">
<fieldset class="form-group">
<label for="username" class="form-control-label">Username</label>
<input name="username" type="text" class="form-control " id="username" placeholder="Enter a username" value="j">
</fieldset>
</div>
<div class="col-sm-6">
<fieldset class="form-group">
<label for="first_name" class="form-control-label">First Name</label>
<input name="first_name" type="text" class="form-control " id="first_name" placeholder="Enter your first name" value="John">
</fieldset>
</div>
<div class="col-sm-6">
<fieldset class="form-group">
<label for="last_name" class="form-control-label">Last Name</label>
<input name="last_name" type="text" class="form-control " id="last_name" placeholder="Enter your last name" value="Appleseed">
</fieldset>
</div>
<div class="col-sm-6">
<fieldset class="form-group">
<label for="email" class="form-control-label">Email Address</label>
<input name="email" type="email" class="form-control " id="email" placeholder="Enter your email address" value="j#a.com">
</fieldset>
</div>
<div class="col-sm-6">
<fieldset class="form-group">
<label for="password" class="form-control-label">Password</label>
<input name="password" type="password" class="form-control " id="password" placeholder="Enter a password" value="password">
</fieldset>
</div>
<div class="col-sm-6">
<fieldset class="form-group">
<label for="password_confirmation" class="form-control-label">Confirm Password</label>
<input name="password_confirmation" type="password" class="form-control " id="password_confirmation" placeholder="Please confirm your password" value="password">
</fieldset>
</div>
<div class="col-sm-6">
<div class="form-group">
<button type="submit" class="btn btn-primary pull-right">Register</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
Web Inspector
CSS Computed Properties
Update 2
I've submitted an issue on GitHub as this may have been intentional.
The current correct offset class for Bootstrap v4 Alpha:
class="col-md-6 offset-md-3"
GitHub have officially changed their col-bp-offset-* names although the documentation is currently outdated.
See issues: #19099, #19368, #19267, and my own #19562.
I'll close the question and update my GitHub issue too.

ASP MVC Bootstrap-project - activate email-button

I've just implemented a bootstrap-theme in an empty ASP MVC-project. In the bootstrap there is an email-form. I want to activate the "send"-button and make it send an e-mail to me. I've seen different kind of sollutions when I've read about it:
Just use:
<a href="mailto:EMAILADDRESS">
or
form method="post" action="mailto:youremail#youremail.com" >
<input type="submit" value="Send Email" />
</form>
Or the more complicated way, to use jQuery and write things in both the model and controller.
So my question is: Why should I use the (to me) more complicated way?
Here is the code that came with the bootstrap:
<!-- Contact Section -->
#*<section id="contact">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2>Contact Me</h2>
<hr class="star-primary">
</div>
</div>
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<!-- To configure the contact form email address, go to mail/contact_me.php and update the email address in the PHP file on line 19. -->
<!-- The form should work on most web servers, but if the form is not working you may need to configure your web server differently. -->
<form name="sentMessage" id="contactForm" novalidate>
<div class="row control-group">
<div class="form-group col-xs-12 floating-label-form-group controls">
<label>Name</label>
<input type="text" class="form-control" placeholder="Name" id="name" required data-validation-required-message="Please enter your name.">
<p class="help-block text-danger"></p>
</div>
</div>
<div class="row control-group">
<div class="form-group col-xs-12 floating-label-form-group controls">
<label>Email Address</label>
<input type="email" class="form-control" placeholder="Email Address" id="email" required data-validation-required-message="Please enter your email address.">
<p class="help-block text-danger"></p>
</div>
</div>
<div class="row control-group">
<div class="form-group col-xs-12 floating-label-form-group controls">
<label>Phone Number</label>
<input type="tel" class="form-control" placeholder="Phone Number" id="phone" required data-validation-required-message="Please enter your phone number.">
<p class="help-block text-danger"></p>
</div>
</div>
<div class="row control-group">
<div class="form-group col-xs-12 floating-label-form-group controls">
<label>Message</label>
<textarea rows="5" class="form-control" placeholder="Message" id="message" required data-validation-required-message="Please enter a message."></textarea>
<p class="help-block text-danger"></p>
</div>
</div>
<br>
<div id="success"></div>
<div class="row">
<div class="form-group col-xs-12">
<button type="submit" class="btn btn-success btn-lg">Send</button>
</div>
</div>
</form>
</div>
</div>
</div>
</section>*#
<!-- Footer -->
Assuming you plan to add more to your email-sending app in the future, you should prefer the seemingly complicated way because in the long run, it will actually make things simpler. This complicated way is based on a concept called 'Separation of Concerns'.
In short, breaking your code into a model and controller is more complicated if you only want a button that sends you an email. But as your program grows in complexity and you add more to it, this technique will make it easier to reuse or update particular aspects of your program.

Bootstrap text-danger with form-inline not aligned

I have a simple form with error handling through jqBootstrapValidation. I set it up so that it is horizontal when the browser is wide enough. Here is how it looks: http://i.imgur.com/K0JKzb8.png
However, when I enter a bad email, the form is not aligned anymore.
http://i.imgur.com/4Fr2UTq.png
Here is the code I am using. I just can't get it to work.
<form class="form-inline">
<div class="form-group form-group-lg">
<div class="col-lg-6 text-center">
<label class="sr-only" for="name">Full Name</label>
<input class="form-control" type="text" id="formGroupInputLarge" placeholder="Full name" name="name" required data-validation-required-message="Please enter your full name." >
<p class="help-block text-danger"></p>
</div>
</div>
<div class="form-group form-group-lg">
<div class="col-lg-6 text-center">
<label class="sr-only" for="name">Your email</label>
<input type="email" class="form-control" type="text" id="formGroupInputLarge" placeholder="Your email" name="email" required data-validation-required-message="Please enter your email." data-validation-email-message="email not valid">
<p class="help-block text-danger"></p>
</div>
</div>
<div class="col-lg-12 text-center">
<div id="success"></div>
<button type="submit" id="submit" class="btn btn-success btn-lg">Submit</button>
</div>
</form>
Any tips?
Thanks a lot!
The issue is that the error message is appearing int he same column and pushing the textbox up. I believe you would either have to add it to another column or row below the content.
I don't know if this would help you but when I do bootstrap validation I add the tooltip attributes and the has error class to the div.
<div class="form-group has-error">
<input id="txtEmail" type="text" class="form-control" data-toggle="tooltip" data-placement="right" title="Email is not valid.">
</div>
This highlights the textbox red and the error message is displayed on hover so it saves space.
The way your HTML is set up is incorrect. You need to have the <div class="col-lg-6"> end and begin next to each other. The way you have it set up now is the form-group is on the outside with the table-cells inside. Also you should have the <div class="row"> so the table knows when a new row has been added.
<form class="form-inline">
<div class="row">
<div class="col-lg-6 text-center">
<div class="form-group form-group-lg">
<label class="sr-only" for="name">Full Name</label>
<input class="form-control" type="text" id="formGroupInputLarge" placeholder="Full name" name="name" required data-validation-required-message="Please enter your full name.">
<p class="help-block text-danger"></p>
</div>
</div>
<div class="col-lg-6 text-center">
<div class="form-group form-group-lg">
<label class="sr-only" for="name">Your email</label>
<input type="email" class="form-control" type="text" id="formGroupInputLarge" placeholder="Your email" name="email" required data-validation-required-message="Please enter your email." data-validation-email-message="email not valid">
<p class="help-block text-danger"></p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12 text-center">
<div id="success"></div>
<button type="submit" id="submit" class="btn btn-success btn-lg">Submit</button>
</div>
</div>
</form>
Try this set up and see if your code alignment messes up or not.
With the various answers I got. I managed to get it working. Here is the final code.
<form>
<div class="row">
<div class="col-sm-6 text-center">
<div class="form-group form-group-lg">
<label class="sr-only" for="name">Full Name</label>
<input class="form-control" type="text" id="formGroupInputLarge" placeholder="Full name" name="name" required data-validation-required-message="Please enter your full name.">
<div class="help-block text-danger"></div>
</div>
</div>
<div class="col-sm-6 text-center">
<div class="form-group form-group-lg">
<label class="sr-only" for="name">Your email</label>
<input type="email" class="form-control" type="text" id="formGroupInputLarge" placeholder="Your email" name="email" required data-validation-required-message="Please enter your email." data-validation-email-message="Email is not valid">
<div class="help-block text-danger"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12 text-center">
<input type="hidden" name="location" value="toronto">
<div id="success"></div>
<button type="submit" id="submit" class="btn btn-success btn-lg">Submit</button>
</div>
</div></form>
Feel free to comment if you see a problem with my answer!

Resources