Введение в Server Side Dart с Aqueduct

ОБНОВЛЕНИЕ: К сожалению, мне пришлось сократить эту серию, потому что разработка Aqueduct была прекращена. Я рекомендую вам не использовать Акведук. Я верю, что появятся и другие серверные фреймворки Dart, но на данный момент явного победителя нет. А пока ознакомьтесь с моей серией статей Создание сервера Dart с нуля.

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

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

И если ваша бессерверная настройка Firebase вам подходит, не позволяйте мне отговаривать вас.

Вступление

Хорошо, все остальные ушли? Только ты и я, читатель. Не так давно я был таким же, как ты. Я знал Flutter, но у меня не было опыта создания внутреннего сервера. Что ж, позвольте мне сказать вам, что вам понравится Server Side Dart. Возможность кодировать на одном языке в вашем внешнем приложении Flutter и на вашем внутреннем сервере значительно сокращает время обучения. Переход между ними почти ничем не отличается от открытия двух разных файлов в одном проекте.

Язык, который мы будем использовать для создания сервера, - это Dart, но если вам интересно узнать, почему я выбрал фреймворк Aqueduct, вы можете прочитать мою предыдущую статью по ссылке ниже.



Фреймворки HTTP-серверов для Dart
Поиск надежного способа создания серверной части на знакомом языке



Изначально я собирался опубликовать этот платный курс на Udemy. Я успел снять все видео, но это заняло слишком много времени, и мне нужно было перейти к другим проектам. Видео просто сидели и ничего не делали, поэтому я решил загрузить их на YouTube. Я буду вставлять их в эти письменные уроки, чтобы дополнить то, что пишу. Вы можете полностью пропустить эти письменные руководства, но преимущество здесь в том, что будет проще копировать и вставлять фрагменты кода по ходу работы. Кроме того, мне будет проще обновлять любые ошибки в написанном содержании.

Вот первое видео, если вы предпочитаете слушать чтение:

Предварительный просмотр содержимого

В этой серии статей я расскажу, как настроить безопасный сервер в качестве бэкэнда для вашего приложения Flutter. (Если я скажу вам сделать что-то небезопасное, оставьте комментарий, чтобы предупредить других и научить меня.)

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

  1. Начало работы (вы здесь). В этой статье вы настроите среду разработки. Это будет включать в себя установку Dart и Aqueduct, что вы сделаете за секунду.
  2. HTTP-запросы: узнайте, как создавать и обрабатывать сетевые HTTP-запросы, такие как GET, POST, PUT и DELETE.
  3. База данных: Aqueduct использует базу данных PostgreSQL. Не волнуйтесь, если это для вас в новинку. Если вы в целом знакомы с базами данных, вам не придется долго учиться.
  4. Тестирование. Следующим шагом будет модульное тестирование. Чем больше я расту как разработчик, тем больше я начинаю любить модульное тестирование. Самое замечательное в тестировании на бэкэнде заключается в том, что здесь нет пользовательского интерфейса, с которым можно было бы иметь дело.
  5. Аутентификация: узнайте, как аутентифицировать пользователей с помощью OAuth2, чтобы только авторизованные пользователи могли получить доступ к определенным частям сервера.
  6. Рабочий сервер: узнайте, как перенести все, что вы делали на локальном компьютере, на настоящий сервер.
  7. Клиентское приложение Flutter. Создайте простое приложение Flutter, которое использует серверный REST API для связи с ним.

Благодаря всем этим урокам мы создадим словарное приложение. Отчасти (ладно, в основном) потому, что я действительно хочу этим заняться когда-нибудь. Но он также является хорошим примером множества функций, которые вам понадобятся в вашем собственном серверном приложении. Вы можете просто изменить детали в соответствии с вашими требованиями. (Недавно я даже смотрел свои собственные видео, чтобы заново изучить концепции, пока я создаю бэкэнд для другого проекта.)

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

Установить Dart

Установите Dart SDK, перейдя на официальный сайт Dart. Там вы найдете конкретные инструкции по установке на Mac, Linux и Windows. Если у вас уже установлена ​​последняя версия Flutter, вы можете пропустить этот шаг, потому что Flutter включает Dart SDK.

Убедитесь, что у вас установлен Dart, выполнив в терминале следующую команду:

dart --version

На момент написания этой статьи моя версия Dart - 2.10.4.

Если ваша система не распознала команду Dart, убедитесь, что Dart или Flutter находятся в вашем PATH. Например, в Mac и Linux вы можете сделать это из командной строки следующим образом:

echo $PATH

Если на пути нет Dart или Flutter, то вам нужно его добавить.

Настройка IDE

Я недавно перешел на использование Visual Studio Code, но видео по-прежнему показывают IntelliJ. Используйте все, что вам нравится. Если вы являетесь пользователем Android Studio, вы будете чувствовать себя как дома в IntelliJ, поскольку именно на нем основана Android Studio. Загрузка бесплатной версии IntelliJ от сообщества подходит для разработки Dart.

Установите плагин Dart

