userServic no pasará los datos al back-end: no se puede leer la propiedad ‘protocol’ de undefined – AngularJS

Tengo una función de cambio de contraseña en mi panel de control de usuario que no funciona. Recoge los valores de la entrada y los pasa del controlador al servicio, el servicio los recibe, pero cuando él intenta alcanzar el back-end con ellos, la consola de depuración devuelve: No se puede leer el “protocolo” de la propiedad de indefinido.

Importante: Consulte mi pregunta de previsualizaciones aquí antes de escribir su solución para comprender por qué tengo que usar los campos de un objeto para la entrada de scope. Por favor considere que enviar un objeto completo al backend no es una opción, gracias.

Formulario (.html):

 

userController.js:

 collectionsApp.controller('userController', function($scope, userService, $timeout, $state) { $scope.password = { newPassword : "", repeatedNewPassword : "", currentPassword : "" } $scope.init = function() { userService.getCurrentUser(getCurrentUser); } $scope.changePassword = function() { if ($scope.password.newPassword === $scope.password.repeatedNewPassword) { userService.changePassword($scope.password.newPassword, $scope.password.currentPassword); } } ... 

userService.js:

 collectionsApp.service('userService', function($http) { return { changePassword : function(newPassword, currentPassword) { $http.post('/user/changePassword', newPassword, currentPassword); } }; }); 

Depurar:

introduzca la descripción de la imagen aquí

Error en la consola:

introduzca la descripción de la imagen aquí

De acuerdo con la referencia $ http , los argumentos del método de publicación son

  1. url
  2. objeto de datos
  3. objeto opcional

Entonces, prueba esto:

 collectionsApp.service('userService', function($http) { return { changePassword : function(newPassword, currentPassword) { var data = { newPassword: newPassword, currentPassword: currentPassword }; $http.post('/user/changePassword', data); } }; }); 

He logrado resolver este problema. Había tres soluciones. En el back-end tengo un controlador Java que fue configurado para aceptar el método @RequestBody con POST. Primero se configuró para dos cadenas, pero a medida que ocurre, la publicación $ http de Angular está destinada a recibir tres parámetros: 1. url, 2.data, 3. objeto de configuración (como se señala @ RémiB.). Por lo tanto, la solución lógica era enviar el objeto y recibirlo como un objeto genérico como los Object data pero este objeto no tiene captadores ni definidores, por lo que no fue posible extraer los datos. La solución absolutamente no aceptable fue crear una clase de utilidad con captadores y definidores diseñados para este tipo de datos. Una solución menos inaceptable fue agregar un nuevo archivo (newPassword a un usuario de clase existente) para que los datos recibidos con esta clase pudieran procesarse. La tercera solución dudosa era recibir datos como objeto Objeto genérico y hacer un toString () en este objeto y escribir un código para extraer subcadenas de una cadena. Esto sonaba realmente mal y no quería hacer eso. La última solución fue la menos inaceptable: cambiar los métodos para obtener y enviar datos en url (desde el servicio Angular) y reactivarla como cadena a través de @PathVariables en el backend de Java. Así que, larga historia corta:

 changePassword : function(newPassword, currentPassword) { $http.get('/user/changePassword/'+newPassword+'/'+currentPassword); } 

Y en el back-end:

 @RequestMapping(value = "/changePassword/{newPassword}/{currentPassword}", method = RequestMethod.GET) public HashMap changePassword(@PathVariable("newPassword") String newPassword, @PathVariable("currentPassword") String currentPassword) { .... } 
    Intereting Posts