Node.js开发天气日志应用时遭遇405 Method Not Allowed错误求助

针对你遇到的POST请求405错误，结合你的代码，有几个关键问题需要修复：

1. 前端请求的Content-Type拼写错误 #

HTTP MIME类型里的JSON是小写的application/json，你代码里写成了application/JSON，这会导致后端无法正确解析请求体，甚至触发路由匹配异常。修改后的前端代码：

async function postData(url="",data={}){
   console.log(data);
   const res= await fetch (url, {
     method: 'POST',
     headers: {
       'Content-Type': 'application/json' // 修正为小写json
     },
     credentials: 'same-origin',
     body: JSON.stringify(data)
   });
   try{
     const finalData= await res.json();
     console.log(finalData);
     return finalData;
   } catch(error) {
       console.log("error", error);
   }
}

2. 后端必须正确配置中间件（cors + 请求体解析） #

你提到已经配置了express/cors/body-parser，但要确保这些中间件在路由之前挂载，否则路由无法使用这些中间件的功能。示例配置：

const express = require('express');
const cors = require('cors');
const bodyParser = require('body-parser');
const app = express();
const port = 3000; // 替换成你的端口号
let projectData = []; // 确保这个变量已定义

// 挂载中间件，必须在路由之前
app.use(cors());
// 解析JSON格式的请求体
app.use(bodyParser.json());
// 如果你用的是express 4.16及以上版本，也可以用内置的解析器代替body-parser：
// app.use(express.json());

3. 后端POST路由必须返回响应 #

你的当前POST路由只完成了数据存储，但没有给客户端返回任何响应，这会导致请求挂起，前端可能收到异常状态码。修改后的路由代码：

app.listen(port, () => {
    console.log(`Now listening on port ${port}`);
});

app.get('/all', function (req,res) {
    res.send(projectData)
});

app.post('/add', function(req,res){
    console.log(req.body);
    // 用const声明变量，避免全局污染
    const newEntry = {
        date: req.body.date,
        temp: req.body.temp,
        content: req.body.content
    }
    projectData.push(newEntry);
    // 返回201创建成功的响应，带上数据和提示信息
    res.status(201).json({
        success: true,
        message: '天气日志添加成功',
        entry: newEntry
    });
});

4. 确认请求URL正确性 #

调用postData时，确保传入的URL是正确的，比如前后端同端口时用'/add'，跨端口时用完整地址（如'http://localhost:3000/add'），路径错误会导致请求到不存在的路由，也可能触发405错误。

按照以上步骤修改后，POST请求应该能正常工作，数据可以正确存储并返回响应。

内容的提问来源于stack exchange，提问作者Kenny Ackerman