HTTP GET Response in Flutter

02 Sep, 2021
There is no use of building a UI in Flutter until you Integrate it with your backend. A GET request is used to extract useful data from your backend to use it in your application. To perform a GET request in Flutter we need to follow 3 steps –
Get the latest dart Http package.Enter the package in pubspec.yaml file in your dependencies section.Import the package in your main.dart file.
Get the latest dart Http package.
Enter the package in pubspec.yaml file in your dependencies section.
Import the package in your main.dart file.
In the URL part, you can enter your backend Rest API link.
NOTE:
You can also divide the main.dart file in various sections but for simplicity, it is being performed only in one file.
A random JSON GET request URL from the Internet has been used here, which can be replaced with any backend Restful API.
Dart
import 'dart:convert';  import 'package:flutter/material.dart';import 'package:http/http.dart' as http;  void main() => runApp(MyApp());  class MyApp extends StatelessWidget {  @override  Widget build(BuildContext context) {    return MaterialApp(      home: HomePage(),    );  }}  //Creating a class user to store the data;class User {  final int id;  final int userId;  final String title;  final String body;    User({    this.id,    this.userId,    this.title,    this.body,  });}  class HomePage extends StatefulWidget {  @override  _HomePageState createState() => _HomePageState();}  class _HomePageState extends State<HomePage> {//Applying get request.    Future<List<User>> getRequest() async {    //replace your restFull API here.    String url = "https://jsonplaceholder.typicode.com/posts";    final response = await http.get(url);      var responseData = json.decode(response.body);      //Creating a list to store input data;    List<User> users = [];    for (var singleUser in responseData) {      User user = User(          id: singleUser["id"],          userId: singleUser["userId"],          title: singleUser["title"],          body: singleUser["body"]);        //Adding user to the list.      users.add(user);    }    return users;  }    @override  Widget build(BuildContext context) {    return SafeArea(      child: Scaffold(        appBar: AppBar(          title: Text("Http Get Request."),          leading: Icon(            Icons.get_app,          ),        ),        body: Container(          padding: EdgeInsets.all(16.0),          child: FutureBuilder(            future: getRequest(),            builder: (BuildContext ctx, AsyncSnapshot snapshot) {              if (snapshot.data == null) {                return Container(                  child: Center(                    child: CircularProgressIndicator(),                  ),                );              } else {                return ListView.builder(                  itemCount: snapshot.data.length,                  itemBuilder: (ctx, index) => ListTile(                    title: Text(snapshot.data[index].title),                    subtitle: Text(snapshot.data[index].body),                    contentPadding: EdgeInsets.only(bottom: 20.0),                  ),                );              }            },          ),        ),      ),    );  }}
surindertarika1234
Flutter
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Flutter - DropDownButton Widget
Flutter - Custom Bottom Navigation Bar
Flutter - Checkbox Widget
Flutter - Stack Widget
Flutter - Search Bar
Flutter - FutureBuilder Widget
Flutter - Flexible Widget
Flutter - BoxShadow Widget
Flutter - ListTile Widget
Flutter - File Structure