反应本机获取令牌,然后使用获取API获取用户详细信息

时间:2018-08-13 09:18:00

标签: reactjs react-native promise

我正在使用React native构建登录应用程序。对于身份验证,我正在使用Spring Boot应用程序。

这是用例。

  1. 用户访问客户的登录屏幕并输入用户名和密码。
  2. 使用提取API将本地发送请求响应到服务器。
  3. 如果令牌对象返回,则登录名(用户名/密码)正确。
  4. 如果令牌正确,则应用程序应再次调用服务器以通过令牌获取用户详细信息。

问题是-我如何才能首先通过API调用来验证登录并获取令牌,并在获得有效令牌后再次进行API调用来获取用户详细信息。

代码如下:

<loading :active.sync="isLoading" :can-cancel="true">
<div class="loading-icon"></div>
Some text below the icon
</loading>

和登录处理程序

import { dologin,getUser } from "../../API";

获取API

handleLogin = () => {
    const { username, password } = this.state

    if (username.length == 0 || password.length == 0){
        this.setState({
          errorMessage: 'Login and password is required.',
          loginProcessing: false,
        });
    } else {

      this.setState({errorMessage: null});


      dologin(username, password).then(accessToken => {

        if(!accessToken.state){
          this.setState({
            errorMessage: accessToken.data,
            loginProcessing: false,
          });
          return null;
        } else{
          return accessToken.data;
        }
      });

    }
}

1 个答案:

答案 0 :(得分:0)

使handleLogin异步功能并尝试使用此功能

handleLogin = async () => {
  const { username, password } = this.state

  if (username.length == 0 || password.length == 0) {
    this.setState({
      errorMessage: 'Login and password is required.',
      loginProcessing: false,
    });
  } else {
    let loginResponse = await dologin(username, password);
    if (loginResponse.status) {
        // if loginResponse = {token: "tokenValue"}
        userDetails = await getUser(loginResponse.token);
        console.log("User Details",userDetails)
    } else {
      this.setState({
        errorMessage: loginResponse.data,
        loginProcessing: false,
      });
    }

  }
}