Как получить новый токен от Cognito с внешнего интерфейса?

Question

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

Я просмотрел все примеры из Cognito, и они не сработали.Они используют зависимости, которых у меня нет, и в них нет четкого списка, как их получить.

Может кто-нибудь помочь, пожалуйста?

Answer 1

Вы можете написать клиент с нуля, как советует Генри, или вы можете использовать библиотеку, и все готово.

Мы использовали этот пакет: https://www.npmjs.com/package/amazon-cognito-identity-js

Работало просто отлично.Если это не работает для вас из-за какой-то загадочной проблемы с зависимостями, пожалуйста, расскажите немного подробнее об этом.Может быть, мы это выясним.

Answer 2

Из документации, чтобы обменять токен обновления на токен доступа, необходимо сделать POST-запрос к конечной точке токена oauth2/token.См. Раздел «Обмен токена обновления на токены» здесь: https://docs.aws.amazon.com/cognito/latest/developerguide/token-endpoint.html

Вы можете использовать API Fetch для простого выполнения запросов.Вот документы по нему: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API.

Поскольку запросы токенов включают отправку идентификатора вашего клиента и его секрета клиенту в AWS cognito, я бы рекомендовал не делать этот запрос в React напрямую.Если бы вы сделали это в React, кто-то мог бы найти ваш идентификатор клиента и его секретный ключ и сделать запросы, которые выглядят так, как будто они приходят из вашего приложения.

Вместо этого вам нужно, чтобы React запросил ваш сервер.чтобы сделать запрос и вернуть полученный ответ.

Вот пример:

На стороне сервера вы можете создать маршрут типа /api/aws/tokens/refresh или что-то вродетот, который ожидает refreshToken в теле запроса.Тогда контроллер для этого маршрута может вызвать этот метод:

async getAccessToken(refreshToken) {
    const endpoint = 'https://mydomain.auth.us-east-1.amazoncognito.com/oauth2/token';
    const options = {
        method: 'POST',
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
            'Authorization': `Basic ${btoa(CLIENT_ID:CLIENT_SECRET)}`
        },
        body: JSON.stringify({
            grant_type: 'refresh_token',
            client_id: CLIENT_ID,
            refresh_token: refreshToken
        })
    }
    const response = await fetch(endpoint, options);
    return response;
}

Обратите внимание, что Авторизация использует метод btoa, который base64 кодирует свой вход.

На стороне клиента ваш ReactПриложение может называть ваш сервер следующим образом:

async getAccessToken(refreshToken) {
    const endpoint = '/api/aws/tokens/refresh';
    const options = {
        method: 'POST',
        body: JSON.stringify({
            refreshToken: refreshToken
        })
    }
    const response = await fetch(endpoint, options);
    // store the tokens or return them
}

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