大佬教程收集整理的这篇文章主要介绍了从 rails/react 应用程序中的联系表单获取重复的电子邮件，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我使用 SendgrID 在我的 rails/react 应用程序中添加了一个联系表单。一切正常，但每次通过联系表提交某些内容时，我都会收到 3-5 封电子邮件。他们中的一些人缺少联系表格中的数据。我无法在我的代码中发现这些重复的电子邮件。
前端的联系表单：
import React,{ useState } from "react";
import { Redirect } from "react-router-dom";
import _ from "lodash";
import ErrorList from "../utilitIEs/ErrorList";
export const contactForm = () => {
let defaultFIElds = {
name: "",email: "",subject: "",message: "",};
const [message,setmessage] = useState(defaultFIElds);
const [errors,setErrors] = useState({});
const [successmessage,setsuccessmessage] = useState();
if (successmessagE) {
return <Redirect to="/success" />;
}
const newmessage = (formData) => {
fetch("/API/v1/contact",{
method: "POST",body: JsON.Stringify(formData),credentials: "same-origin",headers: {
Accept: "application/Json","Content-Type": "application/Json",},})
.then((responsE) => {
if (response.ok) {
return response;
} else {
let errormessage = `${response.status} (${response.statusText})`,error = new Error(errormessagE);
throw error;
}
})
.then((responsE) => response.Json())
.then((body) => {
if (body.sent) {
setsuccessmessage(true);
} else {
setsuccessmessage(false);
}
})
.catch((error) => console.error(`Error in fetch: ${error.messagE}`));
};
const handleChange = (event) => {
setmessage({
...message,[event.currentTarget.name]: event.currentTarget.value,});
};
const valIDForSubmission = () => {
let submitErrors = {};
const requiredFIElds = ["name","email","subject","message"];
requiredFIElds.forEach((fIEld) => {
if (
message[fIEld].trim() === "" ||
message[fIEld].trim() === "" ||
message[fIEld].trim() === "" ||
message[fIEld].trim() === ""
) {
submitErrors = {
...submitErrors,[fIEld]: "is blank",};
}
});
setErrors(submitErrors);
return _.isEmpty(submitErrors);
};
const handlesubmit = (event) => {
event.preventDefault();
if (valIDForSubmission()) {
newmessage(messagE);
newmessage(defaultFIElds);
}
};
return (
<section classname="section">
<div classname="container">
<form onsubmit={handlesubmit} classname="new-post-form callout">
<ErrorList errors={errors} />
<div classname="fIEld">
<label classname="label">
name:
<div classname="control">
<input
classname="input"
type="text"
placeholder="Please enter your name"
name="name"
ID="name"
onChange={handleChangE}
value={message.namE}
/>
</div>
</label>
</div>
<div classname="fIEld">
<label classname="label">
Email:
<div classname="control">
<input
classname="input"
type="text"
placeholder="Please enter your email address"
name="email"
ID="email"
onChange={handleChangE}
value={message.email}
/>
</div>
</label>
</div>
<div classname="fIEld">
<label classname="label">
Subject:
<div classname="control">
<input
classname="input"
type="text"
placeholder="Please add a message subject"
name="subject"
ID="subject"
onChange={handleChangE}
value={message.subject}
/>
</div>
</label>
</div>
<div classname="fIEld">
<label classname="label">
message:
<div classname="control">
<textarea
classname="textarea"
placeholder="Add your message here"
name="message"
ID="message"
onChange={handleChangE}
value={message.messagE}
></textarea>
</div>
</label>
</div>
<div classname="fIEld is-grouped">
<div classname="control">
<button classname="button is-link">submit</button>
</div>
<div classname="control">
<button classname="button is-link is-light">Cancel</button>
</div>
</div>
</form>
{successmessage === false && (
<div classname="blog-flex">
<p>Sorry your message Couldn't be sent. Please try again and make sure all fIElds are filled out.</p>
</div>
)}
</div>
</section>
);
};
export default ContactForm;
从联系表单提交的数据点击contact_controller
require 'pry'
class API::V1::ContactController < APIController
before_action :contact_params,only: [:create]
def create
@message = contact_params
ContactForm.send_message_email(@messagE).deliver
if ContactForm.send_message_email(@messagE).deliver
render Json: {sent: truE}
else
render Json: {sent: falsE}
end
end
protected
def contact_params
params.require(:contact).permit([:name,:email,:subject,:message])
end
end
应用程序/邮件程序中的联系表单
require 'pry'
class ContactForm < ApplicationMailer
default :from => 'info@maddoxgreyauthor.com'
# send email from contact form
def send_message_email(messagE)
@message = message
mail( :to => 'info@maddoxgreyauthor.com',:subject => 'New message From Maddox Grey Author' )
end
end
最后，电子邮件的布局。这是在 app/vIEws/contact_forms/send_message_email.HTMl.erb
<!DOCTYPE HTML>
<HTML>
<head>
<Meta content='text/HTML; charset=UTF-8' http-equiv='Content-Type' />
</head>
<body>
<h1>New message received from <%= @message["name"] %>!</h1>
<p>Email: <%= @message["email"] %></p>
<p>Subject: <%= @message["subject"] %></p>
<p>message: <%= @message["message"] %></p>
</body>
</HTML>
在这里，您发送了两次电子邮件：
def create
@message = contact_params
ContactForm.send_message_email(@messagE).deliver #<--- once
if ContactForm.send_message_email(@messagE).deliver #<--- twice
render json: {sent: truE}
else
render json: {sent: falsE}
end
end
执行以下操作至少应该有助于处理其中一封重复的电子邮件：
def create
@message = contact_params
send_email = ContactForm.send_message_email(@messagE).deliver
if send_email
render json: {sent: truE}
else
render json: {sent: falsE}
end
end
或者更节省空间的解决方案：
def create
render json: {sent: !!ContactForm.send_message_email(contact_params).deliver}
end
其次，您还两次调用 API 函数：
const handleSubmit = (event) => {
event.preventDefault();
if (validForSubmission()) {
newmessage(messagE); //<-- Once
newmessage(defaultFields); //<-- Twice
}
};
以上是大佬教程为你收集整理的从 rails/react 应用程序中的联系表单获取重复的电子邮件全部内容，希望文章能够帮你解决从 rails/react 应用程序中的联系表单获取重复的电子邮件所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。