Flutter http Post - StatusCode 401 - repetition of response - php

Question

I have some trouble with my Http Post Request in Flutter. I must connect to a PHP web service (using a header) and post some user/password info to get a response (here, user info).
I believe I am near to the solution but I still get a StatusCode 401 as response despite the fact that it works when I try with Postman (with same credentials).
Here is the code of the function I call :
Future<http.Response> post() async {
var url = "https://www.monadresse/login.php";
String password = "xxx";
String username = "yyy";
//var bytes = utf8.encode("$username:$password");
var bytes = "$username:$password";
String userNameUser = "www";
String passwordUser = "zzz";
var passwordUserEncoded = base64.encode(utf8.encode(passwordUser));
//var passwordUserEncoded = base64.encode(passwordUser);
var headers = {
"Authorization": "Basic $bytes",
"Content-Type": "application/json",
};
var requestBody = json.encode({ 'user': userNameUser, 'password': passwordUserEncoded});
print(headers);
print(requestBody);
final http.Response response = await http.post(
url,
body: requestBody,
headers: headers,
);
if(response.statusCode == 200){
var responseJson = json.decode(response.body);
print(Utf8Codec().decode(response.bodyBytes));
print("Body: " + responseJson);}
print(bytes);
print(passwordUserEncoded);
print(response.statusCode);
print("Fini");
}
Another weird thing (read 'I don't understand')... I have added some prints to have an idea of what's happening and, as you can see hereunder, the 2 first prints (located before the request) are first printed twice and after that the 3 last prints are also repeated twice.
flutter: {Authorization: Basic yyy:xxx, Content-Type: application/json}
flutter: {"user":"www","password":"zzz"}
flutter: {Authorization: yyy:xxx, Content-Type: application/json}
flutter: {"user":"www","password":"zzz}
flutter: yyy:xxx
flutter: zzz
flutter: 401
flutter: Fini
flutter: yyy:xxx
flutter: zzz
flutter: 401
flutter: Fini
As I don't find a solution on the net I very hope someone will help me.

Answer 1

As mentioned in the comments, the cause of this issue is that the 'username:password' used in the authorization header isn't encoded to base64.
Here's a working sample for basic authentication using test endpoints from Postman. The username is postman and the password is password.
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert' show utf8, base64;
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
var _usernameTextController = TextEditingController();
var _passwordTextController = TextEditingController();
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Container(
padding: EdgeInsets.all(16.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextFormField(
controller: _usernameTextController,
decoration: const InputDecoration(
labelText: 'Username',
),
),
TextFormField(
controller: _passwordTextController,
obscureText: true,
decoration: const InputDecoration(
labelText: 'Password',
),
),
ElevatedButton(
child: Text('Login'),
onPressed: _doLogin(_usernameTextController.text, _passwordTextController.text),
)
],
),
),
),
);
}
_doLogin(String username, String password) {
if (username.trim().isEmpty || password.trim().isEmpty) {
debugPrint('Either username or password is empty');
} else {
_login(username, password)
.then((value) => debugPrint('Login finished $value'))
.catchError((error) => debugPrint('Login error: $error'));
}
}
Future _login(String username, String password) async {
// 'username:password' is base64 encoded
var authHeader = '${base64.encode(utf8.encode('$username:$password'))}';
debugPrint('userpass: ${username + password}');
debugPrint('authHeader: $authHeader');
final response = await http.get(
'https://postman-echo.com/basic-auth',
headers: {HttpHeaders.authorizationHeader: "Basic $authHeader"},
);
if (response.statusCode == 200) {
// If the server did return a 200 OK response,
// then parse the JSON.
return response.body;
} else {
// If the server did not return a 200 OK response,
// then throw an exception.
throw Exception(
'Failed to login [${response.statusCode}] ${response.body}');
}
}
}