Какую бы IDE вы ни использовали, установите плагин Dart:

  • Если вы используете VS Code, нажмите кнопку« Расширения на боковой панели» и найдите Dart.
  • Для IntelliJ в окне запуска выберите Настроить ›Плагины› Торговая площадка и найдите Dart. Если у вас уже открыт проект IntelliJ, вы можете перейти в Настройки ›Плагины, чтобы сделать то же самое.

Мы не собираемся создавать новый проект в среде IDE. Мы воспользуемся Акведуком, чтобы сделать это буквально через минуту.

Установить Акведук

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

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

Чтобы установить Aqueduct, введите в терминале следующую команду:

pub global activate aqueduct

Вы, вероятно, получите сообщение с предложением добавить акведук на свой путь. Как только вы это сделаете и перезапустите терминал, вы сможете запускать команды Aqueduct в командной строке.

Введите следующее:

aqueduct --version

На момент написания этой статьи я использую Aqueduct версии 3.2.1. Опять же, если aqueduct не распознается вашей оболочкой, вам нужно добавить его в путь и перезапустить терминал.

Создать новый проект

В терминале cd в любое место, где вы хотите создать свой проект.

В исходной версии этой статьи я рекомендовал структурировать файлы на стороне сервера и клиента, как показано ниже, и использовать единый репозиторий GitHub. Вы все еще можете использовать эту файловую структуру, но теперь я рекомендую вам использовать два разных репозитория для клиента и сервера. При развертывании сервера проще использовать git clone, если у сервера есть собственный репозиторий.

my_project
  my_project_server
    (Aqueduct files here)
  my_project_client
    (Flutter files here)

В этой серии я назову проект Aqueduct dart_server. Создайте это так:

aqueduct create dart_server

В IntelliJ (или VS Code) откройте папку dart_server. Если вы получили сообщение о включении Dart для вашего проекта, сделайте это.

REST API и HTTP-методы

Только что созданный вами сервер является HTTP-сервером. Вы будете использовать его для создания REST API для обмена данными с вашим приложением Flutter. Если какие-либо из этих терминов вам незнакомы, прочтите следующую статью, которую я написал в качестве дополнения к этой серии:



«REST API и HTTP-методы
Дополнительная статья к курсу" Server Side Dart как бэкэнд Flutter medium.com "



Запускаем сервер

На этом этапе вы уже создали сервер акведука. Однако, прежде чем закончить этот модуль, вы собираетесь протестировать сервер.

В своей среде IDE откройте файл pubspec.yaml в корне проекта dart_server. Поскольку файловая структура так похожа на Flutter, это уже кажется знакомым, не так ли?

Измените описание на следующее:

description: Aqueduct dictionary application

И измените автора на свое имя и адрес электронной почты:

author: Suragch <[email protected]>

В терминале запустите сервер Aqueduct, выполнив следующую команду в корневой папке вашего проекта:

aqueduct serve

В терминале вы должны увидеть следующий вывод:

-- Aqueduct CLI Version: 3.2.1
-- Aqueduct project version: 3.2.1
-- Preparing...
-- Starting application 'dart_server/dart_server'
    Channel: DartServerChannel
    Config: /Users/.../dart_server/config.yaml
    Port: 8888
[INFO] aqueduct: Server aqueduct/1 started.  
[INFO] aqueduct: Server aqueduct/2 started.

Ваш сервер запущен!

Примечания:

  • Порт - 8888. Это порт по умолчанию для Акведука.
  • aqueduct/1 и aqueduct/2 - это два разных экземпляра сервера. Они работают на двух разных изолятах Dart, поэтому они не разговаривают друг с другом. Наличие двух из них, работающих одновременно, позволяет обрабатывать больше одновременных подключений и лучше использовать многоядерное оборудование ЦП.

Вы можете остановить сервер, нажав Ctrl+C, но пока не делайте этого. Вы собираетесь протестировать сервер, отправив запрос GET.

Протестируйте сервер

Откройте любой браузер и в адресной строке введите следующий адрес:

http://localhost:8888/

Вы используете localhost, потому что сервер работает на вашем собственном компьютере, и, как я упоминал выше, 8888 - это порт, который использует Aqueduct для связи.

После ввода этого адреса вы получите 404 Not Found ошибку:

Собственно, это хорошо, потому что означает, что сервер работает. Это сообщение об ошибке вызвал именно акведук. Все это означает, что вы не определили маршрут для localhost:8888/.

В своей среде IDE откройте lib / channel.dart.

Внизу файла вы должны найти router объект.

router
  .route("/example")
  .linkFunction((request) async {
    return Response.ok({"key": "value"});
  });

Ах, вы можете видеть, что определенный маршрут - /example. Попробуем это в браузере:

http://localhost:8888/example

Это сработало! Сервер вернул пару "ключ-значение" JSON для маршрута /example. Когда браузеры посещают адрес, они незаметно отправляют GET-запрос. В следующем разделе вы не только создадите и обработаете больше запросов GET, но также POST, PUT и DELETE.

Перейдите к Часть 3: Обработка HTTP-запросов ›››