Javascript 在Next.js中处理承诺和错误处理
我对React和Next.js不熟悉,我正试图通过sendGrid从联系人表单发送电子邮件。为了得到我想要的东西,我结合了一些教程,但我显然不理解一些东西 使用Next.js,我有一个联系人表单/pages/contact.js onSubmit calls/pages/api/sendMail,它从utils/sendMailToMe.js导入函数sendMailToMe() 代码可以工作并发送电子邮件,但我似乎无法将结果从sendMailToMe()传递回sendMail.jsJavascript 在Next.js中处理承诺和错误处理,javascript,next.js,Javascript,Next.js,我对React和Next.js不熟悉,我正试图通过sendGrid从联系人表单发送电子邮件。为了得到我想要的东西,我结合了一些教程,但我显然不理解一些东西 使用Next.js,我有一个联系人表单/pages/contact.js onSubmit calls/pages/api/sendMail,它从utils/sendMailToMe.js导入函数sendMailToMe() 代码可以工作并发送电子邮件,但我似乎无法将结果从sendMailToMe()传递回sendMail.js /utils
/utils/sendMailToMe.js
const sendMailToMe = async (
fullName,
formMessage,
email
) => {
const mail = require('@sendgrid/mail');
mail.setApiKey(SENDGRID_API_KEY);
const msg = {
to: 'mike@mydomain.com',
from: 'mike@mydomain.com',
templateId: 'd-3481ff06ea924128baa7c16a5a7f4840',
dynamicTemplateData: {
subject: 'Testing Templates',
fullName: fullName,
message: formMessage,
},
};
mail.send(msg)
.then((response) => {
console.log('in response')
console.log(response[0].headers)
return response[0].statusCode
})
.catch((error) => {
console.log("there was an error")
console.error(error)
return 'test'+error
})
//return response;
}
export { sendMailToMe };
import { sendMailToMe } from "../../utils/sendMailToMe";
export default async function handler(req, res) {
if (req.method === "POST") {
const { email, fullName, message,test } = req.body;
if (
typeof (email || fullName || test || message) === "undefined"
) {
console.log(" ************* Invalid Data received ************ ");
return res
.status(400)
.send({ error: "bad request, missing required data!" });
} else {
// Data received as expected
console.log('Calling sendMailToMe')
const sendGridResult = await sendMailToMe(
fullName,
message,
email
)
.then((response)=>{console.log(response)}) //res.status(200).send({test: 'test'})})
.catch((err) =>{ console.log(err)})//res.status(400).send({error:"Error in Sendgrid", errMsg:err})})
// API returns here regardless of outcome
res.status(200).send({test: 'returning here on error or success'})
}
}else{
res.status(400).send({ error: "Must use POST method" });
}
//res.status(400).send({ error: "bad request somehow" });
}
这将按如下方式导入并调用到pages/api/sendMail.js
/utils/sendMailToMe.js
const sendMailToMe = async (
fullName,
formMessage,
email
) => {
const mail = require('@sendgrid/mail');
mail.setApiKey(SENDGRID_API_KEY);
const msg = {
to: 'mike@mydomain.com',
from: 'mike@mydomain.com',
templateId: 'd-3481ff06ea924128baa7c16a5a7f4840',
dynamicTemplateData: {
subject: 'Testing Templates',
fullName: fullName,
message: formMessage,
},
};
mail.send(msg)
.then((response) => {
console.log('in response')
console.log(response[0].headers)
return response[0].statusCode
})
.catch((error) => {
console.log("there was an error")
console.error(error)
return 'test'+error
})
//return response;
}
export { sendMailToMe };
import { sendMailToMe } from "../../utils/sendMailToMe";
export default async function handler(req, res) {
if (req.method === "POST") {
const { email, fullName, message,test } = req.body;
if (
typeof (email || fullName || test || message) === "undefined"
) {
console.log(" ************* Invalid Data received ************ ");
return res
.status(400)
.send({ error: "bad request, missing required data!" });
} else {
// Data received as expected
console.log('Calling sendMailToMe')
const sendGridResult = await sendMailToMe(
fullName,
message,
email
)
.then((response)=>{console.log(response)}) //res.status(200).send({test: 'test'})})
.catch((err) =>{ console.log(err)})//res.status(400).send({error:"Error in Sendgrid", errMsg:err})})
// API returns here regardless of outcome
res.status(200).send({test: 'returning here on error or success'})
}
}else{
res.status(400).send({ error: "Must use POST method" });
}
//res.status(400).send({ error: "bad request somehow" });
}
我正在尝试将mail.send()的结果返回到api,以便返回正确的响应。现在,即使mail.send()失败,sendMail.js也会返回200。控制台将响应或错误记录在sendMailToMe()中,但我无法将响应或错误返回到sendmail.js。任何指向正确方向的指针都值得赞赏。您的问题不在于next或react中的承诺,而在于此特定实用程序@sendgrid/mail的使用以及它是否适合react应用程序。这里最好回答:@SteveTomlin谢谢你提供的资源。我实际上更想理解异步函数的返回部分。sendgrid库工作得很好,所以我的问题更多的是想弄清楚为什么我不能“返回”响应。我确信这更多的是对异步/等待过程的理解不足,而不是对sendgrid实用程序的理解不足。我假设无论是使用@sendgrid/mail还是任何其他实用程序,我都会遇到同样的问题。你认为我的问题是针对公用事业的吗?我将尝试使用一个简单的fetch()替换sendgrid。我是新来的,非常感谢你的指导。