Hoy vamos a ver un tema que me ha dado un poco la lata últimamente, pero que es muy fácil de resolver. Se trata de enviar parámetros de un formulario desde IONIC hasta un API REST en Slim.
La clave está en enviar los parámetros «encapsulados» desde de un objeto «FormData». Igualmente, habrá que enviar las cabeceras correctas para que el servidor sepa qué tipo de parámetro estamos pasando.
Pero el movimiento se demuestra andando y aquí tenéis el código. Lo primero, es importar «HttpHeaders» para poder hacer uso de él:
import { HttpClient, HttpHeaders } from '@angular/common/http';
Una vez importado, ya podemos definir los datos y las cabeceras a pasar:
const cabeceras = new HttpHeaders();
cabeceras.append('enctype', 'multipart/form-data');
cabeceras.append('Accept', 'plain/text');
cabeceras.append('Access-Control-Allow-Origin', '*');
cabeceras.append('Access-Control-Allow-Methods', 'POST, GET, OPTIONS, PUT');
cabeceras.append('Access-Control-Allow-Headers', 'Authorization, Origin, Content-Type, X-CSRF-Token');
const datosPost = new FormData();
datosPost.append('usuario', 'miuser');
datosPost.append('password', 'misuperpass');
Con estos datos, hacemos la llamada a nuestro API:
this.http.post<string>('https://miapi.com/login', datosPost, { headers: cabeceras }).
subscribe( resp => {
.............
});
En mi caso, devuelvo un string, pero podría devolver cualquier cosa y habría que especificarlo en la llamada POST.
Del lado del servidor, los parametros los recogemos de la manera normal en Slim:
$username = $req->post('usuario');
$password = $req->post('password');
Y todo listo. Espero que con esto tengáis menos dolores de cabeza que yo. Mi problema fue que, por defecto, me mandaba los parámetros en formato JSON, y el API que tenía que usar no los entendía, tenía que pasarlos de esta forma.
Un saludo y hasta la próxima.