Angular js 2 Problème Requête POST
Bonjour,
Cela fait plusieurs jours que je suis bloqué.
Je suis débutant sous angularjs 2 et j'aimerai effectuer une requête XHR de type POST vers une api qui attend un content type "application/json". Je précise que c'est une api REST codé en php sous le framework symfony et lorsque je simule la requête avec POSTMAN en configurant mon content-type sur "application/json" tout fonctionne correctement.
Cependant impossible pour moi de configurer la requête dans ce sens avec angular js 2, j'ai une erreur 405 Method Not Allowed.
Voici le code :
let url = "http://localhost/api/web/app_dev.php/users";
let headers = new Headers();
headers.append('Content-Type','application/json');
let options = new RequestOptions({headers: headers});
return this.Http.post(url,JSON.stringify(user),options).subscribe();
Étrange, j'ai remarqué que le content type multipart/form-data ou text/plain fonctionne, la méthode POST est correctement accepté auprès du serveur mais bien sur il ne reconnait pas le format de donnée envoyé et me remonte une erreur 400.
Merci beaucoup d'avance pour votre retour.
David
5 réponses
Bonjour,
observe le network pour regarder quel requête part, les headers notamment.
Vérifie aussi l'url d'appel.
bien cordialement
Bonsoir Antho,
Un grand merci pour ta réponse.
On configurant mon Content-Type application/json voici ce que cela me retourne :
405 Method Not Allowed
General :
Request URL:http://localhost/api/web/app_dev.php/users
Request Method:OPTIONS
Status Code:405 Method Not Allowed
Remote Address:[::1]:80
Referrer Policy:no-referrer-when-downgrade
Response Header :
Allow:GET, HEAD, POST
Cache-Control:no-cache, private
Connection:Keep-Alive
Content-Length:108
Content-Type:application/json
Date:Fri, 07 Jul 2017 17:35:00 GMT
Keep-Alive:timeout=5, max=100
Server:Apache/2.4.23 (Win64) PHP/5.6.25
X-Debug-Token:249cda
X-Debug-Token-Link:http://localhost/api/web/app_dev.php/_profiler/249cda
X-Powered-By:PHP/5.6.25
Resquest Header :
Accept:/
Accept-Encoding:gzip, deflate, br
Accept-Language:fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4
Access-Control-Request-Headers:content-type
Access-Control-Request-Method:POST
Connection:keep-alive
Host:localhost
Origin:http://localhost:4200
Referer:http://localhost:4200/login
User-Agent:Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36
Par contre en configurant mon Content Type en "text/plain" cela me retourne une erreur 400 ce qui prouve que l'url est bonne, que la requête POST est reconnue mais que les données sont incorrects puisqu'elles sont en JSON. Ci dessous le detail :
General
Request URL:http://localhost/api/web/app_dev.php/users
Request Method:POST
Status Code:400 Bad Request
Remote Address:[::1]:80
Referrer Policy:no-referrer-when-downgrade
Response Header
Cache-Control:no-cache, private
Connection:close
Content-Length:301
Content-Type:application/json
Date:Fri, 07 Jul 2017 17:54:16 GMT
Server:Apache/2.4.23 (Win64) PHP/5.6.25
X-Debug-Token:430d62
X-Debug-Token-Link:http://localhost/api/web/app_dev.php/_profiler/430d62
X-Powered-By:PHP/5.6.25
Request Header
Accept:application/json, text/plain, /
Accept-Encoding:gzip, deflate, br
Accept-Language:fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4
Connection:keep-alive
Content-Length:0
Content-Type:text/plain
Host:localhost
Origin:http://localhost:4200
Referer:http://localhost:4200/login
User-Agent:Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36
Et lorsque je simule la requête avec Postman avec "Content type Application/Json" tout fonctionne correctement.
Merci beaucoup par avance.
David
Le problème c'est que il faut que tu fasses quelque chose des requêtes Options aussi.
Chrome effectue une requête OPTIONS avant d'envoyer une autre requête pour vérifier que la requête a bien le droit d'être fait, dans les cas de cross domain par exemple.
En tapant Chrome CORS pre-flght request sur google tu devrais avoir des réponses.
Dans ton cas ton api rejète les requête OPTIONS et ici tu es sur une OPTIONS :
"Request Method:OPTIONS"