공부/flutter
HTTP 통신
whaeun
2022. 12. 18. 21:59
1. HTTP 통신에 이용되는 패키지
import 'package:http/http.dart' as http;
import 'dart:convert';
1) import 'package:http/http.dart' as http;
http 패키지는 http의 get, post, put 등과 같은 메소드들을 사용할 수 있도록 도와주는 패키지로 'as http'를 붙여 http 패키지의 메소드들을 호출할 때, 프리픽스를 붙여 호출하도록 하여 메소드를 더욱 명확하게 사용할 수 있도록 한다.
2) import 'dart:convert';
dart:convert 패키지는 utf8을 지원해 주어 한글이 깨질 경우, 해당 패키지를 통해 한글이 깨지지 않도록 지원 받을 수 있다.
var body = jsonDecode(utf8.decode(response.bodyBytes));
2. HTTP 통신 사용 예시
Flutter는 무언가 변경될 때마다 build() 메서드를 호출하기 때문에 네트워크 요청 코드를 build() 메서드 안이 아닌 initState()에서 호출하는 것이 좋다.
[ 인터넷에서 데이터 가져오는 방법 ]
1. http 패키지 추가하기.
2. http 패키지를 사용하여 네트워크 요청 생성하기.
3. 응답 정보를 커스텀 Dart 객체로 변환하기.
4. 가져온 데이터를 Flutter에 보여주기.
1) get 메소드 사용 예시
void userInfo() async {
var url = Uri.http('${serverHttp}:8080', '/members/info');
var response = await http.get(url, headers: {
'Accept': 'application/json',
"content-type": "application/json",
"X-AUTH-TOKEN": "${authToken}"
});
if (response.statusCode == 200) {
var body = jsonDecode(utf8.decode(response.bodyBytes));
var data = body["response"];
email = data["email"].toString();
name = data["name"].toString();
}
else {
print('error : ${response.reasonPhrase}');
}
}
2) post 메소드 사용 예시
Future<void> changeName(String editName) async {
var url = Uri.http('${serverHttp}:8080', '/members/name');
final data = jsonEncode({'name': editName});
var response = await http.patch(url, body: data, headers: {
'Accept': 'application/json',
"content-type": "application/json",
"X-AUTH-TOKEN": "${authToken}"
});
if (response.statusCode == 200) {
var body = jsonDecode(response.body);
}
else {
print('error : ${response.reasonPhrase}');
}
}
* Future Class : 미래의 특정 시점에 사용 가능한 잠재적인 값이나 에러를 나타내기 위해 사용된다.
3. 참고 자료
- https://docs.flutter.dev/development/data-and-backend/networking
- https://docs.flutter.dev/cookbook/networking/fetch-data