2016-12-22 3 views
0

Ich habe heute Abend an einem benutzerdefinierten AJAX-Formular gearbeitet und einen Roadblock gefunden. Das Modal erscheint richtig, ich kann meine Zugangsdaten eingeben. Ich habe ein Popup, das den Fortschritt der Einreichung anzeigt, wenn auf die Schaltfläche "Senden" geklickt wird, damit ich feststellen kann, dass dieser Teil des Codes ordnungsgemäß ausgeführt wird. Allerdings werden meine Anmeldeinformationen inkorrekt angezeigt (ich bin sicher, dass sie dies sind). Ich habe diese exemplarische Vorgehensweise verwendet, um loszulegen: Tutorial. Wo könnte ich falsch gelaufen sein? Danke für jede Hilfe!Benutzerdefinierter AJAX-Login Anmeldeinformationen nicht richtig registrieren

Und Code!

Mein HTML für die modal (um ehrlich zu sein ich nicht sicher war, ob ich brauchte „name Rolle Aktion und Verfahren einschließen):

<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> 

Hier ist der relevante Code in meinem 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(); 
} 

Schließlich ist hier die JS-Datei (in meine Skripte Abschnitt in footer.php enthalten):

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(); 
    }); 

}); 
+0

''aktion': 'ajaxlogin', // ruft wp_ajax_nopriv_ajaxlogin' auf - wie passiert das? –

+0

Welche Fehlermeldung wird in der Konsole angezeigt? – mike510a

+0

Gibt es Fehler im httpd Fehlerprotokoll? – mike510a

Antwort

1

Try thi s Code.

 <?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(); 

hinzufügen Code unten in 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'); 

/* Prüft die empfangenen Daten */

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'); 

aktualisiert

scheint, dass Sie mit dem Benutzernamen anmelden Versuch . damit login nicht funktioniert. Wenn Sie sich mit E-Mail und Benutzernamen anmelden möchten, müssen Sie unten Funktion hinzufügen.

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); 
+0

Das funktioniert einwandfrei! Wenn Sie möchten, dass die Webseite umgeleitet wird, entfernen Sie das Kommentarzeichen 'document.location.href = ajax_login_object.redirecturl;' Thank you :) –

Verwandte Themen