What is the best way to send data using an API to a springboot server using flutter?

Question

I'm working on a flutter mobile app and I'm wondering about the cleanest way to send data to a springboot server.

Answer 1

Here we do use flutter http package to obtain/ work with data from apis.

Here's an example

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

import 'package:http/http.dart' as http;

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Welcome to My App",
      home: AppBody(),
    );
  }
}

class AppBody extends StatefulWidget {
  @override
  _AppBodyState createState() => _AppBodyState();
}

class _AppBodyState extends State<AppBody> {
  final apiURL = "localhost:8080";
  final path = "/api/posts/read?search=shyam&start=1&limit=100";
  late var url;
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    // url = Uri.http(apiURL, path);
    // url = Uri.http(apiURL+path);
    url = Uri.http(amazonUri, path);
    getData();
  }

  Future<void> getData() async {
    var response = await http.get(url);
    if (response.statusCode == 200) {
      print("Data obtained successfully");
      print(response.body);
    } else {
      print("Issues with APIs");
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: Icon(Icons.agriculture),
        title: Text("App Bar"),
      ),
      body: Container(
        child: Center(
          child: Text("Hello world"),
        ),
      ),
    );
  }
}

Answer 2

I don't know whether it will be the cleanest way or not but you can use REST APIs to get/send data from/to Springboot Server.

For more information: https://medium.com/nerd-for-tech/flutter-series-connecting-ui-to-spring-boot-backend-f9874dc3dcd5

For your Flutter Project structure, you can use BLoC or any other state management.

Answer 3

You can use spring as RestAPI which has logic something like http method(get, post, put, delete..). (RestfulAPI is used many reason, one of reason is for various client.(mobile, web, pad,..))

You can send data from client to server on query string in uri, header or body.

Answer 4

**you can use dio packge for any kind of apis its easy and best and you do not need any kind maping it will be by dio package own its own **
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:dio/dio.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:rent_house/screens/Navigation/navBar.dart';

Future<String> signupApis({
  name,
  email,
  conatact,
  address,
  password,
  type,
  context,
}) async {
  // isloading:true;
  var apiURL = 'https://denga.r3therapeutic.com/public/api/register';

  var formData = FormData.fromMap({
    'name': name,
    'email': email,
    'contact': conatact,
    'address': address,
    'password': password,
    'type': type,
  });
  //final prefs = await SharedPreferences.getInstance();

  Dio dio = Dio();
  Response responce;
  try {
    responce = await dio.post(
      apiURL,
      data: formData,
    );

   // print("response datra " + responce.toString());
   
    SharedPreferences pref = await SharedPreferences.getInstance();
    var res1 = responce.data['user'];
    var token = res1['token'];

    Navigator.push(
      context,
      MaterialPageRoute(builder: (context) => Navbar()),
    );
    Fluttertoast.showToast(
        msg: "Login Successfull", backgroundColor: Colors.cyan);
    return '';
  } catch (e) {
    Fluttertoast.showToast(
        msg: "User Already exists", backgroundColor: Colors.cyan);
    return 'some thing wrong';
  }
}