Using TypeScript with C# WebApi for POST Requests

Question

Using TypeScript with C# WebApi for POST Requests

I am encountering an issue where I am trying to invoke a simple method using TypeScript code as well as Chrome Advanced Rest Client, but I keep receiving a 404 error.

WebApi Method

[HttpPost]
[Route("api/offert/TestPost")]
public IHttpActionResult TestPost(int idid)
{
    //http://localhost/prova/api/offert/TestPost

    var anonymousTypeVar = new { x = 15, y = 120 };
    return Json(anonymousTypeVar);
}

TypeScript Code

var data = { idid: 1};

this.baseUrl = 'http://localhost/prova/api/offert/';
this.http.post(this.baseUrl + "TestPost", JSON.stringify(data), 
this.getRequestOptions)
      .map(response => response.json())
      .subscribe();

Despite my efforts, the 404 error persists...

I am aware that I could append "?idid=1" to the URL as a parameter, but my intention is to pass a Json string to the webmethod...

What changes should I make in the code?

Thank you

c#asp.net-mvc typescript asp.net-web-api

Answer 1

Answer №1

Could it be that the issue lies in your JSON data? It seems like MVC would easily handle mapping a URL or Body containing key value pairs to a simple parameter, such as:

id=1 -> int id

However, you are passing:

{ id: 1 }

This should be mapped to...

public class OffertRequest
{
    public int id { get; set; }
}

Therefore, your API should look like:

public IHttpActionResult TestPost(OffertRequest id)

Alternatively, consider sending a straightforward key/value pair in the request body.

Answer 2

Could it be that the issue lies in your JSON data? It seems like MVC would easily handle mapping a URL or Body containing key value pairs to a simple parameter, such as:

id=1 -> int id

However, you are passing:

{ id: 1 }

This should be mapped to...

public class OffertRequest
{
    public int id { get; set; }
}

Therefore, your API should look like:

public IHttpActionResult TestPost(OffertRequest id)

Alternatively, consider sending a straightforward key/value pair in the request body.

Using TypeScript with C# WebApi for POST Requests

WebApi Method

TypeScript Code

Answer №1

Similar questions

When you subscribe to a forkJoin, you will receive an error notification

Utilizing typescript to isolate specific functionality from a class without extending it

Using TypeScript to import a Vue 2 component into a Vue 3 application

React with Typescript: Potential occurrence of an undefined object

Base URL for making Http Requests in an Angular application

Update to Material-UI 4.8.1 - Is there a different method for defining the `component` property now?

Challenge with sharing an array from a different component in Angular using @Input()

Using a Class Decorator in Typescript to Enhance Static Methods across all Classes

Unable to perform type casting in Typescript

Uploading a file to a .NET Framework API Controller using React

What is the best way to depict object key replacements within a Typescript definition?

Node.js built-ins require shims, while global variable names are absent

Retrieve the delimiters used by the database provider from a given regular expression

Transferring the date from an HTML input to a TypeScript file in Angular when the button

Arrange the DataTable by the date column in the format (dd MMM yyyy)

Generate md-card components in real-time using data fetched from an API

Tips for Validating an MVC Controller with Admin Authentication within IdentityServer v4

The method for extracting values from a PXselectorgetQuery- has multiple benefits

Implementing Angular 2 reactive forms checkbox validation in an Ionic application

Is there a way to verify if a value is undefined before including it as an object field?