axios DELETE method gives a 404 Not Found error

Question

In my MERN app, users can comment on photos. Comments are subdocuments in my Photos Mongoose model. I want to create a axios API that deletes a comment given a commentId and photoId.

Deleting a comment works just fine in Postman. So does my axios.post call to create a comment.

I suspect the issue is with my axios.delete call. The request hits my catch statement saying that the photo is not found, but the comment deletes just fine with the same data when I try on Postman. In ChromeDev tools, I get a 404 not found error.

404 Error

Specific error from catch statement

server/routes/api/photos.js

// DELETE COMMENT (protected)

router.delete(
  "/comment/delete",
  passport.authenticate("jwt", { session: false }),
  (req, res) => {
    let { commentId, photoId } = req.body;
    Photo.findOne({ _id: photoId })
      .then(photo => {
        photo.comments.pull({ _id: commentId });
        photo.save();
        res.json(photo.comments);
      })
      .catch(err => res.status(404).json({ nophotofound: "No photo found" }));
  }
);

frontend/src/util/photo_api_util.js

import axios from "axios";

export const deletePhotoComment = data => {
  return axios.delete("/api/photos/comment/delete", data);

// ex: data = {photoId: "...", commentId: "..."}
};