表单发送至Gmail时遇405(Method Not Allowed)错误求助

错误原因 #

• 你的前端代码直接向根路径/发送POST请求，但该路径对应的服务器未配置POST方法的处理逻辑，服务器拒绝该请求方法，返回405错误。
• 前端无法直接向Gmail发送请求：浏览器同源策略会阻止跨域请求，且Gmail不开放直接接收前端POST请求的接口，必须通过后端服务中转发送邮件。

解决方案 #

1. 调整前端请求目标 #

修改JS代码中的请求地址，指向后端提供的邮件发送接口，比如/send-email：

// 原代码
xhr.open("POST", "/");
// 修改后
xhr.open("POST", "/send-email");

2. 搭建后端中转服务（Node.js + Express + Nodemailer） #

以下是完整的后端实现步骤：

安装依赖

在项目根目录执行命令：

npm install express nodemailer cors

创建后端文件（server.js）

const express = require('express');
const nodemailer = require('nodemailer');
const cors = require('cors');
const app = express();

// 允许跨域请求
app.use(cors());
// 解析JSON格式的请求体
app.use(express.json());

// 配置Gmail邮件传输器
const transporter = nodemailer.createTransport({
  service: 'gmail',
  auth: {
    user: '你的个人Gmail邮箱',
    pass: 'Gmail应用专用密码' // 需开启两步验证后创建，不能用普通登录密码
  }
});

// 处理邮件发送的POST接口
app.post('/send-email', (req, res) => {
  const { name, email, subject, message } = req.body;

  const mailOptions = {
    from: email,
    to: '你的个人Gmail邮箱',
    subject: `来自${name}的消息：${subject}`,
    text: `发件人邮箱：${email}\n\n消息内容：\n${message}`
  };

  transporter.sendMail(mailOptions, (error, info) => {
    if (error) {
      console.error(error);
      res.send('error');
    } else {
      console.log(`邮件已发送：${info.response}`);
      res.send('success');
    }
  });
});

// 启动服务器
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`服务器运行在端口${PORT}`);
});

Gmail关键配置

• 必须开启Gmail的两步验证，然后在Google账号设置中创建应用专用密码，用此密码替换代码中的pass字段。
• 若未开启两步验证，可临时开启不太安全的应用访问（不推荐，存在安全风险）。

3. 运行测试 #

1. 启动后端服务：执行node server.js
2. 用本地服务器（如VS Code的Live Server）打开前端页面，提交表单测试邮件发送功能。

内容的提问来源于stack exchange，提问作者Revan Isa