Автор оригинала: Andrei Zgirvaci.
Сегодня я впервые попробовал использовать AWS Amberify в моем новом проекте Trustio.co Отказ Я впечатлен тем, сколько вещей вы можете сделать по сравнению с Firebase, но в то же время я также немного разочарован, так как документация не так хорошая.
Например, одно использование случая, когда я пытался обрабатывать Signin Ошибки, которые на мой взгляд – довольно базовая вещь. Вместо того, чтобы найти ответы в своей документации, я должен был найти их на Stackoverflow Отказ
Например, если мне пришлось решить эту проблему с помощью FireBase Google, я бы только что нашел, что это объяснило в их Документы , вскоре и четко:
В конце концов, я отказался и решил использовать их Компоненты пользовательского интерфейса Как это может сэкономить меня много времени! Но оказалось, что у него есть собственные подводные камни …
После быстрого связывания их компонента с моим приложением я потратил еще несколько часов, почему С карунтикатором не примет мой Тема параметр
Обновление: AWS Amplify Team достигла меня в тот же день, когда эта статья была опубликована, исправлена ошибка и выпустила новую версию AWS-Amplify-React – Nature: 4.3.2, которая содержит исправление ошибки (64357B1). Ужин отзывчивый! Куддос к ним! 🔥.
В их документации ясно показано, что я могу пройти Тема параметр во втором параметрах С карунтикатором Компонент, который должен быть определен в объекте:
Оказывается, это не то, как он на самом деле работает в их кодовой базе!
Отказ от ответственности: Подготовьтесь к грязной работе … 🧐.
Давайте посмотрим на фактический Компонент :
export function withAuthenticator( Comp: React.ComponentType , includeGreetings = false, authenticatorComponents = [], federated = null, theme: AmplifyThemeType = null, signUpConfig: ISignUpConfig = {} ) { if (typeof includeGreetings === 'object' && includeGreetings !== null) { this.authConfig = Object.assign(this.authConfig, includeGreetings); } else { this.authConfig = { includeGreetings, authenticatorComponents, signUpConfig, };
Итак, мы можем ясно видеть, что наши С карунтикатором Компонент принимает несколько параметров, один из которых является Тема параметр Кроме того, вы можете увидеть, если утверждение, которое в основном говорит, что в случае второго параметра – Включить редуги в С карунтикатором Указывается как объект, мы будем относиться к этому как параметр с несколькими вариантами внутри. Если нет, то мы просто будем предположить, что пользователь хочет указать параметры по запятую вместо этого. Все идет нормально!
* Тем не менее, я не так доволен этой реализацией, как это довольно несовместимо. Было бы лучше, если бы второй параметр был лишь объектом, чтобы сохранить вещи, а не путать людей. Более того, это не документировано нигде, поэтому я должен был обнаружить это сам, который не является хорошим знаком …
Хорошо, давайте перейдем дальше …
Если мы прокрутим вниз, мы видим, что в конце концов, С карунтикатором это просто обертка вокруг Аутентификатор составная часть. Но…!
return (0 } signUpConfig={this.authConfig.signUpConfig} onStateChange={this.handleAuthStateChange} children={this.authConfig.authenticatorComponents} usernameAttributes={this.authConfig.usernameAttributes} theme={theme} /> );
Вы можете увидеть, что тема опора Аутентификатор взят из нашего С карунтикатором реквизит напрямую! Не из this.authconfig объект! Это создает проблемы, как вы можете подумать, что вы можете указать Тема опоры в объекте, и он будет использоваться Аутентификатор Компонент, как показано в официальном AWS Документация , но на самом деле, это не то, как это работает …
Итак, как вы это исправляете?
export default withAuthenticator(App, { includeGreetings: true, usernameAttributes: 'email', signUpConfig: AmplifySignUpConfig, }, undefined, undefined,
AmplifyTheme
});
Не лучшее решение, но действительно работает как Аутентификатор Компонент только что сделает Тема опоры от 4-го парамата С карунтикатором а не из 2-го парамата. 🤷♂️.
На данный момент вы можете спросить, почему бы вам просто использовать Аутентификатор Компонент и быть сделан уже … Ну, я не хочу показывать кнопку «Подпись после того, как пользователь зарегистрирован в приложении», но для этого мне придется Укажите вручную какие компоненты должны Аутентификатор есть и чего нет. Что в свою очередь добавляет больше кода и чувствует себя менее интуитивно понятно. Где в С карунтикатором Пример, я могу просто указать как это так: Включить редукты: false И это действительно легко переключать вещи в развитие.
Как один из Подкасла Я следул: сказал:
Если вы хотите что-то сделать, сверните рукава и доберитесь до работы!
Так что я мог бы просто пойти на официальное репо и открыть запрос на тягу или просто вопрос, если я ленивый 😁
Это всего лишь первый день, когда я работаю с AWS Amplify, так что, возможно, все станет легче оттуда или, может быть, нет … 😳 Но я верю, что AWS Amplify – лучший вариант, чем Firebase, так что, давайте посмотрим …
Если вы верите, что сделал ошибку, и это не вина AWS, пожалуйста, поправьте меня в комментариях! Очень ценит это!
Это за сегодня друзья! Я буду держать вас в курсе о вещах, которые я учусь по пути строительства Trustio.co приложение. До тех пор возьми удивительный отдых вашего дня! До завтра! 😊.
P.S 🤫 Я недавно начал подкаст под названием Тревожный разработчик Где я разделяю свои знания о том, как уменьшить стресс, стать более присутствующим и продуктивным в качестве разработчика. Я хотел бы услышать ваши мысли об этом! 😊.
Помните, вы достойны, вы любили и имеете дело! Хорошего дня! ❤️.