Я использую функции netlify для отправки электронной почты из внешнего интерфейса, и он отлично работает... так как он отправляет электронную почту.
Однако на стороне клиента (браузера) я не могу получить никакого ответа. Мне нужен базовый ответ, который позволил бы мне сделать, if (status==="success") displayMessage()
но я не могу получить никакого ответа в браузере.
Я получаю это сообщение Uncaught (in promise) SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
. Однако при отправке запроса через POSTMAN я получаю ответ «Электронное письмо отправлено успешно», которое является основной частью ответа обратного вызова.
Вот функция, которую я использую в.netlify/functions/sendMail.
const nodemailer = require("nodemailer");
exports.handler = function (event, context, callback) {
const mailConfig = {
host: "smtp.mailgun.org",
port: 465,
secure: true,
auth: {
user: process.env.MAILGUN_USER,
pass: process.env.MAILGUN_PASSWORD,
},
};
const transporter = nodemailer.createTransport(mailConfig);
transporter.verify((error, success) => {
if (error) {
console.log(error);
} else {
console.log("Ready to send emails");
}
});
const messageData = JSON.parse(event.body);
const { email, name, mobile, message, subject, recipient } = messageData;
console.log(messageData);
const mailOptions = {
from: email,
to: recipient,
subject: subject,
text: message,
};
transporter.sendMail(mailOptions, (error, success) => {
if (error) {
console.log(error);
callback(error);
} else {
console.log("email sent");
callback(null, {
statusCode: 200,
body: "Email sent successfully",
});
}
});
};
и на стороне клиента у меня есть это
const form = document.querySelector("#message");
const submitMessage = (event) => {
event.preventDefault();
const formData = new FormData(form);
formData.append("recipient", "testing@gmail.com");
formData.append("subject", "Submission from website");
const messageData = Object.fromEntries(formData);
console.log(messageData);
const url = ".netlify/functions/sendMail";
const options = {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(messageData),
};
fetch(url, options)
.then((response) => response.json())
.then((data) => console.log(data));
};
form.addEventListener("submit", submitMessage);
в запросе на выборку я ожидал data
получить ответ, чтобы я мог вызвать какое-то действие, чтобы отобразить сообщение об успешном завершении.
Может ли кто-нибудь посоветовать мне, что я делаю неправильно здесь?
Решение проблемы
Я понял, что я делал неправильно, и вот решение, если кто-то еще столкнется с теми же проблемами.
В обратном вызове функции netlify я отправлял тело в виде текста
callback(null, {
statusCode: 200,
body: "Email sent successfully",
});
но в запросе на выборку на стороне клиента я рассматривал его как json
fetch(url, options)
.then((response) => response.json())
.then((data) => console.log(data));
Таким образом, в основном я мог бы либо использовать a response.text()
вместо response.json()
запроса на выборку, либо использовать JSON.stringify
и возвращать объект JSON из обратного вызова. Я предпочел JSON.stringify
вариант, как показано ниже для обратного вызова
callback(null, {
statusCode: 200,
body: JSON.stringify({
status: "success",
message: "Email sent successfully",
}),
});
Комментариев нет:
Отправить комментарий