遗漏的类型错误的JavaScript Canot读取属性“”用户名”

Question

当我跑我的JavaScript我得到这个错误：

KinveyRequester.js:23 Uncaught TypeError: Cannot read property 'username' of undefined

而且我不知道怎么解决它

代码：

function registerUser(e) { 
    registerAjax(e); 
    registerSuccess(); 
    // window.location = "Items.html"; 
} 

function registerSuccess(userInfo) { 
    saveAuthInSession(userInfo); 
    showInfo('User registration successful.'); 
} 

function saveAuthInSession(userInfo) { 
    sessionStorage.setItem("username", userInfo.username); 
    sessionStorage.setItem("authToken", userInfo._kmd.authtoken); 

    $("#loggedInUser").text("Welcome, " + userInfo.username); 
} 

function registerAjax(e) { 
    e.preventDefault(); 

    let userData = { 
     username: $("#username").val(), 
     password: $("#password").val() 
    }; 

    $.ajax({ 
     method: "POST", 
     url: kinveyBaseUrl + "user/" + kinveyAppKey + "/", 
     headers: kinveyAppAuthHeaders, 
     data: userData, 
     success: registerSuccess, 
     error: handleAjaxError 
    }); 
} 

Answer 1

的reeasons此错误是userInfo未定义所以JavaScript是无法找到的userInfo因为userInfo是属性“用户名” 请告诉你什么时候调用这个函数saveAuthInSession？

function registerAjax(e) { 
    e.preventDefault(); 

    var userData = { 
     username: $("#username").val(), 
     password: $("#password").val() 
    }; 

    $.ajax({ 
     method: "POST", 
     url: kinveyBaseUrl + "user/" + kinveyAppKey + "/", 
     headers: kinveyAppAuthHeaders, 
     data: userData, 
     success: function() { 
      registerSuccess(userData); 
     }, 
     error: handleAjaxError 
    }); 
} 

调用该函数这里

Answer 2

你不叫registerSuccess与用户数据（或任何PARAM），因此“用户信息”参数将始终是不确定的。

你可以做两个修改

• 从registerUser删除，因为这将运行前阿贾克斯完成了成功

即

通用户数据：

success: function() { 
    registerSuccess(userData); 
}); 

我不要使用let，因为它不是向后兼容的，但这会c如果您将其更改为 'VAR用户数据'

更新代码ertainly工作：

function registerUser(e) { 
    registerAjax(e); 
    // do not call here - this will run before the ajax has completed: registerSuccess(); 
    // window.location = "Items.html"; 
} 

function registerSuccess(userInfo) { 
    saveAuthInSession(userInfo); 
    showInfo('User registration successful.'); 
} 

function saveAuthInSession(userInfo) { 
    sessionStorage.setItem("username", userInfo.username); 
    sessionStorage.setItem("authToken", userInfo._kmd.authtoken); 

    $("#loggedInUser").text("Welcome, " + userInfo.username); 
} 

function registerAjax(e) { 
    e.preventDefault(); 

    var userData = { 
     username: $("#username").val(), 
     password: $("#password").val() 
    }; 

    $.ajax({ 
     method: "POST", 
     url: kinveyBaseUrl + "user/" + kinveyAppKey + "/", 
     headers: kinveyAppAuthHeaders, 
     data: userData, 
     success: function() { 
      // this will keep the scope of userData above and pass on success 
      registerSuccess(userData); 
     }, 
     error: handleAjaxError 
    }); 
} 

---

当然，你会立即得到了下一个问题：

userInfo._kmd.authtoken 

为_kmd。 authtoken不是用户数据的一部分

所以这一切都取决于你从POST得到什么，即

success: function(responseData) { 
    console.log(responseData); 
    registerSuccess(responseData); 
} 

Answer 3

只是想知道，如果它会更容易为你只是减少您呼叫功能的数量...

function registerUser(e) { 
    e.preventDefault(); 

    var userData = { 
     username: $('#username').val(), 
     password: $('#password').val() 
    }; 

    $.ajax({ 
     method: 'POST', 
     url: kinveyBaseUrl + 'user/' + kinveyAppKey + '/', 
     headers: kinveyAppAuthHeaders, 
     data: userData, 
     success: function(responseData) { 
      showInfo('User registration successful.'); 
      sessionStorage.setItem('username', userInfo.username); 
      sessionStorage.setItem('authToken', userInfo._kmd.authtoken); 
      // sessionStorage.setItem('authToken', responseData._kmd.authtoken); ? 
      // window.location = "Items.html"; 
      $('#loggedInUser').text('Welcome, ' + userInfo.username); 
     }, 
     error: handleAjaxError 
    }); 
}