Выйти на Apollo-Client - PullRequest
Новая
       14

Выйти на Apollo-Client

0 голосов
/ 23 апреля 2020

Я разрабатываю приложение, использующее реагирующий натив, с Expo, которое взаимодействует с BackQL-сервером GraphQL с помощью Apollo.

Авторизация между Front и Back выполняется с помощью токена JWT для заголовка, и он работает нормально. В бэкэнде есть промежуточное ПО, которое проверяет, существует ли токен и является ли он действительным:

  • Если запрос открыт, он просто получает информацию.
  • Если запрос авторизован и пользователь аутентифицирован, он получает информацию.
  • Если запрос авторизован, но пользователь не авторизован (или использует недопустимый токен), он выдает ошибку.

BACKEND 

export const isAuth: MiddlewareFn<MyContext> = ({ context }, next) => {
    const { authorization } = context.req.headers;

    if (!authorization) {
        throw new Error("Not authenticated. ");
    }
[...]
}

@Query(() => User)
@UseMiddleware(isAuth)
async Me(
    @Ctx() { payload }: MyContext,
) {
    return UserModel.findById(payload!.userId);
}

Я получаю запросы через следующий компонент:

FRONTEND 

const Me: React.FC<any> = (props) => {
    const {
        data, loading, error,
    } = useMeQuery();

    if (loading) {
        return (<Text>Loading ... {String(props.test)}</Text>);
    }
    if (error) {
        return (<Text>{ error.message } {String(props.test)}</Text>);
    }
    return (
        <Text>Hello { String(data?.Me?.email) } </Text>
    );
};

Существо useMeQuery(); хук-функция, сгенерированная @graphql-codegen/cli. 

export function useMeQuery(baseOptions?: ApolloReactHooks.QueryHookOptions<MeQuery, MeQueryVariables>) {
        return ApolloReactHooks.useQuery<MeQuery, MeQueryVariables>(MeDocument, baseOptions);
}

До этого все работало нормально.

Теперь я пытаюсь реализовать функцию выхода из системы на внешнем интерфейсе, чтобы пользователь мог продолжать навигацию как анонимный пользователь при выходе из системы.

Я только что создал кнопку, которая вызывает функцию, которая очищает сохраненные токены (она работает), поэтому следующие вызовы не проходят проверку подлинности и выдают ошибку. Проблема, с которой я сталкиваюсь, состоит в том, что apollo-client использует кеш для повторной обработки запроса, поэтому теперь анонимный пользователь может видеть информацию о пользователях старого LogedIn.

Для выхода из системы я попытался несколько способы очистки кеша, но безуспешно: 

clearTokens(); // Clear tokens from asyncStorage. Working fine.

// Tying to clear cache:
client.clearStore(); // Not working, still getting the stored value on cache when refreshing the component.
client.cache.reset(); // Not working, still getting the stored value on cache when refreshing the component.
client.resetStore(); // Not working, it tries to call the query again, it throws an error (because it is not authenticated) and doesn't clear the cache.

Какой самый лучший способ для выхода из системы при использовании apollo-client?

PD: Если вошел другой пользователь, я вызываю client.resetStore(); и запросы все переписаны, работают нормально. Проблема в том, чтобы просто перейти от loggedIn к анонимному.

1 Ответ

0 голосов
/ 24 апреля 2020

Я нашел решение.

По другим темам я читал об этой проблеме, но использую React. Они говорят о переходе на другую страницу, однако, на реакции-нативной, она не работала, потому что при переходе на другую страницу последняя страница остается открытой. Решение состояло в том, чтобы перейти на другую страницу, используя props.navigation.replace("Logout");.

Страница выхода из системы, просто сделайте все, что нужно, очистите кэш с помощью client.clearStore();, а затем автоматически перейдите на основную страницу с помощью navigation.replace.

...