No desenvolvimento com Flutter é fundamental acessar API que possuem algum tipo de autenticação e o método mais popular é o Basic Authentication, que consiste basicamente no envio do usuário e senha em um cabeçalho.
No Flutter realizamos requisições HTTP através do pacote nativo do Dart http/http.dart
(https://pub.dev/packages/http).
Este pacote contém um conjunto de funções e classes de alto nível que facilitam o consumo de recursos HTTP. É independente da plataforma e pode ser usado na linha de comando e no navegador.
Requisição HTTP no Flutter
import 'package:http/http.dart' as http;
main() async {
var response = await http.post(
'https://api.site.io/new',
body: {'name': 'doodle', 'color': 'blue'},
);
print('Response status: ${response.statusCode}');
print('Response body: ${response.body}');
}
Requisição HTTP com Basic Authentication no Flutter
Lembrando que o Basic Authentication exige que o par usuário:senha seja codificado como Base64, que no Flutter é feito através da classe Base64Encoder
(https://api.dartlang.org/stable/2.7.0/dart-convert/Base64Encoder-class.html).
No contexto de uma transação HTTP, a Basic Authentication é um método para um agente de usuário HTTP (por exemplo, o Flutter) fornecer um nome de usuário e senha ao fazer uma solicitação.
Na autenticação HTTP básica, uma solicitação contém um campo de cabeçalho na forma de Authorization: Basic user:senha
, onde as credenciais devem obrigatoriamente serem codificadas como base64 e o usuário e a senha são unidos por dois pontos :
.
O resultado do Base64Encoder
é enviado com o cabeçalho Authorization: Basic
:
Authorization: Basic QWxhZGRpbjpPcGVuU2VzYW1l
O Flutter e o Dart facilitam bastante a realização desse procedimento:
import 'dart:convert';
import 'package:http/http.dart';
main() async {
String username = 'luiz';
String password = '123';
String basicAuth = 'Basic ' + base64Encode('$username:$password');
var response = await http.post(
'https://api.site.io/new',
headers: <String, String>{'authorization': basicAuth},
body: {'name': 'doodle', 'color': 'blue'},
);
print('Response status: ${response.statusCode}');
print('Response body: ${response.body}');
}
Um grande abraço!