POST, pojedynczy parametr i Angular

Próbowałam ostatnio przekazać postem pojedynczy parametr do kontrolera. Miał to być zwykły napis przechowujący informacje na temat nazwy gry, którą chcemy zaimportować z serwisu BoardGameGeek.

Metoda w moim kontrolerze wyglądała następująco:

[HttpPost]
public JsonResult Add(string name)
{
\\do the magic
}

Od strony frontentu próbowałam kilka podejść:

1 przekazać nazwę jako zwykły string w body requestu:

private headers = new Headers({ 'Content-Type': 'application/json' });

create(name: string): Promise<string> {
return this.http
.post(`${this._addBoardGameUrl}`, JSON.stringify(name), { headers: this.headers })
.toPromise()
.then(response => { return response.text(); })
.catch(ex => { return new Common().handleError(ex) });
} 

Niestety po stronie kontrolera parametr name był nullem. Sprawdziłam debuggerem, name po stronie frontendu był uzupełniony. Szukałam więc dalej rozwiązania.

2 przekazać nazwę bezpośrednio w url, nie wypełniając body requestu:

create(name: string): Promise<string> {
return this.http
.post(`${this._addBoardGameUrl}` + "/" + name, null)
.toPromise()
.then(response => { return response.text(); })
.catch(ex => { return new Common().handleError(ex) });
}

Nadal null. Po dodaniu headerów bez zmian. Poszukiwanie rozwiązania trwało nadal.

3 Przekazanie obiektu name w body requestu:

private headers = new Headers({ 'Content-Type': 'application/json' });

create(name: string): Promise<string> {
return this.http
.post(`${this._addBoardGameUrl}`, JSON.stringify({ name: name }), { headers: this.headers })
.toPromise()
.then(response => { return response.text(); })
.catch(ex => { return new Common().handleError(ex) });
}

Wreszcie sukces! Wychodzi na to, że do trzech razy sztuka 😀

Skomentuj

Wprowadź swoje dane lub kliknij jedną z tych ikon, aby się zalogować:

Logo WordPress.com

Komentujesz korzystając z konta WordPress.com. Wyloguj /  Zmień )

Zdjęcie na Facebooku

Komentujesz korzystając z konta Facebook. Wyloguj /  Zmień )

Połączenie z %s