CODEWITHSUNDEEP
typescriptapiionic-frameworkhttpsionic3
Eran Helbitz
Eran Helbitz

Reputation: 33

HTTP POST request Ionic 3 gives 403 forbidden

I'm currently working on an app based on ionic 3.9.2. I'm trying to send a POST request to an API but I'm getting a 403 forbidden. orignally I had a CORS issue but I temporarily added https://cors-anywhere.herokuapp.com/ to the URL to bypass that. here is the function:

voucher-details.ts:

editVoucher(voucher) {
voucher.Comments = (voucher.Comments || " ");
if (!voucher.Comments.includes('Edited via Guide App')) {
  voucher.Comments += " Edited via Guide App";
}
//WORKS UP TILL HERE
this.voucherService.editVoucher(voucher)
//      .map((res) => res.json())
  .map((res) => res)
  .subscribe(
    (res) => {
      console.log("old voucher id", voucher.voucher_Id);
      console.log("new voucher id", res);
      this.showSuccess("Voucher updated successfully");
    },
    (err) => {
      console.log("Error occured while updating voucher id "),
        this.showError("Oops, an error occured. Please try again");
    }
  );

}

and the function it's refrencing voucherService.editVoucher(voucher) is here:

voucher.ts:

 public editVoucher(voucherToUpdate) {
    //application/x-www-form-urlencoded
    const httpOptions = {
        headers: new HttpHeaders({
          'Content-Type':  'application/json',
         // Authorization: 'my-auth-token'
        })
      };
    return this.HttpClient.post(`https://cors-anywhere.herokuapp.com/${API_BASE_URL}/Api/GuideApp/UpdateVoucher`, {

        Voucher: voucherToUpdate,
        tenantId: voucherToUpdate.tenantId
        
    }, httpOptions);
    
}

Upvotes: 1

Views: 490

Answers (1)

Danil Prokhorenko
Danil Prokhorenko

Reputation: 1104

Let's admit your code is fine and you pass your auth credentials as needed for your server. cors-anywhere has some restrictions as mentioned here:

From February 1st. 2021, cors-anywhere.herokuapp.com will only serve requests after the visitor has completed a challenge: The user (developer) must visit a page at cors-anywhere.herokuapp.com to temporarily unlock the demo for their browser. This allows developers to try out the functionality, to help with deciding on self-hosting or looking for alternatives.

Try to unlock this manually on your browser: https://cors-anywhere.herokuapp.com/corsdemo

Upvotes: 1

Related Questions