본문 바로가기

프론트엔드/Flutter

[Flutter] Client Post 통신 시 body에 json값 사용하는 방법

안녕하세요, 황대성입니다.

이번 글에서는 Flutter에서 Client를 사용하여 API 통신을 할 때 POST에서 body에 json값을 넣는 방법에 대해 포스팅하려 합니다!

 

제가 개발하다가 이건 공유하면 좋다고 생각이 들어 글을 작성합니다!

도움이 되었으면 좋겠습니다.


풀 코드를 통해 한 번에 설명해드리겠습니다!

import 'dart:convert';
import 'package:http/http.dart' show Client;
import 'package:http/http.dart';

Future<Model명> getApiTest(List<String> data, String name) async {
    var url = "api url";

    try {
      Map data = {"harbor": harbor, "dock": dockName};

      var body = json.encode(data);

      final response = await client.post(
        url, 
        headers: {"Content-Type": "application/json"}, 
        body: body);
    } catch (e) {
      print(e);

      return null;
    }
  }

제일 먼저 제가 body에 넣고싶은 데이터를 Map으로 감싸줍니다.

 

Map으로 감싸준 data를 json.encode를 통해 json 형식으로 바꾸어줍니다.

 

client.post를 통해 통신을 진행하고, headers에 무조건 {"Content-Type": "application/json"}를 넣어주어야합니다.

 

저걸 넣어주지 않으면 통신에서 에러가 발생합니다...(저거 때문에 몇 시간을 삽질...)

 

위와같이 해주신다면 오류가 발생하지 않고, 깔끔하게 통신이 가능합니다!


오늘도 제 글을 읽어주셔서 감사합니다!

많은 도움이 되었으면 좋겠습니다.

 

참고한 사이트

sysocoder.com/flutter-%EB%84%A4%ED%8A%B8%EC%9B%8C%ED%81%AC-%EA%B8%B0%EB%B3%B8-get-post/

 

SysoCoder

SysoCoder 개발 블로그

sysocoder.com