HTTP 통신

순순·2024년 10월 17일

flutter http

Flutter

목록 보기

6/16

앱과 서버가 데이터를 주고받기 위해서는 서로 어떻게 대화할지 정해둔 규칙과 방법이 있어야 하고, 그를 기반으로 네트워크 통신을 해야한다. 이런 규칙이 HTTP 와 API 다. 간단하게 요약하자면 다음과 같다.

HTTP : "어떻게 데이터를 보낼지"에 대한 규칙
API : "어떤 데이터를 보낼지"에 대한 규칙

HTTP 요청 전송

GET, POST, PUT, DELETE 등의 HTTP 요청을 전송.
각 요청은 특정 URL을 대상으로 하고, 요청 헤더와 본문(body)을 포함할 수 있다.
요청 후 서버로부터 받은 응답에서 상태 코드, 헤더, 본문 등을 확인하고 처리할 수 있다.
예시 코드

    import 'package:http/http.dart' as http;
    
    void main() async {
      var url = Uri.parse('https://example.com/data');
      var response = await http.get(url);
    
      if (response.statusCode == 200) {
        print('Response data: ${response.body}');
      } else {
        print('Request failed with status: ${response.statusCode}');
      }
    }

비동기 처리

HTTP 요청은 네트워크를 통해 이루어지므로 비동기적으로 처리된다.
이를 위해 Dart의 Future와 async/await 구문을 사용하여 비동기 작업을 수행해야 한다.
예시 코드
참고로 url 은 local.property 등 github 에 올라가지 않고 타인이 볼 수 없는 곳에 보관하는 등 보안처리가 필요하다.

    // 비동기 함수 생성
    // 반환값 없이 단순하게 요청 응답여부만 확인하기 때문에 void
    Future<void> fetchData() async {
    
    	// 문자열 형태의 URL을 Uri 객체로 변환
      var url = Uri.parse('https://example.com/data');
    	
    	// get 요청이 완료되면 Response 객체 반환
    	// Response 객체에는 statusCode, body, headers 등이 포함됨
      var response = await http.get(url);
      if (response.statusCode == 200) {
        print('Response data: ${response.body}');
      } else {
        print('Request failed with status: ${response.statusCode}');
      }
    }

헤더 설정

요청 헤더를 설정하여 인증 토큰, 콘텐츠 타입 등의 정보를 서버에 전달 할 수 있다. (앱 -> 서버)
예시 코드

    var url = Uri.parse('https://example.com/data');
    var response = await http.get(
      url,
      headers: {'Authorization': 'Bearer your_token_here'},
    );

본문 데이터 전송

POST, PUT 등의 요청에서는 본문 데이터를 전송할 수 있다.
JSON 데이터를 전송할 때는 jsonEncode 함수를 사용하여 데이터를 JSON 형식으로 변환해야 한다. (또는 JSON 형식으로 변환해주는 라이브러리나 플러그인을 사용하면 된다)
예시 코드

    var url = Uri.parse('https://example.com/data');
    var response = await http.post(
      url,
      
      // 헤더 설정
      headers: {'Content-Type': 'application/json'},
      
      // 본문 데이터 전송
      body: jsonEncode({'key': 'value'}),
    );

HTTP 사용 예시 (전체 코드)

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

void main() async {
  var url = Uri.parse('https://jsonplaceholder.typicode.com/posts');
  
  // GET 요청
  var response = await http.get(url);
  if (response.statusCode == 200) {
    var data = jsonDecode(response.body);
    print(data);
  } else {
    print('Failed to load data');
  }

  // POST 요청
  var postResponse = await http.post(
    url,
    headers: {'Content-Type': 'application/json'},
    body: jsonEncode({'title': 'foo', 'body': 'bar', 'userId': 1}),
  );
  if (postResponse.statusCode == 201) {
    var postData = jsonDecode(postResponse.body);
    print(postData);
  } else {
    print('Failed to post data');
  }
}