gpt4 book ai didi

node.js - Nodejs SendGrid CORS 请求被阻止

转载 作者:行者123 更新时间:2023-12-04 10:15:45 26 4
gpt4 key购买 nike

我不精通 Node.js、react 等,有以下问题:

我有一个函数在从网页上的表单提交时调用,如下所示(出于隐私目的,我省略了一些细节):

class Email extends React.Component{

constructor(props){
super(props);

this.state = {
subject: "",
message: ""
};

}

handleUpdateSubjectLine(evt){
this.setState({ subject: evt.target.value});
}

handleUpdateMessageBox(evt){

this.setState({ message: evt.target.value});
}


async handle_email(evt){


var sgMail = require('@sendgrid/mail');
var subject = this.state.subject;
var message = this.state.message;
sgMail.setApiKey(process.env.SENDGRID_API_KEY);
console.log("subject txt: " + subject);
console.log("msg txt: " + message);
var msg = {
to: 'OMMITED',
from: 'OMMITED',
subject: subject,
text: message,
};

sgMail.send(msg).catch(err =>{
console.log(err);
});
console.log("Message Allegedly Sent!");

}

当检查我的收件箱以查找上述表格生成的测试电子邮件时,我不仅没有看到任何电子邮件,网络浏览器还会显示以下消息:

跨源请求被阻止:同源策略不允许读取位于 https://api.sendgrid.com/v3/mail/send 的远程资源。 (原因:CORS header “Access-Control-Allow-Origin”与“https://sendgrid.api-docs.io”不匹配)。

跨源请求被阻止:同源策略不允许读取位于 https://api.sendgrid.com/v3/mail/send 的远程资源。 (原因:CORS请求没有成功)

我从 npm 安装了 cors@sendgrid/mail 并且似乎无法弄清楚如何将上述应用到此api 调用,尽管在 YouTube 上看到其他人实现了它。

谢谢!

最佳答案

不允许直接从浏览器前端 (React) 应用程序发送。 (CORS 将阻止请求。)您需要创建一个 Node.js 服务器(我使用 Next JS)并处理从您的服务器发送电子邮件(通过 SendGrid API )。这里有两个关于如何处理这个问题的非常好的教程:

使用 SendGrid:

https://docs-git-success-185-add-nextjs-sengrid-guide.zeit.now.sh/guides/deploying-nextjs-nodejs-and-sendgrid-with-zeit-now

使用 Nodemailer:

https://medium.com/the-couch/adding-a-contact-form-to-your-next-js-app-7a1b5f63f27

关于node.js - Nodejs SendGrid CORS 请求被阻止,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61067224/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com