Receiving Error 405 when POST or PUT from Angular 7 to ASP.NET WebAPI
Hi,
I am studying Angular 7 with ASP.NET WebAPI.
I host ASP.NET Web API REST Service in IIS 10.
In Angular 7, I can successfully GET from ASP.NET WebAPI, but I receive Error 405 when POST or PUT to ASP.NET WebAPI.
(I can successfully GET / POST / PUT to the same ASP.NET WebAPI using Postman.)
I cannot figure it out, thanks for your help.
Client code:
import { Injectable } from '@angular/core';import { HttpClient, HttpHeaders } from '@angular/common/http';import { Observable, of } from 'rxjs';import { catchError, map, tap } from 'rxjs/operators';import { MDLSyst } from '../_Model/MDLSyst';import { MessageService } from '../_Service/message.service';const httpOptions = { headers: new HttpHeaders({ 'Content-Type': 'application/json' })};@Injectable({ providedIn: 'root'})export class SystService { private systUrl = 'http://localhost/fars-api/api/syst'; // URL to web api constructor(private http: HttpClient, private messageService: MessageService) { } getSystList(): Observable<MDLSyst[]> { return this.http.get<MDLSyst[]>(this.systUrl) .pipe( tap(_ => this.log('fetched SystList')), catchError(this.handleError('getSystList', [])) ); } /** GET syst by id. Will 404 if id not found */ getSyst(id: number): Observable<MDLSyst> { const url = `${this.systUrl}/${id}`; return this.http.get<MDLSyst>(url).pipe( tap(_ => this.log(`fetched syst id=${id}`)), catchError(this.handleError<MDLSyst>(`getSyst id=${id}`)) ); } /** POST: add a new syst to the server */ addSyst(syst: MDLSyst): Observable<MDLSyst> { return this.http.post<MDLSyst>(this.systUrl, syst, httpOptions).pipe( tap((syst: MDLSyst) => this.log(`added syst w/ id=${syst.Id}`)), catchError(this.handleError<MDLSyst>('addSyst')) ); } /** PUT: update the syst on the server */ updateSyst(syst: MDLSyst): Observable<any> { const id = syst.Id; const url = `${this.systUrl}/${id}`; return this.http.put(url, syst, httpOptions).pipe( tap(_ => this.log(`updated syst id=${syst.Id}`)), catchError(this.handleError<any>('updateSyst')) ); } /** * Handle Http operation that failed. * Let the app continue. * @param operation - name of the operation that failed * @param result - optional value to return as the observable result */ private handleError<T> (operation = 'operation', result?: T) { return (error: any): Observable<T> => { // TODO: send the error to remote logging infrastructure //console.error(error); // log to console instead // TODO: better job of transforming error for user consumption this.log(`${operation} failed: ${error.message}`); // Let the app keep running by returning an empty result. return of(result as T); }; } /** Log a SystService message with the MessageService */ private log(message: string) { this.messageService.add(`SystService: ${message}`); }}
You're going to have a difficult time getting this to work locally + then you'll have to move it to some public site + start your debugging all over again.
1) Setup all your dev code on the public IPs where your API code will be running.
Tip: Use OVH for cheap + fast hardware.
Tip: Run your API services in an LXD container, so you can easily clone your container to multiple other machines to scale up your API throughput.
2) Go ahead + wrap your API code in HTTPS now.
3) Research CORS + setup your CORS ACLs now.
https://spring.io/understanding/CORS provides a good starting point + you'll likely require a good bit of research + thought + design to create an exact setup which will work for your situation.
David Favor
Generally 405s mean...
1) You've requested an existing/valid resource, else you'd have gotten a 404.
2) How you accessed the resource is invalid.
3) Best way to debug this is using curl as your client + tracking exact logged errors on your API side.
Note: This presupposes you have highly granular logging running for your API side, so every minor error/warning is logged.
Tip: Writing APIs in some languages is difficult + time consuming (ASP) while other languages (PHP) you'll be able to write API code in a few minutes.
You might consider starting with PHP to build a prototype + then move to ASP, if you really must.
1) Setup all your dev code on the public IPs where your API code will be running.
Tip: Use OVH for cheap + fast hardware.
Tip: Run your API services in an LXD container, so you can easily clone your container to multiple other machines to scale up your API throughput.
2) Go ahead + wrap your API code in HTTPS now.
3) Research CORS + setup your CORS ACLs now.
https://spring.io/understa