遵循MVC架构开发Express项目时表单提交报cannot POST错误如何解决

错误原因及修复方案 #

1. 路由未注册

你在app.js中挂载todo路由的代码处于注释状态：

// app.use("/todo", require("./routes/todo"));

未注册的路由无法被访问，是触发Cannot POST错误的直接原因，删掉行首的//取消注释即可。

2. 表单提交路径与路由不匹配

todo路由默认挂载在/todo路径下，routes/todo.js中定义的/addTodo POST路由完整访问路径为/todo/addTodo，但表单action属性写的是/addTodo，路径不匹配。
可任选一种方式修复：

• 修改handlebars模板中表单的action属性为/todo/addTodo
• 若要直接使用/addTodo作为提交路径，可将app.js中的路由挂载代码改为app.use("/", require("./routes/todo"));

3. 表单字段名与控制器取值不一致

表单中输入框的name属性为todo，但控制器中通过req.body.todoItem取值，字段名不匹配会导致写入数据为空，需要统一字段名：

• 要么将输入框的name改为todoItem
• 要么将控制器中取值代码改为req.body.todo

4. 缺失模块导入

当前app.js中使用了session、passport、path三个对象，但顶部没有对应的导入语句，运行时会抛出未定义错误，需要补充导入：

const session = require("express-session");
const passport = require("passport");
const path = require("path");

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