Eseguire richieste post in Dart e Flutter

In questo articolo vediamo come eseguire richieste POST in Dart e Flutter.

L'esempio su un'applicazione da riga di comando, ma per Flutter le differenze sono poche.

Cominciamo con l'installazione:

dart pub add http

Creiamo due file:

• uno che rappresente i dati di login che inviamo
• uno che rappresenta la risposta dal server

In entrambi i casi, comunque, useremo JSON.

Cominciamo da login.dart:

class Login {
  final String email;
  final String password;

  Login({required this.email, required this.password});

  Map toJson() => {
        "email": email,
        "password": password,
      };
}

Il toJson ci permette di "trasformare" l'oggetto in JSON.

Poi abbiamo il file http_response.dart:

class HttpResponse {
  String res;
  String message;

  HttpResponse({required this.res, required this.message});

  factory HttpResponse.fromJson(Map<String, dynamic> json) => HttpResponse(
        res: json["res"],
        message: json["message"],
      );
}

Il fromJson ci consente di "trasformare" il JSON nel nostro oggetto.

A questo punto vediamo il codice:

import 'dart:convert';

import 'package:http/http.dart' as http;

import 'http_response.dart';
import 'login.dart';

main() async {
  var email = 'EMAIL';
  var password = 'PWD';

  final login = Login(email: email, password: password);

  final url = Uri.parse('http://127.0.0.1:8000/api/users/login');
  final response = await http.post(
    url,
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json',
    },
    body: json.encode(login),
  );

  final httpResponse = HttpResponse.fromJson(json.decode(response.body));
  print('Res: ${httpResponse.res}; Message: ${httpResponse.message}');
}

Nel caso in cui stiamo usando Flutter, la libreria http la possiamo installare così:

flutter pub add http

Per quanto riguarda i dati da inviare, è praticamente la stessa cosa; cambia che li dobbiamo prendere da un form o dalle input.

Enjoy!