In Flutter/Dart there are several ways to do API requests. Http package is probably the most widely used, followed by Dio & GetX. In this tutorial we are exploring differences between GetX(GetConnect) & Http.

The GETX package provides a class called GetConnect which allows for API requests using GETX ecosystem.The GetConnect class is part of the GetX package and provides a more integrated way to handle HTTP requests within the GetX ecosystem. Http package in other hand is solely dedicated to API requests/ networking. However, there are some differences in how responses are handled and parsed

The major differences between two different sources are in response handling and the error handling

  1. Response Handling:
    • GetConnect returns a Response object that contains the parsed JSON data directly in the body property.
    • The http package returns a http.Response object where the body is a raw string that needs to be parsed using jsonDecode.
  2. Error Handling:
    • GetConnect provides built-in error handling and status checks, which might differ from the http package.

In the example below we are fetching the list of Patient object for our healthcare application.We will compare how they look using different approach.

The first example fetches data using GetConnect class : here the response body is not parsed using jsonDecode because it has a built in parsing mechanism and returns the response object that contains parsed json data directly in the body property

class ApiConnection extends GetConnect {
  static const uri = 'https://your-api-url/api:6bEVqkTG/patients';
  Future<List<Patient>> getPatients() async {
    try {
      final response = await get(uri);
      if (response.statusCode == 200) {
        var result = response.body as List;
        print('result: $result');
        List<Patient> data =
            result.map((patient) => Patient.fromJson(patient)).toList();
        return data;
      } else {
        throw ('Error fetching data from API: ${response.statusCode}');
      }
    } catch (e) {
      throw ('Error fetching data from API: $e');
    }
  }
}

In second example we have a class that uses HTTP package to fetch the same data. But since we are working with http package when reading our result we have to first parse it using jsonDecode.

class PatientConnection {
    static const uri = 'https://your-api-url/api:6bEVqkTG/patients';
  Future<List<Patient>> getPatients() async {
    try {
      final response = await get(Uri.parse(url));
      if (response.statusCode == 200) {
        var result = jsonDecode(response.body) as List;
        print('result: $result');
        List<Patient> data =
            result.map((patient) => Patient.fromJson(patient)).toList();
        return data;
      } else {
        throw ('Error fetching data from API: ${response.statusCode}');
      }
    } catch (e) {
      throw ('Error fetching data from API: $e');
    }
  }
}

These two subtle differences can sometimes be the reason for error . Even though different ways of exception handling might not make much difference but reading/parsing data off you API makes a big difference. When switching between two different ways of API requests it is easy to mix up things. Often times i use http package if the project isn’t dependent on GetX . However there are times where the project is setup to use GetX architecture and it makes more sense to just use the GetConnect class that comes built in to handle API requests.

This little guide can be handy to compare and remind of such subtle but important differences .

Happy Debugging !

Praweg

A Curious and Creative fella with knack for coding.

Leave a Reply

Your email address will not be published. Required fields are marked *