时间戳

首页 > 解决方案 > 如何使用 asyncStorage 从本地存储中获取值并返回

javascript - 如何使用 asyncStorage 从本地存储中获取值并返回

问题描述

我想创建一个方法，该方法从存储在本地存储中的令牌返回身份验证标头，以便可以从许多 ajax 调用它，如下所示：

const fetchUserInfo = (username) => {
  const requestString = apiBaseURL + 'access/user_info/'
  const form = {username: username}

  return axios.post(requestString, form, getAuthHeader())
    .then((Response) => {
      return {
        userInfo: Response.data,
        message: null
      }
    })
    .catch((Error) => {
      return getErrorMessage();
    });
}

在这种情况下，getAuthHeader()是一种必须从存储在本地存储中的令牌返回正确授权标头的方法，因此必须使用它asyncStorage来检索此类令牌。

这是代码getAuthHeader：

export const getAuthHeader = async () => {
  return await AsyncStorage.getItem('token')
    .then ((token) => {
      return {
        headers: {'Authorization' : 'Token ' + token}
      }
    })
    .catch ((error) => null)
}

问题是getAuthHeader()不是返回标题而是返回一些其他对象。我相信我搞砸了 的异步性质asyncStorage，但我不知道如何获得我需要的价值。

标签： javascriptreact-nativeasynchronousasyncstorage

解决方案

是的，您正在一起使用async/await和.then（本机）。async/await已经为您处理了.then语法，而您不必这样做。所以你不需要两者都在一起，它是 1 或另一个。下面的两个例子。

异步/等待：

export const getAuthHeader = async () => {
  try {
    const token = await AsyncStorage.getItem('token')
    if (!token) { return null }
    return {
        headers: {'Authorization' : 'Token ' + token}
      }
  } catch(error) { return null }

}

本国的

export const getAuthHeader = () => {
  return AsyncStorage.getItem('token')
    .then((token) => {
      if (!token) { return null }
      return {
        headers: {'Authorization' : 'Token ' + token}
      }
    })
    .catch ((error) => null)
}

您还需要getAuthHeader在第一种方法中等待，否则它将永远无法解析该值：

const fetchUserInfo = async (username) => {
  const requestString = apiBaseURL + 'access/user_info/'
  const form = {username: username}
   
  try {
    const response = await axios.post(requestString, form, await getAuthHeader())
    return {
        userInfo: response.data,
        message: null
    }
  } catch(error) {
    return getErrorMessage();
  }
}

推荐阅读