Home > database >  The this.http.post() gives a 404 (Not Found) error
The this.http.post() gives a 404 (Not Found) error

Time:11-05

I'm currently trying to make a create function(to make a quote) with a server in angular. So i made a form with an input in the html file.

<form [formGroup]="addquoteform" (submit)="createquote()">
    <p>
        <mat-form-field appearance="outline">
            <mat-label>quote</mat-label>
            <input matInput placeholder="Placeholder" formControlName="quote">
            <mat-icon matSuffix>sentiment_very_satisfied</mat-icon>
        </mat-form-field>
    </p>
    <p>
        <button mat-raised-button color="primary">Submit</button>
    </p>
</form>

Then I made the function in the .ts file.

createquote(){
    this.dbService.addquote(this.addquoteform.value)
    .subscribe(data => {
      console.log("new quote")
    }, err => {
      console.log(err);
    })
  }

And then I made the quote in server/quote.ts

interface QuoteData {
    quote : string;
}

export interface quote extends  QuoteData{

}

Then in the services/dbService.ts file I made the this.http.post()

addquote(quoteObj: any) {
        return this.http.post(this.baseUrl   'quote', quoteObj);
    }

But the last one doesn't work. All I get is the error: POST http://localhost:4200/quote 404 (Not Found) I tried changing the link but nothing seems to help. Any idea what could be causing this?

CodePudding user response:

The reason could be first: the endpoint mismatch in the back-end. second: the back-end may have API prefix for all the APIs in the configuration, you check it again. that is http://localhost:4200/api/qoute

CodePudding user response:

Are you trying to call any backend api? Because for not it try to call thay api on your frontend app with port 4200. Which will be not there obviously. It can only call frontend for assets data.If you want to call backend make sure backend is also running or the server is running. Because looking above info it is not able to route to your server.

  • Related