Cannot get user id from Flutter HTTP request - flutter

Question

I am trying to connect my flutter app to RESTful API. But I am having some problems. This is just the authentication part.
When I am sending a POST request for Register, I am getting user id as null in the response.
Below is my user model file:
import 'dart:convert';
User userFromJson(String str) => User.fromJson(json.decode(str));
String userToJson(User data) => json.encode(data.toJson());
class User {
final String id;
final String username;
final String profileImageUrl;
final String email;
User({
this.id,
this.username,
this.profileImageUrl,
this.email,
});
factory User.fromJson(Map<String, dynamic> json) => User(
id: json["id"],
username: json["username"],
profileImageUrl: json["image"],
);
Map<String, dynamic> toJson() => {
"id": id,
"username": username,
"image": profileImageUrl,
};
}
And this is the response I should be getting from API:
{
"user": {
"id": 2,
"username": "Davrick"
},
"image": null
}
Here is my register function:
static Future<User> createUser(
String email, String username, String password) async {
final response = await http.post("$apiURL/en/users/register/", body: {
"username": username,
"password": password,
"email": email,
});
if (response.statusCode != null) {
final String responseString = response.body;
return userFromJson(responseString);
} else {
return null;
}
}
And when I want to get user id, it is showing it as null although in the server I can see that it is adding users with new IDs.
_user != null
? Text(
"The user ${_user.username} with id ${_user.id} is created successfully.")
: Text("No users"),

Answer 1

Your fromJson constructor needs to first go through the user submap. Passing a key to the top level map does not search nested ones.
factory User.fromJson(Map<String, dynamic> json) => User(
id: json['user']["id"],
username: json['user']["username"],
profileImageUrl: json["image"],
);
Trying to get the value of a key that does not exist in a Map will return null, which is why you're seeing null, but not getting any exceptions.
You should likely do the same for toJson.
Map<String, dynamic> toJson() => {
"user": {
'id': id,
'username': username,
},
"image": profileImageUrl,
};
It turns out the OP posted an incorrect JSON format. With the correct format, the following will work.
factory User.fromJson(Map<String, dynamic> json){
return User(
id: json["user_id"],
username: json["username"],
profileImageUrl: json["image"],
);
}