Notice
Recent Posts
Recent Comments
Link
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Tags
more
Archives
Today
Total
관리 메뉴

coding etude

[flutter] json 데이터 사용하기 본문

Flutter(Dart)

[flutter] json 데이터 사용하기

코코리니 2022. 10. 11. 15:38

 

 

json데이터를 사용하기 위서는 수동 직렬화 방법과 외부 라이브러리를 통한 자동 직렬화 방법이 있다.

 

1. 수동 직렬화

 - dart언어에 기본적으로 사용 할 수 있는 기능으로 dart:convert 를 참조한다

장점 :  jsonEncode(jsonfile), jsonDeconde(jsonfile)로 바로 사용이 용이하다. 관리 할 json 데이터가 적을 때 사용하기 좋다.

// json 예시
{
	"name": "kim",
    "age": "13"
}

// 수동 직렬화
Map<String, dynamic> user = jsonDeconde(json);

print('name: ${user['name']});

String json = jsonEncode(user);

단점: 런타임(실행하는 단계)에서 바로 Map를 리턴하기 때문에 관리해야할 json데이터가 많아져 오타나 누락 같은 실수가 있을 시 에러를 발생 시킨다. 컴파이 단계에서 오류를 확인 할 수 없다.

 

2. 자동 직렬화

  - 외부 라이브러리를 사용 하여 인코딩 코드를 자동으로 생성하게 하는 것을 의미한다. (json_serializable 사용)

장점 : json 데이터를 사용 할때 마다 코드를 직접 작성하지 않아도 되고 컴파일 단계에서 오류를 발견하여 관리하기가 쉬워짐.

단점: 초기 설정 단계가 필요하고 프로젝트의 탐색기가 생성된 설정 파일로 인해 복잡해 질 수 있다.

// pubspec.yaml 라이브러리 추가
dependencied:
  json_annotation: (vision)

dev_dependencies: 
  build_runner:
  json_serializable:
  
// 설정 파일 (user.dart)

import 'package:json_annotation/json_annotation.dart';

part 'user.g.dart' // 상세 설정 파일


@JsonSerializable()
class User {
	String name;
    String age;
    
    User(this.name, this.age);

	factory User.fromJson(Map<String, dynamic> json) => _$UserFormJson(json);
    Map<String, dynamic> toJson() => _$UserToJson(this);
}

// user.g.dart

part of 'user.dart'

User _$UserFromJson(Map<String, dynamic> json) => User(
	name: json['name'] as String,
    age: json['age'] as String
)

Map<String, dynamic> _$UserToJson(User instance) => <String, dynamic>{
		'name': instance.name,
        'age': instance.age
	};

위 방법 처럼 설정 값 세팅에 시간이 많이 소요되기 때문에 관리해야 할 데이터가 많아 질 수록 설정 파일 및 설정 값이 많아진다.

하지만, 한번 설정으로 후속 관리가 편하다는 장점이 있다.

 

사용 예시

Future<Map<String, dynamic>> reqUser() async {
	var req = User.toJson(); // user.dart 의 toJson()
    var res = // Api (url, req);
    if(res.statusCode != 200){
    	throw Exception();
    }
    return jsonDecode(res.body) as Map<String, dynamic>;
}

 

json_annotation 의 사용

- 주석을 사용하여 json데이터의 값을 설정 할 수 있다.

//주석을 통하여 명명법을 바꿔줄수 있다.
@JsonKey(name: 'user_data')
final String userData;

// 변수의 defaultValue와 required를 지정 할 수 있다.
@JsonKey(defaultValue: false)
bool isUser;

@JsonKey(required: true)
String name;

// nested json 일 경우에도 사용 가능 

{
	'name' : 'kim',
    'addr': [
    	'city': 'NY',
        'street': 'abc'
    ]
}
// 기본적인 직렬화를 사용 한다면 오류 발생

@JsonSerializable(explicitToJson: true)// explicitToJson 설정 값이 없다면
// {name: kim, address: Instance of 'addr'} 를 리턴 하여 오류.

class User {
  String name;
  Address addr;

  User(this.name, this.addr);

  factory User.fromJson(Map<String, dynamic> json) => _$UserFromJson(json);
  Map<String, dynamic> toJson() => _$UserToJson(this);
}