Question

我有一个表单，其中提交了name，email和text。

React组件的onSubmit函数：

    onSubmit = e => {
    const { name, email, text } = this.state;

    axios.post('/feedback', { name, email, text })
          .then((result) => {
            console.log(result)
          }).catch(err => console.log(err))
}

feedback.js文件（api / feedback.js-可以正常工作，并且如果通过邮递员请求，则可以发送电子邮件）：

const express = require("express");
const router = express.Router();
const nodemailer = require("nodemailer");

// @route   POST api/feedback
// @desc    Tests resource route
// @access  Public
router.post("/", function(req, res, next) {
  let output = `<p>New feedback</p>
  <h3>Feedback details</h3>
  <ul>
    <li>Name: ${req.body.name}</li>
    <li>Email: ${req.body.email}</li>
  </ul>
  <h3>Feedback message</h3>
  <p>${req.body.text}</p>
`;

  const transporter = nodemailer.createTransport({
    host: "smtp.ethereal.email",
    port: 587,
    auth: {
      user: "t4qj6mgea2kpyep7@ethereal.email",
      pass: "PASSWORD"
    },
    tls: {
      rejectUnathorized: false
    }
  });

  let mailOptions = {
    from: 'Webtool feedback: <t4qj6mgea2kpyep7@ethereal.email>', // sender address
    to: "TO@EMAIL.COM", // list of receivers
    subject: 'Feedback from Webtool', // Subject line
    text: 'Hello world', // plain text body
    html: output // html body
  };
  // send mail with defined transport object
  transporter.sendMail(mailOptions, (error, info) => {
    if (error) {
      return console.log(error);
    }
    console.log("Message sent: %s", info.messageId);
    console.log("Preview URL: %s", nodemailer.getTestMessageUrl(info));

  });
});

module.exports = router;

我已将其导入App.js，并设置了反馈路径：

const feedback = require('./routes/api/feedback');

问题在于端点本身可以工作，如果我使用邮递员，则可以成功接收电子邮件，因此不必怀疑feedback.js文件。但是，onSubmit()不起作用。

Answer 1

您确定要包含用于保护Web服务器的中间件吗？

-试试这个-

//middleware meant to protect web servers [CORS requests]
//can change '*' to 'http://localhost:3000' for local host testing

app.use((request, response, next) => {
 response.header("Access-Control-Allow-Origin", "*");
 response.header("Access-Control-Allow-Headers", "Content-Type");
 next();
 app.use(bodyParser.json())
 app.use(bodyParser.urlencoded){
 extended: false
}));

Answer 2

您将表单作为发帖请求发送到@Override public void afterTextChanged(Editable s) { if(!s.toString().contains(baseString)){ editText.setText(baseString+s.toString()); editText.setSelection(editText.length()); }else { String regex = "\\b(https?|ftp|file)://[-a-zA-Z0-9+&@#/%?=~_|!:,.;]*[-a-zA-Z0-9+&@#/%=~_|]"; Pattern pattern=Pattern.compile(regex); String subStr=s.toString().substring(baseString.length()); Matcher matcher= pattern.matcher(subStr); if(matcher.matches()){ editText.setText(baseString+subStr.replaceAll(regex,"")); editText.setSelection(editText.length()); }else if(subStr.contains("https:")){ editText.setText(baseString+subStr.replace("https:","")); editText.setSelection(editText.length()); }else if(subStr.contains("www.")){ editText.setText(baseString+subStr.replace("www.","")); editText.setSelection(editText.length()); }else if(subStr.contains(".")){ editText.setText(baseString+subStr.replaceAll("\\.","")); editText.setSelection(editText.length()); }else if(subStr.contains("//")){ editText.setText(baseString+subStr.replaceAll("//","")); editText.setSelection(editText.length()); }else if(subStr.contains(":")){ editText.setText(baseString+subStr.replaceAll(":","")); editText.setSelection(editText.length()); } }，但是在服务器端，您正在使用路由/feedback的发帖方法。因此，路由/不在其中快递，因此找不到您404。尝试将服务器路由更改为/feedback。

React onSubmit函数不会到达Express终结点（Nodemailer）

2 个答案: