A Detailed Guide to REST API Calls in Flutter
Introduction
Flutter, an open-source UI software development kit created by Google, is a powerful
tool for developing applications for various platforms from a single codebase. One of the
most common tasks in Flutter is interacting with REST APIs. This guide will walk you
through the process step by step.
Step 1: Setting Up
Before you start making API calls, you need to add the http package to your
pubspec.yaml file:
dependencies:
flutter:
sdk: flutter
http: ^0.13.3
Then run flutter pub get to fetch the package.
Step 2: Making a GET Request
A GET request retrieves data from a server. Here’s how you can make a GET request in
Flutter:
import 'package:http/http.dart' as http;
import 'dart:convert';
void getData() async {
http.Response response = await
http.get('https://api.example.com/data');
if (response.statusCode == 200) {
String data = response.body;
var decodedData = jsonDecode(data);
print(decodedData);
} else {
print(response.statusCode);
}
}
Step 3: Making a POST Request
A POST request sends data to a server. Here’s how you can make a POST request in
Flutter:
import 'package:http/http.dart' as http;
import 'dart:convert';
void postData() async {
http.Response response = await http.post(
'https://api.example.com/data',
body: jsonEncode(<String, String>{
'key': 'value',
}),
);
}
if (response.statusCode == 200) {
String data = response.body;
var decodedData = jsonDecode(data);
print(decodedData);
} else {
print(response.statusCode);
}
Step 4: Adding Headers to Your Requests
Headers provide additional information about the request or the response. Here’s how
you can add headers to your requests:
import 'package:http/http.dart' as http;
import 'dart:convert';
void getDataWithHeaders() async {
http.Response response = await http.get(
'https://api.example.com/data',
headers: <String, String>{
'Content-Type': 'application/json; charset=UTF-8',
},
);
if (response.statusCode == 200) {
String data = response.body;
var decodedData = jsonDecode(data);
print(decodedData);
}
} else {
print(response.statusCode);
}
Step 5: Handling Different HTTP Methods
In addition to GET and POST, there are several other HTTP methods that you might
need to use, such as PUT, DELETE, PATCH, etc. Here’s how you can make a PUT
request:
import 'package:http/http.dart' as http;
import 'dart:convert';
void putData() async {
http.Response response = await http.put(
'https://api.example.com/data',
headers: <String, String>{
'Content-Type': 'application/json; charset=UTF-8',
},
body: jsonEncode(<String, String>{
'key': 'value',
}),
);
}
if (response.statusCode == 200) {
String data = response.body;
var decodedData = jsonDecode(data);
print(decodedData);
} else {
print(response.statusCode);
}
Remember, each HTTP method has its own semantics and is designed to perform a
specific action in a RESTful API. Always choose the appropriate method for the action
you want to perform.
That concludes our detailed guide on making REST API calls in Flutter. Happy coding!