...
const fetchAuthToken = getUserAuthToken();
...
Ваш getUserAuthToken является асинхронной функцией, и здесь она не ожидается. Чтобы гарантировать, что асинхронный вызов завершен, вы должны дождаться его или использовать обратные вызовы, как предложено @HungrySoul.
Вы не можете ждать чего-то вне асинхронной функции.
Решение, которое я бы предложил, заключается в создании class UseFetch и передаче аргументов через конструктор. Аргументом здесь является токен JWT, который вы получаете от AsyncStorage.
Кроме того, еще одна вещь, которую можно сделать, и это хорошая практика - используйте redux для управления состоянием и хранения токена JWT , Вы можете посмотреть на это. Это займет немного больше времени, но сделает ваш код более элегантным.
Редактировать: Или вы можете попробовать что-то вроде этого.
Имейте в виду, что вам нужно дождаться выполнения обещаний, прежде чем использовать обещанное.
Здесь мы используем замыкание. Вам нужно будет передать аргумент (async function) useFetchBuilder. Эта функция будет ожидаемой и предоставит JWT. Вы можете использовать getUserAuthToken для этой цели.
Имейте в виду, что перед использованием этой функции вы должны использовать ожидание или ожидание разрешения обещания. Проблема может быть где-то еще в вашем коде - возможно, методы жизненного цикла.
Надеюсь, это помогло.
const responseChecker = async (response) => {
let error = "";
let data = {};
let statusCode = null;
if (!response.ok) {
error = "Something went wrong";
statusCode = response.status;
} else {
statusCode = response.status;
data = await response.json();
}
return { statusCode, error, data };
};
const useFetchBuilder = async (userTokenProvider) => {
const userToken = await userTokenProvider();
return (baseURL, authHeader = null) => {
const defaultHeader = {
Accept: "application/json",
"Content-Type": "application/x-www-form-urlencoded",
key: "1c419c7e-3a34-49f0-9192-b48d4534dff3",
Authorization: authHeader ? authHeader : userToken,
};
const customFetch = (
url,
method = "GET",
body = false,
headers = defaultHeader,
) => {
const options = {
method,
headers,
credentials: "include",
};
if (body) options.body = body;
return fetch(url, options);
};
const get = async (endpoint) => {
const url = `${baseURL}${endpoint}`;
const response = await customFetch(url, "GET");
return responseChecker(response);
};
const post = async (endpoint, body = {}) => {
const url = `${baseURL}${endpoint}`;
const response = await customFetch(url, "POST", body);
return responseChecker(response);
};
const put = async (endpoint, body = {}) => {
const url = `${baseURL}${endpoint}`;
const response = await customFetch(url, "PUT", body);
return responseChecker(response);
};
return {
get,
post,
put,
};
};
}
export default useFetchBuilder;