skip to Main Content

I have built a simple ASP .NET Framework MVC app. GET and POST work fine.. however when i try to make a DELETE request it works from Postman, but from my frontend(React & Axios) I get err 404. From browser (chrome/edge) i get err 404.
I think it’s worth noting that this is my first backend. Ever.
I’ve lost like 5 hours over it now.

This is my controller code:

// DELETE: Homes/Delete/5
[HttpDelete]
public async Task<HomeEntity> Delete(int id) {
  return await homesManager.DeleteAsync(id);
}

This is my manager code:

public async Task<HomeEntity> DeleteAsync ( int id) {
  HomeEntity homeModel = db.Homes.Find(id);
  db.Homes.Remove(homeModel);
  await db.SaveChangesAsync();
  return homeModel;
}

This is my routeConfig:

public class RouteConfig {
  public static void RegisterRoutes(RouteCollection routes) {
    routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

    routes.MapRoute(
    name: "Default",
    url: "{controller}/{action}/{id}",
    defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
    );
}

This is my delete request from frontend:

const handlePropertyDelete = async () => {
  try {
    axios
      .delete(`https://localhost:44333/Homes/Delete/${property.id}`)
      .then((response) => {
        console.log("Property deleted:", response.data);
    
        // Handle success
        //Close the delete dialog
        onClose();
      })
      .catch((error) => {
        console.error("Error deleting property:", error);
        console.error("Error status:", error.response?.status);
        console.error("Error data:", error.response?.data);
      });
  } catch (error) {
    console.error("Error:", error);
  }
};

And the errors:
(https://phpout.com/wp-content/uploads/2023/08/lAduD.png)

help please, i’ve never felt so stuck…

I tried multiple formats of the axios request, fetch request, making the request on different browsers. I dont understand why DELETE won’t work when POST and GET do. And DELETE works on Postman from the same URL so it must be my delete function

2

Answers


  1. you have to use the right url "Home" instead of "Homes"

    `https://localhost:44333/Home/Delete/${property.id}`
    

    if it is still not working , then try to remove [HttpDelete] from the action

    Login or Signup to reply.
  2. I didn’t use axios before, but I found this maybe can help you

    and maybe you can try to use HttpClient for that, then like below

    http.delete(`https://localhost:44333/Homes/Delete/${property.id}`)
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search