Question

我今天晚上一直在制作一个自定义的AJAX表单并遇到了障碍。模态弹出正确，我可以输入我的凭据。我有一个弹出窗口，显示单击提交按钮时提交的进度，所以我可以告诉这部分代码运行正常，但是它显示我的凭据不正确（我很肯定他们是）。我使用本演练开始：Tutorial。哪里可能出错了？谢谢你的帮助！

和代码！

我的模态HTML（说实话我不确定是否需要包含“名称角色操作和方法”）：

<form class="form" name="login" id="login" role="form" action="login" method="post">
    <p class="status"></p> <!-- testing the status -->
    <div class="form-group">
        <label class="sr-only" for="login-name">Username</label>
        <input type="text" class="form-control" id="login-name" name="login-name" placeholder="Username">
    </div>
    <div class="form-group">
        <label class="sr-only" for="login-password">Password</label>
        <input type="password" class="form-control" id="login-password" name="login-password" placeholder="Password">
    </div>
    <!-- Form Group -->
    <input type="submit" class="btn btn-secondary login-modal-button" value="Log In">
    <?php wp_nonce_field( 'ajax-login-nonce', 'security' ); ?>
</form>

以下是我的functions.php中的相关代码：

function ajax_login_init(){

    wp_register_script('ajax-login-script', get_template_directory_uri() . '/assets/js/ajax-login-script.js', array('jquery') );
    wp_enqueue_script('ajax-login-script');

    wp_localize_script( 'ajax-login-script', 'ajax_login_object', array(
        'ajaxurl' => admin_url( 'admin-ajax.php' ),
        'redirecturl' => home_url(),
        'loadingmessage' => __('Sending user info, please wait...')
    ));

    // Enable the user with no privileges to run ajax_login() in AJAX
    add_action( 'wp_ajax_nopriv_ajaxlogin', 'ajax_login' );
}

// Execute the action only if the user isn't logged in
if (!is_user_logged_in()) {
    add_action('init', 'ajax_login_init');
}

/* Checks the received data */

function ajax_login(){

    // First check the nonce, if it fails the function will break
    check_ajax_referer( 'ajax-login-nonce', 'security' );

    // Nonce is checked, get the POST data and sign user on
    $info = array();
    $info['user_login'] = $_POST['login-name'];
    $info['user_password'] = $_POST['login-password'];
    $info['remember'] = true;

    $user_signon = wp_signon( $info, false );
    if ( is_wp_error($user_signon) ){
        echo json_encode(array('loggedin'=>false, 'message'=>__('Wrong username or password.')));
    } else {
        echo json_encode(array('loggedin'=>true, 'message'=>__('Login successful, redirecting...')));
    }

    die();
}

最后，这是JS文件（包含在footer.php的脚本部分中）：

jQuery(document).ready(function($) {

    // Perform AJAX login on form submit
    $('form#login').on('submit', function(e){
        $('form#login p.status').show().text(ajax_login_object.loadingmessage);
        $.ajax({
            type: 'POST',
            dataType: 'json',
            url: ajax_login_object.ajaxurl,
            data: {
                'action': 'ajaxlogin', //calls wp_ajax_nopriv_ajaxlogin
                'username': $('form#login #login-name').val(),
                'password': $('form#login #login-password').val(),
                'security': $('form#login #security').val() },
            success: function(data){
                $('form#login p.status').text(data.message);
                if (data.loggedin == true){
                    document.location.href = ajax_login_object.redirecturl;
                }
            }
        });
        e.preventDefault();
    });

});

Answer 1

试试这段代码。

        <?php
        /*
         * Template Name: login check
         */

        get_header();

        ?>

        <form class="form" name="login" id="login" role="form" action="login" method="post">
            <p class="status"></p> <!-- testing the status -->
            <div class="form-group">
                <label class="sr-only" for="login-name">Username</label>
                <input type="text" class="form-control" id="login-name" name="login-name" placeholder="Username">
            </div>
            <div class="form-group">
                <label class="sr-only" for="login-password">Password</label>
                <input type="password" class="form-control" id="login-password" name="login-password" placeholder="Password">
            </div>
            <!-- Form Group -->
            <input type="submit" class="btn btn-secondary login-modal-button" value="Log In">
            <?php wp_nonce_field( 'ajax-login-nonce', 'security' ); ?>
        </form>
        <script>
        jQuery(document).ready(function($) {

            // Perform AJAX login on form submit
            $('form#login').on('submit', function(e){
                $('form#login p.status').show().text('Sending user info, please wait...');
                $.ajax({
                    type: 'POST',
                    dataType: 'json',
                    url: "<?php echo admin_url( 'admin-ajax.php' );?>",
                    data: {
                        action: 'ajax_login', //calls wp_ajax_nopriv_ajaxlogin
                        'username': $('form#login #login-name').val(),
                        'password': $('form#login #login-password').val(),
                        'security': $('form#login #security').val() },

                    success: function(data){
                            console.log(data);
                        $('form#login p.status').text(data.message);
                        if (data.loggedin == true){
                            //document.location.href = ajax_login_object.redirecturl;
                        }
                    },error: function (data) {
                        console.log(data);
                    }

                });
                e.preventDefault();
            });

        });
        </script>

        <?php
        get_footer();

在functions.php中添加以下代码

function ajax_login_init(){

wp_register_script('ajax-login-script', get_template_directory_uri() . '/assets/js/ajax-login-script.js', array('jquery') );
wp_enqueue_script('ajax-login-script');

wp_localize_script( 'ajax-login-script', 'ajax_login_object', array(
    'ajaxurl' => admin_url( 'admin-ajax.php' ),
    'redirecturl' => home_url(),
    'loadingmessage' => __('Sending user info, please wait...')
));

// Enable the user with no privileges to run ajax_login() in AJAX

}
add_action('init', 'ajax_login_init');

/ *检查收到的数据* /

function ajax_login(){

// First check the nonce, if it fails the function will break
check_ajax_referer( 'ajax-login-nonce', 'security' );

// Nonce is checked, get the POST data and sign user on
$info = array();
$info['user_login'] = $_POST['login-name'];
$info['user_password'] = $_POST['login-password'];
$info['remember'] = true;

$user_signon = wp_signon( $info, false );
if ( is_wp_error($user_signon) ){
    echo json_encode(array('loggedin'=>false, 'message'=>__('Wrong username or password.')));
} else {
    echo json_encode(array('loggedin'=>true, 'message'=>__('Login successful, redirecting...')));
}

die();
}

add_action( 'wp_ajax_ajax_login', 'ajax_login' );
add_action( 'wp_ajax_nopriv_ajax_login', 'ajax_login' );

<强>更新

似乎您尝试使用用户名登录。所以登录不工作。如果您想使用电子邮件和用户名登录，则需要添加以下功能。

 function login_with_email_address($user, $username, $password) {
    if (is_email($username))
    {
        $user = get_user_by('email', $username);
        if($user)
            $username = $user->user_login;
    }
    return wp_authenticate_username_password(null, $username, $password);
}


 add_filter('authenticate', 'login_with_email_address', 20, 3);

自定义AJAX登录未正确注册凭据

1 个答案: