javascript - 通过AJAX从$_SESSION发送变量到PHP进行密码更改，怎么做？

标签 javascript php mysql session-variables user-variables

我在我的网络应用程序中为已登录的用户创建了一个更改密码的选项(因此这不是“忘记密码”选项)。我有一个 HTML 表单，然后是用于表单验证的外部 JS 文件，如果输入的数据通过验证，则通过 AJAX 将输入的值发送到 PHP 脚本中，然后 PHP 脚本也验证数据，如果一切正常，则更新数据库中的密码。我现在遇到的问题是如何将用户 ID 从 $_SESSION 变量传递到 PHP 脚本，该脚本通过用户 ID 在用户数据库中找到行并更改密码。我在互联网上搜索，但没有找到解决我的问题的好答案。我试图避免 <input type="hidden" value="<?php echo $_SESSION["userid"]?>">方法，因为它缺乏安全性。

这是我的脚本:

HTML

<?php 
    include_once "./includes/header.php";
?>

<!-- MAIN PAGE CONTENT -->

    <main>
        <div class="main-content">
            <div class="page-title">
                <h1>Change password</h1>
            </div>
            <div class="page-content">
                <div class="page-subcontent-wrapper">
                    <div class="page-subcontent-section">
                        <form id="js-change-password-form" class="change-user-password-wrapper" method="POST" action="" autocomplete="off" accept-charset="UTF-8" novalidate>
                            <div class="change-user-password">
                                <div class="change-user-password-element">
                                    <label for="js-change-password-input">New password:</label>
                                    <div id="js-change-password-display" class="password-display hide-password"></div>
                                </div>
                                <div class="change-password-input-wrapper">
                                    <input id="js-change-password-input" type="password">
                                    <div id="js-change-password-message" class="validation-message-div"></div>
                                </div>
                            </div>
                            <div class="change-user-password">
                                <div class="change-user-password-element">
                                    <label for="js-change-password-confirm-input">Confirm password:</label>
                                    <div id="js-change-password-confirm-display" class="password-display hide-password"></div>
                                </div>
                                <div class="change-password-input-wrapper">
                                    <input id="js-change-password-confirm-input" type="password">
                                    <div id="js-change-password-confirm-message" class="validation-message-div"></div>
                                </div>
                            </div>
                            <div class="change-user-password-button">
                                <button id="js-change-password-button" type="submit">Submit</button>
                            </div>
                        </form>
                        <div class="change-user-password">
                            <div class="change-user-password-message-success">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script src="./js/change_password.js">
        </script>
    </main>

<?php 
    include_once "./includes/footer.php";
?>

注意:header.php 有 session_start();在其顶部。

Javascript/JQuery

$(document).ready(function(){

    // Password validators

    $("#js-change-password-form").submit(function(e){

        var changePasswordValue = $("#js-change-password-input").val();
        var changePasswordValueLength = changePasswordValue.length;
        var changePasswordConfirmValue = $("#js-change-password-confirm-input").val();
        var userId = $("#js-user-id-input").val();

        e.preventDefault();
        if (changePasswordValueLength < 8) {
            var errorMessage = "<div class='error-message error-pointer'><p>Password should have at least 8 characters.</p></div>";
            $("#js-change-password-message").html(errorMessage);
            $(".validation-message-div").css("display", "flex");
            $("#js-change-password-input").css("border-color", "rgb(190,115,110)");
        } else {
            var errorMessage = "<div class='success-message'><p>Looking good!</p></div>";
            $("#js-change-password-message").html(errorMessage);
            $(".validation-message-div").css("display", "flex");
            $("#js-change-password-input").css("border-color", "rgb(95,160,95)");
            noErrorChangePassword = true;
        }

        if (changePasswordValueLength < 8) {
            $("#js-change-password-confirm-message").css("display", "none");
            $("#js-change-password-confirm-message").empty();
            $("#js-change-password-confirm-input").css("border-color", "rgb(225,225,225)");
        } else {
            if (changePasswordConfirmValue != changePasswordValue) {
                var errorMessage = "<div class='error-message error-pointer'><p>Password doesn't match.</p></div>";
                $("#js-change-password-confirm-message").html(errorMessage);
                $(".validation-message-div").css("display", "flex");
                $("#js-change-password-confirm-input").css("border-color", "rgb(190,115,110)");
            } else {
                var errorMessage = "<div class='success-message'><p>Password match.</p></div>";
                $("#js-change-password-confirm-message").html(errorMessage);
                $(".validation-message-div").css("display", "flex");
                $("#js-change-password-confirm-input").css("border-color", "rgb(95,160,95)");
                noErrorChangePasswordConfirm = true;
            }
        }

        if (noErrorChangePassword == true && noErrorChangePasswordConfirm == true) {
            $("#js-change-password-form").find("input, select, button").prop("disabled", true);
            setTimeout(function(){
                $("#js-change-password-form").fadeOut(750);
                setTimeout(function(){
                    $(".change-user-password-message-success").fadeIn(750);
                    setTimeout(function(){
                        window.location.replace('./profile.php');
                    }, 5000);
                }, 750);
            }, 500);
            $.ajax({
                url : "./includes/change_password.script.php",
                method : "POST",
                data : {
                    changePasswordValue : changePasswordValue,
                    changePasswordConfirmValue : changePasswordConfirmValue,
                    /* userId : userId, ? */
                    submit : 1
                },
                success : function(data) {
                  $(".change-user-password-message-success").html(data);
                }
            });
        }

    });

/* ---------------------------------------------------------
    -------------------- PASSWORD DISPLAY ------------------
    ----------------------------------------------------- */

    /* -------- Password Display Hidden -------- */

    $("#js-change-password-display").click(function(){
        var fieldType = $("#js-change-password-input").attr("type");
        if (fieldType == "password") {
            $("#js-change-password-input").attr("type", "text");
            $("#js-change-password-display").removeClass("hide-password").addClass("show-password");
        } else {
            $("#js-change-password-input").attr("type", "password");
            $("#js-change-password-display").removeClass("show-password").addClass("hide-password");
        }
    });

    /* -------- Confirm Password Display Hidden -------- */

    $("#js-change-password-confirm-display").click(function(){
        var fieldType = $("#js-change-password-confirm-input").attr("type");
        if (fieldType == "password") {
            $("#js-change-password-confirm-input").attr("type", "text");
            $("#js-change-password-confirm-display").removeClass("hide-password").addClass("show-password");
        } else {
            $("#js-change-password-confirm-input").attr("type", "password");
            $("#js-change-password-confirm-display").removeClass("show-password").addClass("hide-password");
        }
    });

});

