React Frontend Developer

Question 1

Для чего используется функция connect в React Redux? Какие параметры принимает?

Accepted Answer

connect связывает React-компоненты с состоянием и действиями Redux. Она принимает две функции: mapStateToProps для подключения состояния и mapDispatchToProps для передачи действий в компонент. В результате компонент получает доступ к необходимым данным и возможностям изменения состояния.

Question 2

Как устроен процесс reconnect WebSocket после разрыва соединения?

Accepted Answer

Процесс реконнекта WebSocket — это попытка клиента восстановить соединение после его неожиданного разрыва. Обычно клиент отслеживает события 'onclose' или 'onerror' и запускает таймер для повторного подключения. Чтобы избежать нагрузки на сервер, используют экспоненциальную задержку (exponential backoff), увеличивая интервал между попытками. Также часто реализуют механизм 'heartbeat' (ping/pong) для раннего обнаружения "тихих" разрывов.

Question 3

Что такое OpenID Connect и как он связан с OAuth 2.0?

Accepted Answer

OpenID Connect (OIDC) — это протокол аутентификации, который расширяет OAuth 2.0. OAuth 2.0 отвечает за авторизацию (доступ к ресурсам), а OIDC добавляет слой аутентификации (проверку личности пользователя). OIDC использует ID Token в формате JWT, который содержит информацию о пользователе, и стандартизирует процесс входа через сторонние сервисы.

Question 4

Что такое коннекторы в React-Redux и как они работают?

Accepted Answer

Коннектор connect — это функция высшего порядка из React-Redux, которая оборачивает компонент и передаёт ему данные из Redux-хранилища через props. Она принимает mapStateToProps для чтения состояния и mapDispatchToProps для отправки действий. Внутри connect подписывается на store и перерисовывает компонент только при изменении нужных ему данных. Это позволяет разделить логику работы с состоянием и представление.

Question 5

Нужно ли использовать готовую библиотеку для OAuth/OIDC-авторизации?

Accepted Answer

Да, использовать готовую библиотеку почти всегда нужно. OAuth и OIDC — сложные протоколы с множеством нюансов безопасности: PKCE, state, nonce, проверка подписи токенов, ротация ключей. Самостоятельная реализация легко приводит к уязвимостям. Библиотеки уже протестированы сообществом и обновляются при обнаружении проблем.

Question 6

Как подключить OAuth/OIDC-авторизацию в приложении?

Accepted Answer

OAuth 2.0 — это протокол делегирования доступа: приложение получает access token от провайдера (Google, GitHub) вместо пароля пользователя. OIDC — надстройка над OAuth, добавляющая id token с данными о пользователе. Подключение сводится к регистрации приложения у провайдера, редиректу пользователя на его страницу логина и обмену кода авторизации на токены. Для SPA и мобильных приложений обязательно используется PKCE. Токены затем проверяются на бэкенде или используются для запросов к API.

Вопросы React Frontend Developer