-1
ログイン用の「ユーザー名」と「パスワード」フィールドを持つ現在のPHPフォームにmy captchaを統合したいと思います。しかし、私はユーザーがそれぞれのアカウントにログインする前にcaptchaを確認したいと思います。以下はcaptchaをPHPの作業フォームと統合し、ボタン1つで提出する
(私はこのような場合のために一緒にPHPやHTMLコードを入れて)私のログインページのための私のコードです:
<!DOCTYPE html>
<html>
<!-- Popup box to show error message -->
\t <script>
\t function ConfirmError()
\t {
\t var username = document.getElementsByName('usern')[0].value;
\t var password = document.getElementsByName('pass')[0].value;
\t
\t //window.alert(username);//Debugger Message
\t if(username == "" && password == ""){
\t \t window.alert("Both fields are required.");
\t }
\t else if(username == "" || password == ""){
window.alert("Both fields are required.");
\t };
\t }
\t </script>
<head>
<?php
include_once 'db.php'; //Establishing connection with our database
include_once 'https.php';
include_once 'secure_session_start.php';
include_once 'timeout.php';
//Declare variables
secure_session_start(); //Start session
$error = ""; //Variable for storing our errors.
$loginsuc = "False";
if(isset($_POST["login"]))
{
\t
\t if(empty($_POST["usern"]) && empty($_POST["pass"]) && empty($_POST["g-recaptcha-response"]))
\t {
\t \t echo "Please check the the captcha form!";
\t }
\t
\t if (!empty($_POST["usern"]) && (!empty($_POST["pass"])) && (!empty($_POST["g-recaptcha-response"])))
\t {
\t \t
\t \t //Start of Recaptcha
\t \t require_once 'recaptchalib.php';
\t \t \t
\t \t $captcha = $_POST['g-recaptcha-response'];
\t \t $secret = "";
\t \t $response = null;
\t \t $reCaptcha = new ReCaptcha($secret);
\t \t \t
\t \t //Define $username and $password
\t \t $username=$_POST['usern'];//Setting variable
\t \t $password=$_POST['pass'];//Setting variable
\t \t $reCaptchaValidation = $_POST['reCaptcha'];
\t \t
\t \t $response = $reCaptcha->verifyResponse($_SERVER["REMOTE_ADDR"],$_POST["g-recaptcha-response"]);
\t \t
\t \t $username = mysqli_real_escape_string($con, $username);//Encryption
\t \t $password = md5(mysqli_real_escape_string($con, $password));//Encrpytion
\t \t
\t \t //echo "Encrypted password: " . $password . "<br>";//Debugger Message
\t \t //Check username and password from database
\t \t //$sql=$con->prepare("SELECT * FROM user WHERE username='$username' and password='$password'");//Security
\t \t //$sql->execute();
\t \t //$sql->bind_result($uid, $first_name, $last_name, $email, $username, $contact_num, $password);
\t \t
\t \t $user = $con->query("SELECT * FROM user WHERE username='$username' and password='$password'") or die();
\t \t $auser = $user->num_rows;//Checking rows in database
\t \t if($auser == 1)
\t \t {
\t \t \t //echo "Auser results: " . $auser;//Debugger Message
\t \t \t //echo "Successful authentication";//Debugger Message
\t \t \t $_SESSION['usern'] = $username;
\t \t \t //header('Location: https://localhost/fwrule/fw/uloginpg.php');
\t \t \t $loginsuc = "True";//Changing loginsuc from false to true to trigger if statement later on
\t \t }
\t \t else
\t \t {
\t \t \t //$error .="Wrong username or password";//Debugger Message
\t \t \t //echo $error;//Debugger Message
\t \t \t ?>
\t \t \t <html>
\t \t \t \t <script>
\t \t \t \t \t window.alert("Wrong Username or Password.");
\t \t \t \t </script>
\t \t \t </html>
\t \t \t <?php
\t \t }
\t }
}
if($loginsuc == "True"){
\t header('Location: https://localhost/fwrule/fw/uloginpg.php');//Login Success -> Direct to user login page
\t exit(); //exit() is used so that code below it does not get executed.
}
?>
<!-- Webpage information -->
<title>Firewall Rule Review System</title>
\t <meta name="author" content="your name" />
\t <meta name="description" content="" /> \t
\t <link rel="stylesheet" href="indexstyle.css" type="text/css" />
\t
<style>
/* Login Form Format */
html, body {
width: 100%;
height: 100%;
font-family: "Helvetica Neue", Helvetica, sans-serif;
color: #444;
-webkit-font-smoothing: antialiased;
background: #f0f0f0;
position: fixed;
overflow: hidden;
margin: 0;
}
#container {
position: fixed;
width: 271px;
height: 215px;
top: 50%;
left: 53%;
margin-top: -140px;
margin-left: -170px;
\t background: #1781F1;
border-radius: 3px;
border: 1px solid #ccc;
box-shadow: 0 1px 2px rgba(0, 0, 0, .1); \t
}
form {
margin: 0 auto;
margin-top: 20px;
}
label {
color: #000000;
display: inline-block;
margin-left: 18px;
padding-top: 10px;
font-size: 14px;
}
p a {
font-size: 11px;
color: #aaa;
float: right;
margin-top: -13px;
margin-right: 20px;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition: all .4s ease;
}
p a:hover {
color: #555;
}
input {
font-family: "Helvetica Neue", Helvetica, sans-serif;
font-size: 12px;
outline: none;
}
input[type=text],
input[type=password] {
color: #777;
padding-left: 10px;
margin: 10px;
margin-top: 12px;
margin-left: 18px;
width: 220px;
height: 35px;
\t border: 1px solid #c7d0d2;
border-radius: 2px;
box-shadow: inset 0 1.5px 3px rgba(190, 190, 190, .4), 0 0 0 5px #f5f7f8;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition: all .4s ease;
\t }
input[type=text]:hover,
input[type=password]:hover {
border: 1px solid #b6bfc0;
box-shadow: inset 0 1.5px 3px rgba(190, 190, 190, .7), 0 0 0 5px #f5f7f8;
}
input[type=text]:focus,
input[type=password]:focus {
border: 1px solid #a8c9e4;
box-shadow: inset 0 1.5px 3px rgba(190, 190, 190, .4), 0 0 0 5px #e6f2f9;
}
#lower {
background: #087DFA;
width: 100%;
height: 50px;
margin-top: 10px;
\t box-shadow: inset 0 1px 1px #fff;
border-top: 1px solid #ccc;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
border-bottom: 1px solid #ccc;
}
input[type=submit] {
width: 100px;
height: 30px;
margin-left: 80px;
margin-top: 10px;
font-size: 14px;
font-weight: bold;
color: #000000;
background-color: #797672; /*IE fallback*/
background-image: -webkit-gradient(linear, left top, left bottom, from(#C7C6CF), to(#C7C6CF));
background-image: -moz-linear-gradient(top left 90deg, #C7C6CF 0%, #C7C6CF 100%);
background-image: linear-gradient(top left 90deg, #C7C6CF 0%, #C7C6CF 100%);
border-radius: 30px;
border: 1px solid #797672;
box-shadow: 0 1px 2px rgba(0, 0, 0, .3), inset 0 1px 0 rgba(255, 255, 255, .5);
cursor: pointer;
}
input[type=submit]:hover {
background-image: -webkit-gradient(linear, left top, left bottom, from(#C7C6CF), to(#C7C6CF));
background-image: -moz-linear-gradient(top left 90deg, #C7C6CF 0%, #C7C6CF 100%);
background-image: linear-gradient(top left 90deg, #C7C6CF 0%, #C7C6CF 100%);
}
input[type=submit]:active {
background-image: -webkit-gradient(linear, left top, left bottom, from(#797672), to(#797672));
background-image: -moz-linear-gradient(top left 90deg, #797672 0%, #797672 100%);
background-image: linear-gradient(top left 90deg, #797672 0%, #797672 100%);
}
.footer {
position: absolute;
right: 0;
bottom: 0;
left: 0;
padding: 0rem;
background-color: #efefef;
text-align: center;
}
</style>
</head>
<body>
<!-- Webpage Content-->
\t <div id="page">
\t \t <div id="logo">
\t \t \t <h1><a href="#"><b>Firewall Rule Review System</b></a></h1>
\t \t </div>
\t \t <div id="nav">
\t \t \t <ul>
\t \t \t \t <li class="green"><a href="about.php"><b>About</b></a></li>
\t \t \t \t <li class="orange"><a href="contact.php"><b>Contact</b></a></li>
\t \t \t \t <li class="red"><a href="resetpw.php"><b>Reset password</b></a></li>
\t \t \t </ul> \t
\t \t </div>
\t </div>
\t <div id="container">
\t <script src='https://www.google.com/recaptcha/api.js'></script>
<form method="post" action="">
<label for="username"><b>Username:</b></label>
<input type="text" id="username" name="usern">
<label for="password"><b>Password:</b></label>
<input type="password" id="password" name="pass">
<div id="lower">
<input type="submit" onclick="ConfirmError()" value="Login" name="login">
</div><!--/ lower-->
<div class="g-recaptcha" data-theme="light" data-sitekey="" style="transform:scale(0.88);-webkit-transform:scale(0.90);transform-origin:0 0;-webkit-transform-origin:0 0;"></div>
</form>
</div><!--/ container-->
<!-- End Page Content -->
<div class="footer">
\t <p>
\t \t ©2017 ABC Asia Pte Ltd
\t </p>
\t </div>
</body>
</html>
私は散らかっコードについて謝罪し、私のreCAPTCHAのが符号化されていません正しい道、私は信じています。
:以下のコードがあなたにヘッドアップを与える必要があります
。コードの先頭に4つのインクルードがあり、正しいコードが含まれていると見なすことができます。また、これをテストする際には、新しいページのすべてをコピーし、不要なコード(スタイリング、javascriptなどは必要ありません)をすべて削除し、コードをテストしてみてください。あなたはそれが好きです。 –
こんにちは、私は実際にこのページにPHPとHTMLの両方のコードを組み合わせています。この特定のページのHTMLファイルを実際に呼び出すと、ログインに影響します。これが明確になることを願っています。 –
**パスワードを暗号化しない**、攻撃者がDBを取得したときにも暗号化キーを取得します。代わりに、約100msの間、ランダムな塩でHMACを繰り返し、塩をハッシュで保存します。 'password_hash' /' password_verify'、 'PBKDF2'(別名' Rfc2898DeriveBytes')、 'Bcrypt'などの関数を使用してください。要点は、攻撃者が無差別にパスワードを見つけるのに多くの時間を費やすことです。 – zaph