http

플러터에서 http 요청 (GET, POST, PUT, DELETE) 등의 요청을 해주는 패키지

http | Dart package

A composable, multi-platform, Future-based API for HTTP requests.

https://pub.dev/packages/http

install

dependencies:
  http: ^1.2.2
Dart
복사

import

import 'package:http/http.dart' as http;
Dart
복사

주요 내용

http 패키지 기능은 서버 측으로 데이터를 요청하고 서버가 보내준 데이터를 변환하여, 클라이언트 측 화면에서 출력하기 위해 사용합니다.

그래서,

서버로부터 응답받은 JSON 데이터를 변환하기 위한 convert 라이브러리랑 함께 사용합니다.

convert

JSON 데이터 형식 등 다양한 데이터 형식을 사용할 수 있는 데이터로 변환하는 패키지

convert | Dart package

Utilities for converting between data representations. Provides a number of Sink, Codec, Decoder, and Encoder types.

https://pub.dev/packages/convert

http 패키지 주요 메소드

메소드	설명	사용 예제
get	지정된 URL로부터 데이터를 가져옵니다.	http.get(Uri.parse('https://example.com'));
post	지정된 URL로 데이터를 보냅니다.	http.post(Uri.parse('https://example.com'), body: {'key': 'value'});
put	지정된 URL에 데이터를 업데이트합니다.	http.put(Uri.parse('https://example.com'), body: {'key': 'value'});
delete	지정된 URL의 데이터를 삭제합니다.	http.delete(Uri.parse('https://example.com'));
patch	지정된 URL에 부분적으로 데이터를 업데이트합니다.	http.patch(Uri.parse('https://example.com'), body: {'key': 'value'});
head	지정된 URL의 헤더 정보를 가져옵니다.	http.head(Uri.parse('https://example.com'));
read	지정된 URL로부터 응답 본문을 문자열로 가져옵니다.	http.read(Uri.parse('https://example.com'));
readBytes	지정된 URL로부터 응답 본문을 바이트 배열로 가져옵니다.	http.readBytes(Uri.parse('https://example.com'));
multipartRequest	멀티파트 폼 데이터와 함께 HTTP 요청을 보냅니다.	http.MultipartRequest('POST', Uri.parse('https://example.com'));

http 실습

GET 요청

POST 요청

PUT 요청

DELETE 요청

GET 요청

•

리스트( [ { }, { }, { } ] ) 형태를 응답 받아, 변경하는 경우

var url = "http://10.0.2.2:8080/board";

List<Board> list = [];
try {
  var response = await http.get(Uri.parse(url));
  print("::::: response - body :::::");
  print(response.body);
  // UTF-8 디코딩
  var utf8Decoded = utf8.decode(response.bodyBytes);
  // JSON 디코딩
  var boardList = jsonDecode(utf8Decoded);
  
  for (var i = 0; i < boardList.length; i++) {
    list.add(Board(
      no: boardList[i]['no'],
      title: boardList[i]['title'],
      writer: boardList[i]['writer'],
      content: boardList[i]['content'],
    ));
  }
  print(list);
} catch (e) {
  print(e);
}
Dart
복사

•

객체 { } 형태를 응답 받아, 변경하는 경우

var url = "http://10.0.2.2:8080/board/$no";
try {
  var response = await http.get(Uri.parse(url));
  print("::::: response - body :::::");
  print(response.body);
  // UTF-8 디코딩
  var utf8Decoded = utf8.decode(response.bodyBytes);
  // JSON 디코딩
  var boardJson = jsonDecode(utf8Decoded);
  print(boardJson);
  return Board(
    no: boardJson['no'],
    title: boardJson['title'],
    writer: boardJson['writer'],
    content: boardJson['content'],
  );
} catch (e) {
  print(e);
}
Dart
복사

플러터에서 로컬로 테스트 할 때는 10.0.2.2 로 지정해야한다.

var url = 'http://10.0.2.2:8080/board';
Dart
복사

현재 pc를 가리킬 때 로컬 호스트나 127.0.0.1로 지정을 하는데, 플러터에서는 10.0.2.2 입니다.

URL 를 인코딩 해서 지정해야한다.

var response = await http.get(Uri.parse(url));
Dart
복사

Uri.parse(url) 함수를 사용해서 URL 를 인코딩하여 지정해야합니다.

응답 데이터 확인하기

response.body
Dart
복사

응답 데이터를 변환하기

var utf8Decoded = utf8.decode( response.bodyBytes );
Dart
복사

JSON 형식의 데이터를 변환하기

jsonDecode() 함수는 convert 패키지에 포함된 함수입니다.

List<???> data = jsonDecode( utf8Decoded );
Dart
복사

•

JSON 

[
	{ 'name' : 'ALOHA1', 'age' : '10' },
	{ 'name' : 'ALOHA2', 'age' : '20' },
	{ 'name' : 'ALOHA3', 'age' : '30' },
]
Dart
복사

위와 같은 JSON 형식의 데이터를 Dart 의 List 로 변환하여 사용합니다.

POST 요청

var url = "http://10.0.2.2:8080/board";
try {
  var response = await http.post(
    Uri.parse(url),
    headers: {"Content-Type": "application/json"},
    body: jsonEncode({
      'title': _titleController.text,
      'writer': _writerController.text,
      'content': _contentController.text,
    }),
  );
  print("::::: response - body :::::");
  print(response.body);

  if (response.statusCode == 200 || response.statusCode == 201) {
    // 응답 성공 후 처리
  }
catch (e) {
  print(e);
}
Dart
복사

PUT 요청

var url = "http://10.0.2.2:8080/board";
try {
  var response = await http.put(
    Uri.parse(url),
    headers: {"Content-Type": "application/json"},
    body: jsonEncode({
      'no' : no,
      'title': _titleController.text,
      'writer': _writerController.text,
      'content': _contentController.text,
    }),
  );

  if (response.statusCode == 200 || response.statusCode == 204) {
	  // 응답 성공 후 처리
  }
  
} catch (e) {
  print(e);
}
Dart
복사

DELETE 요청

var url = "http://10.0.2.2:8080/board/$no";
try {
  var response = await http.delete(Uri.parse(url));
  print("::::: response - statusCode :::::");
  print(response.statusCode);
  
  if (response.statusCode == 200 || response.statusCode == 204) {
    // 삭제 성공 후 처리
  } 
} catch (e) {
  print(e);
}
Dart
복사