1

Estou tentando enviar um POST via angular, da mesma maneira que eu fazia no JQuery, porém, ao tentar capturar os dados via variável $_POST, não está trazendo nenhum valor.

Eu estou executando um código parecido com esse no angular:

$http.post('/users/ajax-create', user).then(...);

O angular parece estar enviando os dados sem a formatação necessária para que o PHP processe os parâmetros para a variável $_POST.

Eu só consigo obter os valores se eu fizer assim:

 json_decode(file_get_contents('php://input'), true);

Mas o comportamento acima não é desejado. Eu gostaria de usar o angularjs na minha aplicação php, porém não gostaria de reescrevê-la ou começar a fazer coisas diferentes só por causa dessa particularidade do angular.

Existe alguma maneira de enviar os dados de um objeto javascript pelo angular, mas como parâmetros de um formulário form-url-encoded?

Observação: Se esse for um comportamento padrão do angular, não gostaria de ficar escrevendo nenhum código a cada projeto que eu implementasse o angular. Então se houver alguma biblioteca pronta que converta os dados para form-url-encoded, ficarei satisfeito se houver uma indicação.

2 Respostas 2

3

Você pode utilizar o serviço $httpParamSerializer para modificar um objeto e prepará-lo para envio, en conjunto com um cabeçalho específico indicando o tipo form-urlencoded.

$scope.submitForm = function(data) {
  $http({
  method  : 'POST',
  url     : 'process.php',
  data    : $httpParamSerializer(data),
  headers : { 'Content-Type': 'application/x-www-form-urlencoded' }  // Necessário para especificar o tipo de conteúdo
 })
  .then(function(data) {
  });
};

Fontes:
- https://docs.angularjs.org/api/ng/service/$httpParamSerializer
- https://stackoverflow.com/questions/33065986/angular-js-httpparamserializer-and-jquery-ajax

5
  • 1
    Boa solução, eu não conhecia o serviço $httpParamSerializer. Commented 6/07/2016 às 14:55
  • 1
    @RodrigoRigotti Angular tem vários serviços de suporte, geramente eu preciso checar se não estou reinventando a roda.
    – OnoSendai
    Commented 6/07/2016 às 14:57
  • 1
    @OnoSendai reportei o bug no meta. Olha como ficou a url na resposta. Commented 6/07/2016 às 15:00
  • @WallaceMaxters nice catch!
    – OnoSendai
    Commented 6/07/2016 às 15:01
  • Arrumei e estraguei o post do meta :P
    – Largato
    Commented 6/07/2016 às 15:10
3

Você precisa passar o cabeçalho Content-Type: application/x-www-form-urlencoded na requisição, além de reescrever o corpo da requisição de modo que não se transmita um JSON.

Assim sendo, no método $http faça assim:

$http({
    method: 'POST',
    url: url,
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
    },
    transformRequest: function(obj) {
        var str = [];
        for (var p in obj) {
            str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
        }
        return str.join("&");
    },
    data: xsrf
});
3
  • Sei que talvez não seja comum isso no Angular, mas em casos de formulários com arrays, essa função não funcionará corretamente. Commented 6/07/2016 às 14:41
  • Será mesmo? Fiz um teste aqui na função encodeURIComponent com um valor do tipo a[b] e ele converte para a%5Bb%5D, que é a forma certa de se enviar arrays via form data. Commented 6/07/2016 às 14:47
  • Faz sentido sua colocação. Na verdade, a função só não faz a mesma coisa que $.param do jQuery faz. Se quiser adicionar ele como referência na resposta, também será legal Commented 7/07/2016 às 11:30

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .