WordPress：Facebook社交登录成功后JS重定向失效问题

我搭建的WordPress登录页面功能正常，接入Facebook SDK实现社交登录后，登录流程能正常完成，但登录成功后无法跳转到网站首页www.mywebsite.com。我尝试用JavaScript处理重定向，但没触发跳转，求排查问题。

尝试的重定向代码片段 #

jQuery.post(ajaxurl, data, function(response) {
    if (response.success) {
        wp_safe_redirect( '/' );
        exit;
    } else {
        document.getElementById('login-form-message').innerHTML = response.message;
    }
});

Facebook社交登录完整代码 #

/* Manage Social Login Script */
window.fbAsyncInit = function() {
FB.init({
  appId      : 'xxxxxxxxxxxxxxx',
  cookie     : true,
  xfbml      : true,
  version    : 'v15.0'
});
    
    var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>';
    document.getElementById('facebook-login-button').addEventListener('click', function() {
        FB.login(function(response) {
            if (response.authResponse) {
                FB.api('/me', {fields: 'name,email'}, function(response) {
                    var data = {
                        'action': 'facebook_login',
                        'facebook_id': response.id,
                        'access_token': FB.getAuthResponse().accessToken,
                        'email': response.email,
                        'username': response.name
                    };
                    jQuery.post(ajaxurl, data, function(response) {
                        if (response.success) {
                            wp_safe_redirect( '/' );
                            exit;
                        } else {
                            document.getElementById('login-form-message').innerHTML = response.message;
                        }
                    });
                });
            } else { 
                document.getElementById('login-form-message').innerHTML = 'User cancelled login or did not fully authorize.';
            }
        }, {scope: 'email'});
    });
}

(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "https://connect.facebook.net/en_US/sdk.js";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

处理AJAX请求的PHP代码 #

//** Facebook Login AJAX Handler **/ 
function facebook_login_handler() {
   // Verify ID token
   $facebook_id = $_POST['facebook_id'];
   $access_token = $_POST['access_token'];
   $email = $_POST['email'];
   $username = $_POST['username'];
   $response = wp_remote_get( 'https://graph.facebook.com/v3.3/' . $facebook_id . '?access_token=' . $access_token );
   $facebook_response = json_decode( wp_remote_retrieve_body( $response ), true );

   if ( ! isset( $facebook_response['id'] ) ) {
       $response = array(
           'success' => false,
           'message' => 'Invalid Facebook ID token'
       );
       echo json_encode( $response );
       wp_die();
   }

   // Check if the user already exists in our database
   $user = get_user_by( 'email', $email );
   if ( ! $user ) {
       $user = get_user_by( 'login', $username );
   }

   if ( $user ) {
       // Update user meta with Facebook ID
       update_user_meta( $user->ID, 'facebook_id', $facebook_id );
       // Log the user in
       wp_set_current_user( $user->ID );
       wp_set_auth_cookie( $user->ID );
       $response = array(
           'success' => true,
           'message' => 'Login successful'
       );
   } else {
       // If the user does not exist, create a new account
       $user_data = array(
         'user_login' => $username,
         'user_email' => $email,
         'user_pass' => wp_generate_password()
     );
     $user_id = wp_insert_user( $user_data );
     if ( is_wp_error( $user_id ) ) {
         $response = array(
             'success' => false,
             'message' => $user_id->get_error_message()
         );
         echo json_encode( $response );
         wp_die();
     } else {
         update_user_meta( $user_id, 'facebook_id', $facebook_id );
         wp_set_current_user( $user_id );
         wp_set_auth_cookie( $user_id );
         $response = array(
             'success' => true,
             'message' => 'Registration and login successful'
         );
     }
 }
 echo json_encode( $response );

 wp_die();
}

问题原因与解决方法 #

• 核心错误：你在JavaScript代码里调用了wp_safe_redirect( '/' )和exit，这两个都是PHP后端函数，在前端JS环境中完全无法执行，自然不会触发重定向。
• 正确的重定向方式：在AJAX请求的成功回调里，用前端JS的页面跳转方法替换无效的PHP函数：

  jQuery.post(ajaxurl, data, function(response) {
      if (response.success) {
          // 替换为前端跳转代码
          window.location.href = 'https://www.mywebsite.com';
      } else {
          document.getElementById('login-form-message').innerHTML = response.message;
      }
  });
  

• 额外优化建议：
  1. 可以在PHP的响应中返回首页URL，让JS动态获取避免硬编码：在PHP的$response数组里添加'redirect_url' => home_url('/')，然后JS里用window.location.href = response.redirect_url;
  2. 打开浏览器控制台的Network标签，确认AJAX请求是否真的返回了success: true，检查响应状态和返回值是否正确
  3. 验证wp_set_auth_cookie是否正确设置了登录cookie，否则跳转后用户可能仍处于未登录状态

内容的提问来源于stack exchange，提问作者Snorlax