Lire une requête POST envoyée par AngularJS dans un script PHP

En utilisant $http.post dans AngularJS, on ne peut pas lire les données en utilisant $_POST dans un script PHP distant car AngularJS envoie les données POST en format JSON.

La méthode qui marche pour lire la requête POST envoyée par Angular est de lire les données contenus php://input qui sont en format JSON.


$post = json_decode(file_get_contents("php://input"));

Voici un exemple de formulaire simple pour plus de clarifications :

 

Front-End :

Une page contenant un formulaire avec le nom et prénom du client et un bouton « ajouter » pour ajouter un client dans une base de données.

Ce formulaire appelle le script PHP ajoutClient.php en POST pour effectuer l’ajout.

demo.html

<script src="angular.js"></script>
<script src="app.js"></script>
<div id="ajout_clients" ng-app="demo" ng-controller="clientsCtrl" >
    Nom du client : <input ng-model="nom" type="text" name="nom" /><br/>
    Prénom du client : <input ng-model="prenom" type="text" name="prenom" /><br/>
    <input ng-click="" type="submit" value="Ajouter" />
    // Au clic sur ajouter, ajoutClient() est appelée
    <span id="message"></span>
</div>

app.js

var app = angular.module('demo', []);
app.controller('clientsCtrl', function ($scope, $http) {
/*
* This method will be called on click event of button.
* Here we will read the email and password value and call our PHP file.
*/
$scope.ajoutClient = function () {
    var request = $http({
        method: "post",
        url: window.location.href + "ajoutClient.php", // url du script
        data: {
            nom: $scope.nom,
            prenom: $scope.prenom
        },
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});

request.success(function (data) {
    // Succès de la requête
    document.getElementById("message").textContent = "Le client a été correctement ajouté dans la base de données";
});
}
});

Back-End (PHP) :

Le script auquel sera envoyée la requête POST
On n’utilisera pas $_POST mais plutôt php://input qui contiendra les données en JSON envoyées par angular.

ajoutClient.php

    $data = file_get_contents("php://input");
    $post = json_decode($data);
    @$nom = $post->nom;
    @$prenom = $post->prenom;
    // ... ajout dans la base de données (pas important pour nous)

 

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *