개요
개발을 하다보면, http를 이용하여 api를 호출해야 하는 경우가 있다.
Flutter에서는 Http를 이용해 호출할 수 있다.
설치
pub.dev 에서 http를 검색하면, 설치 방법과 최신 버전을 확인할 수 있다.
아래의 두 가지 방법 중 원하는 방법을 선택하여 설치해주면 된다.
Flutter :
flutter pub add http
pubspec.yaml
dependencies:
http: ^1.1.0
사용
사용을 위해 import를 해주어야 한다.
import 'package:http/http.dart';
따로 이름을 설정을 해주려면 as를 통해 다음과 같이 해주면 된다.
import 'package:http/http.dart' as http;
http.get()의 인자로는 Uri가 오게 된다. 우리가 지정해 놓은 baseUrl은 String 타입이므로,
Uri.parse(baseUrl)을 통해 Uri 형태로 만들어준다.
이 후 http.get()을 통해 응답에 대한 결과를 받을 수 있다.
아래 코드를 예시로 하면, url을 기준으로, api 통신 결과가 200(성공) 이면, 해당 결과를 json형태로 decode하여 저장을 한다.
import 'package:http/http.dart' as http;
class ApiService {
static const String baseUrl = ""
static Future<List<WebtoonModel>> getTodaysToons() async {
List<WebtoonModel> webtoonInstances = [];
final url = Uri.parse('$baseUrl');
final response = await http.get(url);
if (response.statusCode == 200) {
final List<dynamic> webtoons = jsonDecode(response.body);
for (var webtoon in webtoons) {
webtoonInstances.add(WebtoonModel.fromJson(webtoon));
}
return webtoonInstances;
}
throw Error;
}
}
이 때 api의 형태의 맞추어 Class 를 생성해준다.
나의 경우에는 id, thumb, title의 형태로 반환되므로, 다음과 같이 만들어준다. fromJson을 통해 각 매칭되는 값에 맞추어 저장해준다.
class WebtoonModel {
final String title, thumb, id;
WebtoonModel.fromJson(Map<String, dynamic> json)
: title = json['title'],
thumb = json['thumb'],
id = json['id'];
}
이 때 반환 값이 Future인데 future의 경우에는 미래의 값이다.
async로 비동기 처리를 하게되어, 아직 값이 도착하지는 않았지만, Future<타입명> 곧 타입명이 도착한다는 뜻이다.
'Flutter > Study' 카테고리의 다른 글
[Flutter] - Future Builder (0) | 2023.07.20 |
---|