在下面的API resolved without sending a response for /api/contact, this may result in stalled request
路径上获取Next.js。它使用sendgrid,电子邮件被发送,但我没有得到回复,所以我可以处理错误或成功消息。
我已经用前端代码更新了下面的内容。我现在没有收到该错误,但在前端调用'const响应=等待获取(‘/api/联系人’.‘什么都不回
const sgMail = require('@sendgrid/mail');
sgMail.setApiKey(process.env.SENDGRID_APIKEY);
export default function handler(req, res) {
if (req.method === 'POST') {
const email = {
from: process.env.EMAIL_FROM,
to: process.env.EMAIL_TO,
subject: 'Website Contact Form',
html: `<div>
<div><strong>Name:</strong> ${req.body.name}<br/></div>
<div><strong>Phone:</strong> ${req.body.phone}<br/></div>
<div><strong>Email:</strong> ${req.body.email}<br/></div>
<div><strong>more:</strong> ${req.body.more}<br/></div>
</div>`,
};
try {
return sgMail
.send(email)
.then(() => {
console.log('res1', res);
//return res;
return res.status(200).end();
})
.catch((error) => {
console.log('error', error);
return res.status(500).send(error);
});
} catch (error) {
console.log('error 2', error);
res.json(error);
return res.status(405).end();
}
}
}
import React from 'react';
import { Formik, Form } from 'formik';
import * as Yup from 'yup';
import TextAreaField from './textAreaField';
import TextField from './textfield';
function ContactForm() {
return (
<Formik
initialValues={{
name: '',
phone: '',
email: '',
more: '',
}}
validationSchema={Yup.object({
name: Yup.string().required('Required'),
phone: Yup.string().required('Required'),
email: Yup.string().email('Invalid email address').required('Required'),
more: Yup.string().required('Required'),
})}
onSubmit={async (values, { setSubmitting }) => {
setSubmitting(true);
const response = await fetch('/api/contact', {
body: JSON.stringify({
name: values.name,
phone: values.phone,
email: values.email,
more: values.more,
}),
headers: {
'Content-Type': 'application/json',
},
method: 'POST',
});
console.log('response', response);
const data = await response.json();
console.log('response 1', data);
setSubmitting(false);
}}
>
{(props) => {
const { values, setFieldValue } = props;
console.log('props', props);
console.log('values', values);
return (
<div className="c-contact-form">
<Form className="form">
<TextField label="Customer Name" name="name" type="text" placeholder="John" />
<TextField label="Phone Number" name="phone" type="text" placeholder="07909765432" />
<TextField label="Email Address" name="email" type="email" placeholder="John@gmail.com" />
<TextAreaField label="More" name="more" placeholder="More details" />
<button type="submit" className="c-btn">
Submit
</button>
</Form>
{values.success && (
<div>
<p>Your enquiry has been successfully submitted.</p>
</div>
)}
{values.nosend && (
<div>
<p>OOPS, something went wrong but we know about it. please contact us via email or phone</p>
</div>
)}
</div>
);
}}
</Formik>
);
}
export default ContactForm;
发布于 2021-09-25 04:35:09
您需要发送一个响应,如下所示
try {
sgMail
.send(email)
.then(() => {
console.log('res', res.json);
return res.status(200).end();
})
.catch((error) => {
console.log('error', error);
return res.status(500).send(error);
});
https://stackoverflow.com/questions/69318691
复制相似问题