web-dev-qa-db-fra.com

Angular 6: HttpErrorResponse SyntaxError: jetons inattendus dans JSON

Je poste une demande et je suppose que je recevrai une chaîne de succès en réponse. Je reçois une HttpResponseError avec les informations suivantes publiées dans l'image ci-dessous.

enter image description here

PurchaseOrderService

postPurchaseOrderCustom(purchaseOrderCustom: PurchaseOrderSaveCustom) {
 const url = `${this.localUrl}purchaseOrderCustom`;
 return this.http.post<String>(url, purchaseOrderCustom, {headers: this.header})
            .pipe(
                   catchError(this.handleError('postPurchaseOrderCustom', 'I am an error'))
                 );
  }

PurchaseOrderComponent

this.purchaseOrderService.postPurchaseOrderCustom(purchaseOrderCustom).subscribe( response => {
  console.log("Testing", response);
  },
  error => {
    console.error('errorMsg',error );   
  }

La façon dont je le fais est la même manière que son fait dans la documentation. Montrez-moi ce que je fais mal.

error shown when I implement answer provided by @Muhammed

angularresttypescriptxmlhttprequesthttpresponse
9
user3701188

Cela est lié à votre type de réponse api, success n'est pas un format json valide, par défaut HttpClient est le type de réponse json attendu et essayez de l'analyser plus tard. Vous pouvez résoudre ce problème en définissant le type de réponse sur texte comme ceci

    return this.http.post<String>(url, purchaseOrderCustom, 
          {headers: this.header , responseType:'text'})
          .pipe (catchError(this.handleError('postPurchaseOrderCustom', 'I am an error')));
9
malbarmawi

Comme cela a déjà été dit, cela a tout à voir avec la réponse provenant de votre serveur.

Dans mon cas, j'avais une application Spring Boot qui renvoyait ceci:

return new ResponseEntity<>("Your SSN was generated successfully", HttpStatus.OK);

et ce fut la réponse que je recevais sur la Angular end:

{error: SyntaxError: Unexpected token Y in JSON at position 0
at JSON.parse (<anonymous>)
at XMLHtt…, text: "Your SSN was registered successfully."}

J'ai donc créé une classe CustomHttpResponse personnalisée dans mon application Spring Boot, puis j'ai changé le code de mon contrôleur en ceci:

        ...
        CustomHttpResponse customHttpResponse = new CustomHttpResponse();
        customHttpResponse.setMessage("Your SSN was registered successfully.");
        customHttpResponse.setStatus(HttpStatus.OK.value());

        return new ResponseEntity<>(new Gson().toJson(customHttpResponse), 
                                          HttpStatus.OK);
        }

Maintenant, je reçois ceci:

{message: "Your SSN was registered successfully.", status: 200}
   message: "Your SSN was registered successfully."
       status: 200

Essentiellement, cette erreur se produit lorsque Angular attend JSON mais obtient quelque chose d'autre à la place

2
ojonugwa ochalifu