angularjs - own - yeoman gulp

Yeoman, Grunt, AngularJS y el error 404 en el formulario POST

Question

Estoy intentando enviar un formulario con el método "POST" con AngularJS. Yo uso $ http para enviarlo pero siempre devuelve "No puedo enviar" y error 404. La ruta es correcta y solo ocurre si ejecuto mi aplicación a través de Grunt (el envío por "GET" funciona perfecto). La aplicación ha sido construida usando Yeoman.

Creo que tiene que ser un problema tonto, pero no puedo hacer que funcione.

La vista:

<form name="formLogin" ng-submit="login()">

<ul>
    <li>
        <label for="user">User</label>
        <input type="text" id="user" name="user" ng-model="user">
    </li>
    <li>
        <label for="pass">Password</label>
        <input type="password" id="pass" name="pass" ng-model="pass">
    </li>

</ul>

<input type="submit" value="Send">

El controlador:

    ''use strict'';
angular.module(''myApp'')
  .controller(''LoginCtrl'', function ($scope, $http, $resource) {


    $scope.login = function() {

      var config = {
        url: ''php/login.php'',
        method: ''POST'',
        data: {
            user: $scope.user,
            pass: $scope.pass
        }
      }; // configuration object

      $http(config)
        .success(function(data, status, headers, config) {
            console.log(''success'');
            if (data.status) {
              // succefull login

            } else {
              // Wrong login
            }
        })
        .error(function(data, status, headers, config) {
            console.log(''error'');

        });

    };

  });

Yo uso Grunt con:

grunt server

¿Por qué sucede eso?

¡Gracias!

Answer 1

Estoy confundido por qué GET debería funcionar en este caso. El servidor Grunt solo sirve archivos estáticos de su app y directorios .tmp y su referencia al archivo .php es relativa. Entonces, con la configuración estándar, una solicitud de AJAX a php/login.php simplemente le devolverá el código fuente PHP simple del archivo ubicado en la app/php/login.php , que ciertamente no es lo que desea.

Es probable que desee separar su backend de su interfaz y tener su aplicación PHP en una ubicación diferente. Esto podría estar en una ubicación diferente (por ejemplo /api/login.php ) o en un host diferente https://api.example.com/login.php . Mezclar su aplicación Yeoman con su API no es una buena idea.

Sin embargo, si se ve obligado a mantenerlos dentro de un proyecto, puede usar grunt-php para iniciar un servidor PHP local desde su Gruntfile.

Answer 2

Angular de forma predeterminada envía solicitudes de correo http como application/json y no como application/x-www-form-urlencoded que puede ocasionar problemas. Cambie su aplicación para aceptar application/json o reemplace application/json con application/x-www-form-urlencoded en $httpProvider.defaults.headers.post y serialize form usted mismo. Más detalles en Angular.js doc en la sección Configuración de encabezados HTTP.