Это серия заметок об исследовании Google Cloud Platform:

Домен, SSL и сайт Google (№1)

Как развернуть веб-приложение Flutter с помощью Google AppEngine (№2)

Как развернуть веб-приложение Flutter с помощью Google Cloud Run (№3)

Как развернуть веб-приложение Flutter с помощью Google Compute Engine (№4)

Google предоставляет различные варианты веб-хостинга: Compute Engine, App Engine, Kubernetes, firebase, Cloud Run и облачные функции. Приведенная ниже таблица может помочь вам принять решение.

+--------------+---------------------------------------+
| Static site  | Cloud storage, Firebase hosting       |
+--------------+---------------------------------------+
| Dynamic site | Compute Engine, App Engine, Cloud Run |
+--------------+---------------------------------------+

В этой статье я продемонстрирую развертывание веб-приложения Flutter с использованием Compute Engine, и вы сможете разместить с ним свой проект Flutter, если выполните его.

  1. Создать проект Google Cloud
  2. Создать экземпляр виртуальной машины
  3. Разверните стек LAMP на вашем экземпляре
  4. Создайте веб-приложение Flutter
  5. Разверните WebApp на своем сервере
  6. Защитите сервер Apache с помощью сертификата SSL

1. Создайте проект Google Platform.

Сначала перейдите в Google Cloud Platform, чтобы создать проект.

Google предоставляет новым пользователям бесплатный кредит в размере 300 долларов США на 90 дней, чтобы они могли попробовать пакет GCP, поэтому, даже если вам нужно настроить биллинг, с вас не будет взиматься плата, если вы останетесь в пределах своей бесплатной квоты. Но я бы порекомендовал настроить оповещения о бюджете, чтобы следить за своими расходами. Вы можете навсегда отключить его на время разработки и включить сервер ядра приложений по запросу одним щелчком мыши.

Теперь, когда у нас есть проект с Google Cloud, следующим шагом будет установка Google Cloud SDK, чтобы вы могли выполнять действия из инструмента командной строки:

./google-cloud-sdk/install.sh
./google-cloud-sdk/bin/gcloud init

Обновите компонент:

gcloud components update

2. Compute Engine

Безопасный и настраиваемый вычислительный сервис, который позволяет создавать и запускать виртуальные машины в инфраструктуре Google. (Cloud.google.com/compute)

  • Перейдите в Google Cloud Platform ›Меню навигации› Compute Engine ›Экземпляр ВМ› Создать экземпляр

  • В поле имени введите имя вашей виртуальной машины, которое должно быть глобально уникальным. Далее следует выбрать тип машины. Если вы пробуете Compute Engine для тестирования, то e2-micro будет достаточно. В разделе брандмауэра выберите Разрешить трафик HTTP и HTTPS.

  • Разверните раздел Управление, безопасность, диски, сеть, единоличное владение, нажмите Сеть и добавьте свой домен (example.com) в разделе Имя хоста (этот шаг не является обязательным).

Подождите несколько минут, пока ваша виртуальная машина настроится.

  • Зарезервировать статический IP

Перейдите в Cloud Platform ›Меню навигации› Сеть ›Сеть VPC› Внешние IP-адреса, измените тип IP-адреса на статический.

3. Разверните стек LAMP на своем экземпляре.

Стек «LAMP» - это группа программного обеспечения с открытым исходным кодом, которое обычно устанавливается вместе, чтобы сервер мог размещать динамические веб-сайты и веб-приложения. Этот термин на самом деле является аббревиатурой, обозначающей операционную систему L inux, веб-сервер A pache, базу данных M ySQL и P HP. (digitalocean.com)

  • Перейти к экземпляру ВМ ›SSH; запустит терминал на новой странице.

  • Установить ЛАМПУ
sudo apt-get update
sudo apt-get install apache2 php libapache2-mod-php
  • Откройте браузер и введите HTTP: // [ваш-внешний-IP-адрес].

sudo sh -c 'echo "<?php phpinfo(); ?>" > /var/www/html/phpinfo.php'

  • Установите базу данных MariaDB на свой экземпляр и запустите БД.
sudo apt-get update
sudo apt-get install mariadb-server php php-mysql
sudo systemctl start mariadb

** на данном этапе ваш сайт не установлен с сертификатом SSL; следовательно, подключение через HTTPS будет

  • Настроить сопоставление DNS

Было бы лучше, если бы вы сопоставили свой домен с сайта хостинга домена. В моем случае я купил домен у Google; поэтому я могу связать его, перейдя в Google Домен ›DNS› Сервер имен ›Пользовательские записи ресурсов. Здесь вам нужно создать дополнительный поддомен, используя «www.»

4. Создайте веб-приложение Flutter.

* Предварительные требования: IDE IntelliJ или VS Code со средой сборки Flutter

Создайте новый проект Flutter с поддержкой Android / iOS / Web или используйте существующий проект Flutter, если он у вас есть. Выполните следующую команду, убедившись, что вы можете создавать и просматривать веб-страницу локально с помощью localhost: 8080

flutter build web

Ваш проект Flutter должен содержать новую папку Build ›Web с файлами index.html и main.dart.js после выполнения этой команды.

5. Разверните WebApp на своем сервере.

Есть разные способы загрузки файлов с вашего локального компьютера на сервер; здесь я буду использовать функцию загрузки файла из экземпляра Google VM.

  • заархивируйте папку build / web / со своего локального компьютера (web.zip)
  • Перейдите к своей виртуальной машине и нажмите ssh ›инструменты› загрузить файл.

  • Установите unzip в свой экземпляр виртуальной машины
sudo apt-get install unzip
  • Переместите web.zip в var / www / html
sudo mv web.zip /var/www/html
sudo unzip web.zip
cd web
sudo mv * ../
cd ..
sudo rm -r web
  • Перейдите на свой сайт HTTP: // [vash-domen]

6. Защитите сервер Apache с помощью сертификата SSL.

Заметили, что рядом с вашим доменом есть треугольный значок, это означает, что сайт небезопасен? Это потому, что мы еще не настроили сертификат SSL. Я буду использовать Let's Encrypt, центр сертификации, который предоставляет бесплатные сертификаты TLS / SSL для шифрования HTTPS на веб-серверах.

  • Установите Apache2
sudo apt update
sudo apt install apache2
sudo a2enmod http2
  • Установите Certbot и давайте зашифруем SSL CERT
sudo apt-get install python-certbot-apache
sudo certbot --apache -m [YOUR-EMAIL] -d [YOUR-DOMAIN] -d www.[YOUR-DOMAIN]

** sudo certbot - apache -m [email protected] -d test.com -d www.test.com

Выберите вариант 2, чтобы перенаправить весь трафик через HTTPS.

Congratulations! You have successfully enabled https://test.com and
https://www.test.com
...

Должен быть создан новый файл конфигурации для домена.

/etc/apache2/sites-available/your-domain-le-ssl.conf
  • Включить HTTP / 2 на сайте Apache
sudo vi /etc/apache2/apache2.conf

Добавьте «Протоколы h2 http / 1.1» в конец файла (без кавычек), сохраните и закройте редактор vi.

  • Перезагрузите Apache
sudo systemctl reload apache2.service

Поздравляю! Теперь ваш сайт должен работать с вашим доменом.

☀️ 🌤 ⛅️ 🌥 ☁️ ДАЛЕЕ (и в произвольном порядке) 🌦 🌧 ⛈ 🌩 🌨