Как правильно обрабатывать неаутентифицированных пользователей и запросы в приложениях AWS Amplify / AppSync React?

Мне очень сложно понять, как обрабатывать неаутентифицированных пользователей в приложении React, которое использует AWS Amplify и AWS AppSync. Похоже, что большинство документов предлагают обернуть все приложение withAuthenticator HOC из aws-amplify-react, но в реальном мире это очень редкий случай.

Итак, вот как я настраиваю клиента для общения с API AppSync

const client = new AWSAppSyncClient({
  url: AppSyncConfig.aws_appsync_graphqlEndpoint,
  region: AppSyncConfig.aws_appsync_region,
  auth: {
    type: AUTH_TYPE.AMAZON_COGNITO_USER_POOLS,
    jwtToken: async () =>
      (await Auth.currentSession()).getIdToken().getJwtToken()
  }
});

а затем я оборачиваю компонент App верхнего уровня export default withAuthenticator(App);

Все это работает, пользователь попадает в корневой URL-адрес и получает представление для входа в систему. Как было сказано выше, в реальном сценарии это очень редкий случай. Обычно корневой URL, как и многие другие, открыт для пользователей, не прошедших проверку подлинности. Как этого добиться с помощью AWS Amplify? - ни документов, ни тусовок :-(

Я нашел подсказку, как заставить его работать здесь, но до сих пор нет полного объяснения.

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
6
0
7 755
3
Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

Я предполагаю, что вариант использования - предоставить доступ к вашему graphql api пользователям unauth и auth, дав им разные разрешения (например, пользователи auth могут выполнять мутации, а пользователи unauth - только некоторые запросы). Если это так, вам нужно настроить AWS IAM в качестве типа аутентификации в API AppSync, вам также понадобится Amazon Cognito IdentityPool с доступом unauth и auth и настройте для них роли IAM в соответствии с вашими требованиями.

Вы можете найти более подробный ответ здесь

Спасибо @FranciscoR. Не могли бы вы подробнее рассказать о «настройке ролей IAM для них в соответствии с вашими требованиями»? Не могу понять, какие именно роли и как их настраивать.

SaidAkh 20.12.2018 12:22

Я предполагаю, что @FranciscoR означает ограничить неаутентифицированный ролевой доступ к определенным операциям GraphQL, как описано здесь docs.aws.amazon.com/appsync/latest/devguide/…

tgk 01.01.2019 05:05
Ответ принят как подходящий
  1. Обязательно обновите параметры проверки подлинности, чтобы разрешить доступ как с проверкой подлинности, так и без проверки подлинности, запустив amplify update auth и настроив параметры вручную.

  2. В запросе API теперь можно указать режим авторизации:

const createdTodo = await API.graphql({
  query: queries.createTodo,
  variables: {input: todoDetails},
  authMode: 'AWS_IAM'
});

Вот более подробные документы


Эти шаги устарели, но все еще работают:

Выполнив следующие действия, вы можете разрешить как аутентифицированный, так и неаутентифицированный доступ к вашему AWS AppSync API:

  1. Создать проект Amplify
amplify init
  1. Добавьте аутентификацию с настраиваемой конфигурацией безопасности:
amplify add auth

Do you want to use the default authentication and security configuration? NO

Select the authentication/authorization services that you want to use: (Use arrow keys) User Sign-Up, Sign-In, connected with AWS IAM controls (Enables per-user Storage features for images or other content, Analytics, and more)

Please provide a friendly name for your resource that will be used to label this category in the project: YOURAPINAME

Please enter a name for your identity pool. YOURIDPOOLNAME

Allow unauthenticated logins? (Provides scoped down permissions that you can control via AWS IAM) Yes

Choose defaults for the rest of the questions

  1. Добавьте api
amplify add api

Choose Amazon Cognito User Pool as the authorization type.

  1. Создать API
amplify push
  1. В настройках панели управления AppSync API измените тип аутентификации на AWS Identity and Access Management (IAM)

  2. В aws.exports.js в клиентском приложении замените aws_appsync_authenticationType на AWS_IAM

  3. На панели управления Cognito нажмите «Управление пулами идентификаторов» и щелкните свой пул идентификаторов.

  4. Нажмите «Изменить пул удостоверений», чтобы увидеть свои «Неаутентифицированную роль» и «Аутентифицированную роль».

  5. Откройте консоль IAM и найдите «Неаутентифицированную роль» из шага 8.

  6. Нажмите «Добавить встроенную политику».

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "appsync:GraphQL"
            ],
            "Resource": [
                "arn:aws:appsync:<REGION>:<ACCOUNTID>:apis/<APIID>/types/Mutation/fields/listTodos"
            ]
        }
    ]
}
  1. Откройте консоль IAM и найдите «Роль, прошедшую проверку подлинности» из шага 8.

  2. Нажмите «Добавить встроенную политику».

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "appsync:GraphQL"
            ],
            "Resource": [
                "arn:aws:appsync:<REGION>:<ACCOUNTID>:apis/<APIID>/types/Mutation/fields/listTodos",
                "arn:aws:appsync:<REGION>:<ACCOUNTID>:apis/<APIID>/types/Mutation/fields/createTodo"
            ]
        }
    ]
}
  1. В index.js добавьте этот код:
