Question

我正在调用JSON api设置一个身份验证令牌，我将在AsyncStorage中存储该令牌以在应用程序生命周期之间保留，这样用户就不必每次都登录。

我正在设置这样的令牌：

fetch(url, {
    method: 'POST',
    headers: {
      Accept: 'application/json',
      'Content-Type': 'application/json',
    },
    body: JSON.stringify(this.state)
  })
    .then( resp => {
      return resp.json();
    })
    .then( async (data) => {
      if ('error' in data) {
        this.setState({
          error: data.error,
          password: ''
        })
        this.secondTextInput.focus();
      }

      if ('access_token' in data) {
        try {
          await AsyncStorage.setItem('access_token', data.access_token);
        } catch (error) {
          return error;
        }

        this.props.navigation.navigate('Main');

      }
    })
    .catch(
      error => {
        console.error(error)
        return error;
      }
    );

如果我再拨打AsyncStorage.getItem('access_token') 之后杀死应用程序或重新加载应用程序，我将结束此输出：

{ 
    "_40":0,
    "_65":0,
    "_55":null,
    "_72":null
}

如果我然后拨打AsyncStorage.getItem('access_token') 之前查杀应用程序或重新加载应用程序，我就会使用正确的访问令牌。我已经仔细检查了代码，我没有在其他任何地方使用AsyncStorage.setItem('access_token')。

这就是我正在检索我的令牌的方式：

  componentDidMount() {

  console.warn('Mounting');

  try {

      let token = AsyncStorage.getItem('access_token');
      console.warn(token);

      if(token !== null) {
          console.error(token);
      }

  }   catch (error) {}

Answer 1

AsyncStorage.getItem（）是一个异步操作，就像setItem（）一样，所以你需要等到Promise被解析后再进行记录。

编辑提示：如果您看到一些奇怪的输出，它总是与尚未解决或拒绝的Promise相关

Answer 2

我使用@dentemm建议创建异步功能解决了我的问题。

async _getToken() {
try {
    var token = await AsyncStorage.getItem('access_token');

    return token;
  } catch(e) {
    console.error(e);
  }
}

componentDidMount() {

let token = null;

this._getToken()
  .then( rsp => {
    fetch(global.url + '/api/auth/refresh', {
      method: 'POST',
      headers: {
        'Authorization': 'Bearer ' + rsp
      }
    })
    .then(rsp  => {
      return rsp.json();
    })
    .then(data => {
      if('access_token' in data) {
        try {
          AsyncStorage.setItem('access_token', data.access_token);
        } catch (error) {
          return error;
        }
        this.props.navigation.navigate('Main');
      }
    })
    .catch( error => {
      return error;
    })
  });
}

通过这种方式，我可以从存储中获取令牌，然后运行刷新功能以获取更新的令牌以用于将来的请求。

应用程序重启时AsyncStorage数据会发生变化

2 个答案: