Nodemailer 使用 sendinblue 发送附件

Question

我正在使用 React-Bootstrap，但它不允许我发送附件。它以前在 Sendinblue 上工作过。

投诉.JS

import React, { useState } from "react";
import {
  Col,
  Container,
  FloatingLabel,
  Form,
  Row,
  Button,
} from "react-bootstrap";

export default function Complaint() {
  const [validated, setValidated] = useState(false);

  const [status, setStatus] = useState("Submit");

  const handleSubmit = async (e) => {
    const form = e.currentTarget;
    if (form.checkValidity() === false) {
      e.preventDefault();
      e.stopPropagation();
    }

    setValidated(true);
    setStatus("Sending...");
    const {
      complainantName,
      violatorName,
      complainantAddress,
      violatorAddress,
      phoneNumber,
      emailAddress,
      violation,
      filesUpload,
    } = e.target.elements;
    let details = {
      cName: complainantName.value,
      cAddress: complainantAddress.value,
      phone: phoneNumber.value,
      email: emailAddress.value,
      vName: violatorName.value,
      vAddress: violatorAddress.value,
      violation: violation.value,
      attachments: filesUpload.value,
    };

    let response = await fetch("http://localhost:5000/complaint", {
      method: "POST",
      headers: {
        "Content-Type": "application/json; charset=utf-8",
      },
      body: JSON.stringify(details),
    });
    setStatus("Submit");
    let result = await response.json();
    alert(result.status);
    if (response) setStatus(response.statusText);
  };
  return (
    <Container className="pt-4">
      <h4>Complaint Form</h4>
      <hr />
      <p>
        This is the Shadow Lakes Homeowners' Association Board of Directors'
        official process for addressing complaints. All complaints will be
        confidential and timely handled. The description of the violation must
        include the nature of and date of the alleged violation with an
        explanation of the factual basis of the complaint. (Who, What, Where,
        When, etc.).{" "}
        <strong>
          Every input boxes must be filled and validated, or the complaint form
          will be automatically rejected.
        </strong>
      </p>
      <Form noValidate validated={validated} onSubmit={handleSubmit}>
        <Form.Group>
          <Row>
            <Col>
              <FloatingLabel
                className="mb-3"
                controlId="complainantName"
                label="Complainant's Name"
              >
                <Form.Control
                  type="text"
                  placeholder="Complainant's Name"
                  required
                />
              </FloatingLabel>
            </Col>
            <Col>
              <FloatingLabel
                className="mb-3"
                controlId="violatorName"
                label="Violator's Name"
              >
                <Form.Control
                  type="text"
                  placeholder="Violator's Name"
                  required
                />
              </FloatingLabel>
            </Col>
          </Row>
          <Row>
            <Col>
              <FloatingLabel
                className="mb-3"
                controlId="complainantAddress"
                label="Complainant's Address"
              >
                <Form.Control
                  type="text"
                  placeholder="Complainant's Address"
                  required
                />
              </FloatingLabel>
            </Col>
            <Col>
              <FloatingLabel
                className="mb-3"
                controlId="violatorAddress"
                label="Violator's Address"
              >
                <Form.Control
                  type="text"
                  placeholder="Violator's Address"
                  required
                />
              </FloatingLabel>
            </Col>
          </Row>
          <Row>
            <Col>
              <FloatingLabel
                className="mb-3"
                controlId="phoneNumber"
                label="Phone Number"
              >
                <Form.Control type="text" placeholder="Phone Number" required />
                <Form.Text className="text-muted">
                  Phone Number is not to be share with anyone.
                </Form.Text>
              </FloatingLabel>
            </Col>
            <Col>
              <FloatingLabel
                className="mb-3"
                controlId="emailAddress"
                label="Email Address"
              >
                <Form.Control
                  type="text"
                  placeholder="Email Address"
                  required
                />
                <Form.Text className="text-muted">
                  Email address is not to be share with anyone.
                </Form.Text>
              </FloatingLabel>
            </Col>
          </Row>
          <Row>
            <Col>
              <FloatingLabel
                controlId="violation"
                label="Description of alleged violation"
                className="mb-3"
              >
                <Form.Control
                  as="textarea"
                  placeholder="Description of alleged violation"
                  style={{ height: "200px" }}
                  required
                />
                <Form.Text className="text-muted">
                  Description of the alleged violation must be related to Deed
                  Restrictions. Please review the{" "}
                  <a href="/deed-restrictions" className="text-black-50">
                    Deed Restrictions
                  </a>{" "}
                  if unsure of the violation.
                </Form.Text>
              </FloatingLabel>
            </Col>
            <Row>
              <Col>
                <Form.Label>Multiple Photos Allowed</Form.Label>
                <Form.Control
                  controlId="filesUpload"
                  className="mb-3"
                  type="file"
                  multiple
                />
              </Col>
            </Row>
          </Row>
        </Form.Group>
        <Button type="submit" value={"submit"}>
          {status}
        </Button>
      </Form>
    </Container>
  );
}

服务器.js

router.post("/complaint", (req, res) => {
  const cName = req.body.cName;
  const cAddress = req.body.cAddress;
  const phone = req.body.phone;
  const email = req.body.email;
  const vName = req.body.vName;
  const vAddress = req.body.vAddress;
  const violation = req.body.violation;

  const mail = {
    from: "hello@example.com",
    to: "hello@example.com",
    subject: `Complaint from ${cName} on ${vName}`,
    html: `The message is from ${cName} <br />
    Complaint's Name: ${cName} <br />
    Complaint's address: ${cAddress} <br />
    Email: ${email} <br />
    Phone: ${phone} <br />
    Violator's Name: ${vName} <br />
    Violator's Address: ${vAddress} <br />
    Violation: ${violation} <br />
    Attachment Image(s):<img src="cid:imageFiles" />`,
    attachments: [
      {
        filename: "image.png",
        path: "/files/images/",
        cid: "imageFiles",
      },
    ],
  };
  contactEmail.sendMail(mail, (error) => {
    if (error) {
      res.json({ status: "ERROR" });
    } else {
      res.json({ status: "Message has been sent" });
    }
  });
});

发送表单时没有错误消息。我已直接从 cPanel SMTP 更改它，但仍然存在问题。如果我删除代码，那么表单将起作用。

      {
        filename: "image.png",
        path: "/files/images/",
        cid: "imageFiles",
      },
    ],

我已经吃过了

<Form.Group controlId="filesUpload" className="mb-3">
   <Form.Label>Multiple Photos Allowed</Form.Label>
   <Form.Control type="file" multiple />
</ Form.Group>

我想我忽略了一些东西。非常感谢您的帮助。

Answer 1

attachments: [
  {
    filename: 'somefile.txt',
    contentType: 'text/plain',
    content: 'string attachment example'
  },
],

Nodemailer Attachment Empty but filename is attached