import { Auth } from 'aws-amplify'
Auth.currentCredentials()
  .then(d => console.info('data: ', d))
  .catch(e => console.info('error: ', e))
  1. Теперь вы должны иметь возможность выполнять запросы при выходе из системы, а также запрашивать и создавать мутации при входе в систему.
If you'd like to access the unique identity of the logged in user for user authorization & fine grained access control, you can access the $context.identity.cognitoIdentityId in the resolver.

Спасибо, @Nader. Этот пост помогает мне понять, как (возможно) работает директива @auth. У вас есть незначительные опечатки. Mutation/fields/listTodos должен быть Query/.. в обоих примерах.

ronaldwidha 05.05.2019 05:58

означает ли это, что я больше не могу использовать директивы @auth. Как только я использую директиву @auth, я получаю 403, запрещенный как для unauth, так и для auth. Я предполагаю, что все сгенерированные резолверы должны быть обновлены, поскольку мы переключаем AWS_IAM

ronaldwidha 06.05.2019 04:49

IAM в настоящее время не поддерживается @auth github.com/aws-amplify/amplify-cli/issues/1043

ronaldwidha 07.05.2019 02:48

Не работает с Amplify 4.18.1. error: No Cognito Identity pool provided for unauthenticated access App.vue:35 [WARN] 10:21.110 AWSAppSyncRealTimeProvider - ensure credentials error No Cognito Identity pool provided for unauthenticated access 2 ConsoleLogger.js:107 [WARN] 10:21.111 AWSAppSyncRealTimeProvider - ensure credentials error No Cognito Identity pool provided for unauthenticated access ConsoleLogger.js:107 Error: No credentials 3 vendor.js line 347 > eval:842:35

npskirk 27.04.2020 20:12

Можно ли изменять без аутентификации?

SalahAdDin 27.04.2021 14:45

Небольшая дополнительная помощь всем, кто страдает от несанкционированного доступа (ваша проблема с AppSync) или 401 (ваша проблема с настройкой роли IAM / Unauth).

У нас есть COGNITO POOLS в качестве авторизатора по умолчанию. Чтобы использовать AWS_IAM, вам нужно пойти и добавить его в AppSync, а затем настроить роль UNAUTH для пула идентификаторов (как это хорошо описано выше). Но есть последний подводный камень -

Добавьте директивы @aws_iam в запрос / мутацию / модель, которые участвуют в анонимной транзакции, это должно перестать усиливать возвращение несанкционированной ошибки, однако вы вполне можете увидеть больше ошибок, возвращаемых, если вы также не разрешили поля объектов с помощью директивы .

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

https://aws.amazon.com/blogs/mobile/using-multiple-authorization-types-with-aws-appsync-graphql-apis/

Другие вопросы по теме