Недавно мне потребовалось реализовать контактную форму на одностраничном статическом веб-сайте. Поскольку серверной части нет, мне пришлось найти решение, как отправлять электронные письма из браузера.
В качестве почтового сервиса я решил использовать Mailgun, так как нашел хорошие отзывы и для использования он мне нужен - даже не одно письмо в день, оно должно быть бесплатным. Посмотрим через несколько месяцев :)
Вопрос был в том, как вызвать их api из клиентского javascript. Я не нашел никакого решения, только некоторые комментарии stackoverflow, что это невозможно из браузера.
Поэтому мне пришлось найти самое простое и быстрое решение, чтобы иметь какую-то внутреннюю часть, которая будет выполнять эту работу. Я обратился к функциям Google Cloud.
Одно из определений облачных функций - это то, что было именно моим случаем.
Запускайте свой код из сервисов Google Cloud или вызывайте его прямо из любого веб-приложения, мобильного приложения или серверного приложения. Облачные функции обеспечивают связующий уровень логики, который позволяет интегрировать и расширять Google Cloud и сторонние сервисы, позволяя быстро создавать бессерверные приложения, которые являются высокодоступными, безопасными и экономичными. "ссылка на сайт"
Итак, как этого добиться
- Вам нужно будет перейти в облачную консоль Google, создать проект, если у вас его еще нет, а затем в раздел Облачные функции.
2. Нажмите Создать функцию и настройте ее следующим образом.
- Дайте ему имя, в моем случае «моя-функция».
- Выберите триггер - HTTP, чтобы его можно было вызвать с помощью простого запроса POST.
- Установите флажок «Разрешить вызовы без аутентификации», чтобы можно было звонить анонимно с веб-сайта.
- Исходный код - встроенный редактор
- Время выполнения - node.js 10 (или самый последний)
3. Затем вы можете написать / скопировать код прямо в редактор. (небольшая подсказка, редактор может открываться в увеличенном виде).
У меня возникла проблема с вызовом его с моего веб-сайта с помощью CORS, поэтому сначала в функции я установил Allow-Origin (не забудьте изменить его только на свой домен, откуда он будет вызываться), а затем я проверяю, является ли тип запроса Options. В этом случае я возвращаю 204, чтобы браузер знал, что запрос POST будет принят.
4. Добавьте пакеты nodemailer-mailgun-transport и nodemailer в package.json
5. Я вставляю имя вызываемой функции. В этом случае его send.
6. Определите переменные среды API_KEY, TO, FROM, CC, DOMAIN.
7. Нажмите развернуть!
После успешного развертывания вы можете запустить тест прямо в интерфейсе Google Cloud functions.
или в Почтальоне например
Мне кажется, это хорошо.
Теперь последний шаг - реализовать его в моем интерфейсном JS-скрипте.
const axios = require('axios');
await axios.post(URL_OF_THE_FUNCTION', {
subject: 'Email subject',
message: `Body of the email in html format.`
});
И это все.
полный код здесь:
