I have encountered a problem with my MEN back-end app. In the express client router, I declared PUT and DELETE requests but they are returning a status 404 not found error. However, the POST request is functioning correctly. Could this be due to a method-override error or something else?
Here is my client.js router:
//Libraries to call
const express = require("express");
const bodyParser = require("body-parser");
const app = express();
const router = express.Router();
const path = require("path");
const mongoose = require("mongoose");
const methodOverride = require("method-override");
//Models to call
const Client = require("../models/client");
const Dossier = require("../models/dossier");
//Create application/x-www-form-urlencoded parser
var urlencodedParser = bodyParser.urlencoded({ extended: true });
//Using method override for CRUD method overloading in HTML form
app.use(express.urlencoded({ extended: true }));
app.use(methodOverride("_method"));
/* _______________________________________CLIENT SECTION________________________________________ */
// Client list interface
router.get("/", async (req, res) => {
const clients = await Client.find({});
res.render("clients/index", { clients });
});
// Add a client
router.get("/new", (req, res) => {
res.render("clients/new");
});
router.post("/", urlencodedParser, async (req, res) => {
const newClient = new Client(req.body);
await newClient.save();
console.log(newClient);
res.redirect(`/clients/${newClient._id}`);
});
// Specific client interface
router.get("/:id", async (req, res) => {
const { id } = req.params;
const client = await Client.findById(id);
console.log(client);
res.render("clients/show", { client });
});
// Edit a client
router.get("/:id/edit", async (req, res) => {
const { id } = req.params;
const client = await Client.findById(id);
res.render("clients/edit", { client });
});
router.put("/:id", urlencodedParser, async (req, res) => {
const { id } = req.params;
const client = await Client.findByIdAndUpdate(id, req.body, {
runValidators: true,
new: true,
});
console.log(req.body);
res.redirect(`/clients/${client._id}`);
});
// Delete a client
router.delete("/:id", async (req, res) => {
const { id } = req.params;
const FoldersToDelete = await Dossier.find({ client: id });
for (let i = 0; i < FoldersToDelete.length; i++) {
await Dossier.deleteOne(FoldersToDelete[i]);
}
const deletedClient = await Client.findByIdAndDelete(id);
res.redirect("/");
});
// Export the client router
module.exports = router;
And here is my main app index.js where I called the routers and started the server:
//Libraries to call
const express = require("express");
const bodyParser = require("body-parser");
const app = express();
const path = require("path");
const morgan = require("morgan");
const mongoose = require("mongoose");
const methodOverride = require("method-override");
//Routes to add
// For the clients database
const clientRouter = require("./routes/client");
app.use("/clients", clientRouter);
// For the dossiers database
const dossierRouter = require("./routes/dossier");
app.use("/dossiers", dossierRouter);
// For the users database
const userRouter = require("./routes/user");
app.use("/", userRouter);
//Connect to the database
mongoose
.connect("mongodb://localhost:27017/ProjetDB", {
useNewUrlParser: true,
useUnifiedTopology: true,
})
.then(() => {
console.log("MONGO CONNECTION OPEN!!!");
})
.catch((err) => {
console.log("OH NO MONGO CONNECTION ERROR!!!!");
console.log(err);
});
//Set dynamic template and PATH
app.set("views", path.join(__dirname, "views"));
app.set("view engine", "ejs");
//Using method override for CRUD method overloading in HTML form
app.use(express.urlencoded({ extended: true }));
app.use(methodOverride("_method"));
//Using morgan middleware to display the status and type of request made
app.use(morgan("dev"));
/*_________________________________ACTIVATE EXPRESS SERVER__________________________________*/
app.listen(5000, () => {
console.log("APP IS LISTENING ON PORT 5000!");
});