Flutter GET POST using dio || Get & Post call at once

Flutter GET POST :

Flutter GET POST both the network calls are implemented concurrently using dio library is explained in this part of the tutorial.

Api calls are classified based on the work they do like creating data we make use of POST, fetching the data we make use of GET, updating the data we make us of PUT, deleting the data we use DELETE.

We have used GET and POST request here you may try any other api request as a practice.

These are the few types i have specified you can find much more information at https://www.amplifyabhi.com/2022/06/10/http-response-codes/

It might sound very interesting to execute both flutter get post at once we have clearly explained this scenario through a video tutorial.

 

We have seen the individual implementation of flutter dio GET. And complete play list of tutorial is provided here.

 

Flutter GET POST Video Tutorial :

Go through below tutorial for more information on GET + POST api call

 

pubspec.yaml:

Add dio library to your pubspec file. Provide the latest version to avoid unwanted errors.

dependencies:
  flutter:
    sdk: flutter
  dio: ^4.0.6

main.dart :

We will be executing both GET and POST implementations for a given api’s and will fetch the response at once using array list.

Can fetch the data according to the positions.

 

Provide GET request

dio.get('https://jsonplaceholder.typicode.com/posts/1'),

Provide POST request

dio.post('https://jsonplaceholder.typicode.com/posts')

 

can fetch the data as here 0 and 1 represents the location of data inside the array as we got our response stored in array.

print(response[0].data);
print(response[1].data);

 

create a dio object and make api call.

var dio = Dio();

 

You can find the length of the array as

response.length

 

Provide a simple code to make a button click so that api call can be started.

Column(
  mainAxisAlignment: MainAxisAlignment.center,
  children: [
    TextButton(onPressed: (){
      fetchData();
    }, child: const Text("Get / Post Data"))
  ],
),

 

 

void fetchData() async{
  var dio = Dio();
  var response = await Future.wait([
   
    dio.get('https://jsonplaceholder.typicode.com/posts/1'),
    dio.post('https://jsonplaceholder.typicode.com/posts')
  ]);
  print(response.length);
  print(response[0].data);
  print(response[1].data);
}

 

Flutter get post code :

Providing the full code for flutter get post api implementation.

import 'package:dio/dio.dart';
import 'package:flutter/material.dart';

void main(){
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              TextButton(onPressed: (){
                fetchData();
              }, child: const Text("Get / Post Data"))
            ],
          ),
        ),
      ),
    );
  }
}

void fetchData() async{
  var dio = Dio();
  var response = await Future.wait([
    
    dio.get('https://jsonplaceholder.typicode.com/posts/1'),
    dio.post('https://jsonplaceholder.typicode.com/posts')
  ]);
  print(response.length);
  print(response[0].data);
  print(response[1].data);
}

 

If you have any query in this tutorial on flutter get post do let us know in the comment section below or go through the video tutorial for complete output provided.

If you found this tutorial on flutter get post interesting share, like us for more interesting updates.