PHP

<?php 
if (isset($_POST["submit"])) {
    include_once "dbconn.script.php";

    $user_id = /* ? */;
    $changePasswordValue = $_POST["changePasswordValue"];
    $changePasswordConfirmValue = $_POST["changePasswordConfirmValue"];
    $changePasswordValueLength = strlen($changePasswordValue);

    if ($changePasswordValueLength < 8) {
        echo "<p>Password should have at least 8 characters.<p>";
    } else {
        if ($changePasswordConfirmValue != $changePasswordValue) {
            echo "<p>Passwords you entered does not match.</p>";
        } else {
            $hashedChangePassword = password_hash(base64_encode(hash('sha384', $changePasswordValue, true)), PASSWORD_BCRYPT, ["cost" => 11]);
            $sql = "UPDATE hgs_users SET user_pw = ? WHERE user_id = ?";
            $stmt = mysqli_stmt_init($conn);
            if (!mysqli_stmt_prepare($stmt, $sql)) {
                echo "<p>SQL statement failed!</p>";
                exit();
            } else {
                mysqli_stmt_bind_param($stmt, "ss", $hashedChangePassword, $user_id);
                mysqli_stmt_execute($stmt);
                mysqli_stmt_close($stmt);
                echo "<p>Success!</p>";
            }
        }
    }
    mysqli_close($conn);
} else {
    header("Location: ../index.php");
}

?>

最佳答案

问题缺少对修改密码的环境的描述。

如果您要更改已通过身份验证的用户的密码，则应该很简单

$user_id = $_SESSION['user_id'];

因为用户已经登录，所以您必须已经在 session 中的某个位置拥有他的 ID。成功登录后，您可以将其存储在 session 中，并以您想要的任何名称命名。

您不需要将用户 ID 传递到 HTML 表单，您已经在 session 中拥有它了。

如果您要更改未经身份验证的用户的密码，则情况完全不同。

现在许多网站通过电子邮件发送 HTTP 链接来访问“更改密码”页面。 电子邮件中有一个用于重置密码的特殊链接；该链接包含为用户发出的特定密码请求生成的临时 UUID(在您选择的时间范围内到期)。 UUID 与请求密码重置的用户的 user_id 一起存储在数据库中。

当用户单击链接时，链接将发送到接收 UUID 的页面。借助 UUID，您可以检索请求重置密码的 user_id 并完成这项工作，在重置密码后立即删除 UUID。

当然，还有其他方法可以实现密码重置机制，但恕我直言，这是网络上最简单和最常见的方法。

关于javascript - 通过AJAX从$_SESSION发送变量到PHP进行密码更改，怎么做？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53136420/

上一篇：php - MySQL数据库IP地址来自rackspace还是google cloud？

下一篇：mysql - 无法写入重复键，使用组合主键

相关文章：

javascript - 根据一系列标签创建有意义的建议

php - 如何在 PHP 中连接用户定义的变量并将结果插入 MySQL 表

javascript - Codeigniter - Ajax 调用时出错 (404)

mysql - 第二个表中需要零结果的相关项目计数(请查询检查)

java - 并非所有 Spring JPA 和数据源属性都在控制台应用程序中工作

Javascript insideHTML 不写入文档

javascript - 通过 phpmailer 发送电子邮件不会返回 Javascript 响应

javascript - 结合 ng-repeat 和 ng-controller 来渲染 item

php - str_replace() 与关联数组

mysql - MySQL中有没有办法确定每次记录包含第一次使用的值？

©2024 IT工具网  联系我们