Краткое руководство по этому удивительному функционалу
В прошлый раз я создал статью под названием «Как подключить Flutter к Node.js». Это была моя лучшая написанная статья, поэтому я решил написать еще одну статью.
В этом уроке я покажу вам, как вы можете отправлять данные в и из PHP.
Прежде чем мы начнем это руководство, на вашем ПК должны быть установлены Flutter и PHP. Вот несколько ссылок:
- XAMPP (PHP): https://www.apachefriends.org/download.html
- Флаттер: https://docs.flutter.dev/get-started/install
После того, как вы их успешно установили, мы можем приступить к созданию нового проекта Flutter. Наша первая цель будет очень простой — получение данных из Интернета.
С помощью этой команды вы можете создать новый проект Flutter и установить все пакеты, которые вы будете использовать в этом руководстве:
flutter create phptut && cd phptut && flutter pub add http && flutter run
Если это было установлено, вы можете открыть эту папку в своей любимой среде IDE и начать кодирование.
Мне нравится использовать VS Code, но это мое предпочтение.
Флаттер
Теперь вы можете открыть lib/main.dart. Это место, где мы можем создать наш проект дротика. Мне нравится избавляться от всего ненужного нам хлама, поэтому это выглядит так:
Я также создал сообщение String, которое мы собираемся использовать позже. Нам нужно импортировать пакет «http» в наш файл main.dart, чтобы убедиться, что мы можем его использовать.
Мы также собираемся использовать другой пакет под названием dart:convert. Это гарантирует, что мы сможем декодировать данные в JSON.
import ‘package:http/http.dart’ as http; import 'dart:convert';
Итак, теперь, когда все настроено, нам нужно создать новую функцию с именем initState(). В initState() мы также будем вызывать нашу функцию getData(), которую мы создадим позже.
Итак, давайте теперь создадим функцию getData(). Эта функция — место, где мы собираемся собирать данные из Интернета.
Мы можем собирать данные с этого веб-сайта: https://jsonplaceholder.typicode.com/albums/1, и это именно то, что мы собираемся сделать!
Вот и все. Все настроено на запуск. Итак, давайте запустим это с помощью команды. Если все правильно, то должно работать нормально.
flutter run
Теперь ваше приложение должно сказать «quidem molestiae enim».
Теперь мы можем создать наш бэкенд. В этом уроке наш бэкенд будет очень простым.
Наша цель — передавать данные туда и обратно. Вот почему мы будем повторять данные, полученные нашим бэкэндом.
PHP
Теперь давайте создадим новый файл для нашего бэкенда PHP. Поскольку мы используем XAMMP, нам нужно создать новую папку в нашей папке htdocs.
Я назову свою новую папку phptut и добавлю файл с именем index.php. Вот и все!
Как я уже сказал, это будет очень просто.
В этом файле мы собираемся проверить, действительно ли существует $_POST[“msg”]. Когда он существует, мы повторяем полученное сообщение.
Просто и легко 😏.
Флаттер
Теперь, когда мы успешно создали серверную часть, которая отправляет данные, мы можем приступить к созданию нашего приложения.
В этом приложении мы собираемся отправить сообщение нашему серверу. Поэтому нам нужно немного изменить наш пользовательский интерфейс и создать новый String с именем _newMessage.
Итак, вот как выглядит наш новый интерфейс. Вам легко понять! Далее нам нужно найти способ поговорить с нашим сервером. Во-первых, нам нужно изменить наш URL-адрес. Для iOS это будет:
http://localhost/phptut/index.php
А для Android это:
http://10.0.2.2/phptut/index.php
Мне нравится придерживаться iOS, потому что мне это нравится немного больше. Во-вторых, мы должны изменить наш запрос с GET на POST. Это потому, что мы сейчас отправляем данные на наш сервер. Наконец, мы хотим отправить данные на наш сервер. Поэтому мы собираемся использовать request.bodyfields.
Это все, что вам нужно было сделать, чтобы связать ваше приложение Flutter с PHP. Теперь вы, наверное, думаете: «Что я могу с этим сделать»? И ответ — много! Что делает PHP действительно хорошим, так это MySQL. Это действительно простая и интересная база данных.
Репозиторий GitHub выглядит следующим образом:
Спасибо, что прочитали мою статью. Если вам нужна помощь, пожалуйста, отправьте мне сообщение.
