Flutter অ্যাপে HTTP API কল করা

Flutter-এ HTTP API কল করা একটি সাধারণ কাজ, যা ডেটা ফেচ করতে, ডাটাবেস বা সার্ভারের সাথে যোগাযোগ করতে, এবং অ্যাপ্লিকেশনের বিভিন্ন ডেটা ম্যানেজ করতে ব্যবহৃত হয়। Flutter-এ http প্যাকেজ ব্যবহার করে সহজেই API কল করা যায়। এখানে Flutter-এ HTTP API কল করার বিস্তারিত ধাপ এবং উদাহরণ দেওয়া হলো:

ধাপ ১: http প্যাকেজ ইন্সটল করা

প্রথমে pubspec.yaml ফাইলে http প্যাকেজ যোগ করুন:

dependencies:
  flutter:
    sdk: flutter
  http: ^0.13.5

এরপর flutter pub get চালিয়ে প্যাকেজ ইন্সটল করুন।

ধাপ ২: HTTP API কল করার উদাহরণ

Flutter-এ http প্যাকেজ ব্যবহার করে GET এবং POST রিকোয়েস্ট পাঠানোর উদাহরণ নিচে দেওয়া হলো:

উদাহরণ: GET রিকোয়েস্ট

GET রিকোয়েস্ট ব্যবহার করে আপনি কোনো API থেকে ডেটা ফেচ করতে পারেন, যেমন JSON ডেটা।

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  String? _data;

  Future<void> fetchData() async {
    final response = await http.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1'));

    if (response.statusCode == 200) {
      // সার্ভার থেকে ডেটা পাওয়া গেছে, JSON ডেটা ডিকোড করা হচ্ছে
      final Map<String, dynamic> jsonData = json.decode(response.body);
      setState(() {
        _data = jsonData['title']; // ডেটা সেভ করা
      });
    } else {
      // সার্ভার থেকে ডেটা না পাওয়া গেলে এরর দেখানো
      throw Exception('Failed to load data');
    }
  }

  @override
  void initState() {
    super.initState();
    fetchData();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('HTTP API Call Example'),
      ),
      body: Center(
        child: _data == null
            ? CircularProgressIndicator()
            : Text(_data!),
      ),
    );
  }
}

কোডের ব্যাখ্যা

1. http.get: একটি GET রিকোয়েস্ট পাঠানো হয়েছে এবং এর রেসপন্স চেক করা হয়েছে। Uri.parse ব্যবহার করে API এর URL পাস করা হয়েছে।
2. json.decode: JSON ডেটাকে ডিকোড করে Dart এর Map এ কনভার্ট করা হয়েছে।
3. setState: ডেটা সফলভাবে পাওয়ার পর UI আপডেট করতে setState ব্যবহার করা হয়েছে।
4. CircularProgressIndicator: যখন ডেটা লোড হচ্ছে, তখন লোডিং স্পিনার দেখানো হচ্ছে, এবং ডেটা লোড হয়ে গেলে Text উইজেট দিয়ে ডেটা দেখানো হচ্ছে।

উদাহরণ: POST রিকোয়েস্ট

POST রিকোয়েস্ট ব্যবহার করে আপনি সার্ভারে ডেটা পাঠাতে পারেন। Flutter-এ POST রিকোয়েস্ট করার জন্য নিচের কোড দেখুন:

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: PostDataScreen(),
    );
  }
}

class PostDataScreen extends StatefulWidget {
  @override
  _PostDataScreenState createState() => _PostDataScreenState();
}

class _PostDataScreenState extends State<PostDataScreen> {
  Future<void> postData() async {
    final url = Uri.parse('https://jsonplaceholder.typicode.com/posts');
    final response = await http.post(
      url,
      headers: <String, String>{
        'Content-Type': 'application/json; charset=UTF-8',
      },
      body: jsonEncode(<String, String>{
        'title': 'Flutter POST Request',
        'body': 'This is a test post request.',
        'userId': '1',
      }),
    );

    if (response.statusCode == 201) {
      // ডেটা সফলভাবে পোস্ট করা হয়েছে
      final jsonData = json.decode(response.body);
      print('Response: $jsonData');
    } else {
      // ডেটা পোস্ট করতে সমস্যা হলে
      throw Exception('Failed to post data');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('POST Request Example'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: postData,
          child: Text('Send POST Request'),
        ),
      ),
    );
  }
}

কোডের ব্যাখ্যা

1. http.post: একটি POST রিকোয়েস্ট পাঠানো হয়েছে, যেখানে headers এবং body পাস করা হয়েছে।
2. jsonEncode: Map কে JSON ফর্ম্যাটে রূপান্তর করা হয়েছে, যা POST রিকোয়েস্টের body হিসেবে পাঠানো হয়েছে।
3. headers: Content-Type সেট করা হয়েছে application/json হিসেবে, যাতে সার্ভার বুঝতে পারে যে ডেটা JSON ফর্ম্যাটে পাঠানো হয়েছে।
4. ElevatedButton: একটি বাটন তৈরি করা হয়েছে যা ক্লিক করলে POST রিকোয়েস্ট পাঠানো হয়।

HTTP API কল করার সময় কিছু টিপস:

Error Handling: API কল করার সময় সবসময় try-catch বা statusCode চেক করে এরর হ্যান্ডল করুন। উদাহরণ: যদি statusCode 200 না হয়, তাহলে একটি এক্সসেপশন থ্রো করতে পারেন।

Asynchronous Handling: async এবং await ব্যবহার করে API কলগুলি অ্যাসিনক্রোনাসভাবে পরিচালনা করুন, যাতে অ্যাপ্লিকেশন ব্লক না হয়।

Loading Indicator: API থেকে ডেটা লোড হওয়ার সময় ব্যবহারকারীদের জন্য CircularProgressIndicator বা অন্য কোনো লোডিং স্পিনার দেখান।

Response Format: নিশ্চিত করুন যে আপনি API থেকে আসা রেসপন্সের ফরম্যাট সঠিকভাবে ডিকোড করছেন। JSON ডেটা ডিকোড করতে json.decode ব্যবহার করুন।

Headers: API কল করার সময় প্রয়োজন অনুযায়ী headers ব্যবহার করুন, যেমন Authorization টোকেন বা কন্টেন্ট টাইপ।

অন্যান্য জনপ্রিয় HTTP প্যাকেজ এবং টুলস

Flutter-এ http প্যাকেজ ছাড়াও আরও কিছু প্যাকেজ ব্যবহার করা যায়:

1. Dio:
   • এটি আরও ফ্লেক্সিবল এবং অ্যাডভান্সড ফিচার যেমন Interceptors, Global Configuration, এবং Multipart Upload প্রদান করে।
2. Chopper:
   • এটি Retrofit-স্টাইল API কল করার একটি প্যাকেজ, যা API ইন্টারফেসগুলোকে সংগঠিত এবং কোডকে আরও পরিষ্কার করে।

সারাংশ

• Flutter-এ HTTP API কল করা সহজ এবং http প্যাকেজ ব্যবহার করে এটি খুব দ্রুত করা যায়।
• GET এবং POST রিকোয়েস্ট ব্যবহার করে সার্ভার থেকে ডেটা ফেচ করা এবং সার্ভারে ডেটা পাঠানো সম্ভব।
• সঠিকভাবে Error Handling, Async Handling, এবং Response Management নিশ্চিত করে একটি কার্যকরী HTTP API কল সিস্টেম তৈরি করা যায়।