viernes 22 noviembre 2024

Cómo usar dio en Flutter para realizar peticiones HTTP

El paquete dio es una biblioteca poderosa en Flutter para realizar solicitudes HTTP de manera sencilla y eficiente. Ofrece características avanzadas como interceptores, manejo de errores, tiempo de espera, cancelación de solicitudes, y soporte para múltiples tipos de respuesta.

¿Qué es `dio` y por qué usarlo?

dio es una herramienta flexible y moderna para interactuar con APIs REST en Flutter. Facilita la comunicación con servidores remotos, permitiendo realizar operaciones como enviar datos, recibir respuestas y manejar errores de red.

Ventajas de `dio`:

Soporte para interceptores para modificar solicitudes y respuestas.
Envío de datos en diferentes formatos: JSON, FormData, etc.
Funciones avanzadas como reintentos automáticos y cancelación de solicitudes.
Compatible con múltiples plataformas (iOS, Android, web).

Cómo configurar `dio` en Flutter

Pasos iniciales:

1. Añadir la dependencia al proyecto:

En el archivo pubspec.yaml, incluye:

dependencies:
     dio: ^5.0.0

2. Importar el paquete:

En tu archivo Dart:

import 'package:dio/dio.dart';

3. Inicializar una instancia de Dio:

Crea un objeto Dio para realizar las solicitudes:

Dio dio = Dio();

Métodos comunes de `dio`

Método	Descripción	Ejemplo de uso
`get`	Realiza una solicitud GET.	`dio.get('https://api.example.com/users');`
`post`	Realiza una solicitud POST.	`dio.post('https://api.example.com/login', data: {...});`
`put`	Realiza una solicitud PUT.	`dio.put('https://api.example.com/users/1', data: {...});`
`delete`	Realiza una solicitud DELETE.	`dio.delete('https://api.example.com/users/1');`
`download`	Descarga un archivo.	`dio.download(url, savePath);`

Ejemplos prácticos

Realizar una solicitud GET

void obtenerUsuarios() async {
  try {
    Response response = await dio.get('https://jsonplaceholder.typicode.com/users');
    print(response.data);
  } catch (e) {
    print('Error: $e');
  }
}

Enviar datos con POST

void enviarDatos() async {
  try {
    Response response = await dio.post(
      'https://jsonplaceholder.typicode.com/posts',
      data: {
        'title': 'Flutter',
        'body': 'Esto es un ejemplo',
        'userId': 1,
      },
    );
    print(response.data);
  } catch (e) {
    print('Error: $e');
  }
}

Subir archivos con FormData

void subirArchivo() async {
  FormData formData = FormData.fromMap({
    'file': await MultipartFile.fromFile('./archivo.jpg', filename: 'archivo.jpg'),
  });
  try {
    Response response = await dio.post(
      'https://api.example.com/upload',
      data: formData,
    );
    print(response.data);
  } catch (e) {
    print('Error: $e');
  }
}

Configurar interceptores

void configurarInterceptors() {
  dio.interceptors.add(
    InterceptorsWrapper(
      onRequest: (options, handler) {
        print('Solicitud: ${options.uri}');
        return handler.next(options);
      },
      onResponse: (response, handler) {
        print('Respuesta: ${response.statusCode}');
        return handler.next(response);
      },
      onError: (DioError e, handler) {
        print('Error: ${e.message}');
        return handler.next(e);
      },
    ),
  );
}

Recursos adicionales

Etiquetas:

dart flutter

Creado por:

Jorge García

Fullstack developer