utf-8 encoding in api result - dart/flutter

Question

I'm reading an API that has latin characters (portuguese), but when displaying the results they appear distorted.

This is the original API content:

[{"id":23,"nome":"Feira de automóveis 2021","local":"Anhembi São Paulo","dataEvento":"2021-12-16","valorEntrada":"150.00","foto":null,"observacao":"Evento fictício para testes apenas"}]

And this is the result:

[{id: 23, nome: Feira de automÃ³veis 2021, local: Anhembi SÃ£o Paulo, dataEvento: 2021-12-16, valorEntrada: 150.00, foto: null, observacao: Evento fictÃcio para testes apenas}]

Below the code I am using:

  Future<dynamic>? listar() async {
    final url =
        Uri.parse('https://www.limeiraweb.com.br/api_eventos/listar.php');
    final response = await http.get(url);
    if (response.statusCode == 200) {
      final jsonResponse = convert.jsonDecode(response.body);
      print(jsonResponse);
    }
  }

How to fix this problem?

nanobar · Accepted Answer · 2022-02-15 12:52:17Z

10

Either change/add this HTTP response header on the server:

content-type: application/json; charset=utf-8

Or force the encoding:

final jsonResponse = convert.jsonDecode(utf8.decode(response.bodyBytes));

answered Feb 15, 2022 at 12:52

nanobar

66.8k26 gold badges155 silver badges178 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

lava · Accepted Answer · 2022-02-15 13:17:34Z

3

You can use this method

Utf8Decoder().convert(response.bodyBytes)

eg:-

      final url = Uri.parse('https://www.limeiraweb.com.br/api_eventos/listar.php');
  final response = await get(url);
  if (response.statusCode == 200) {
    final jsonResponse = jsonDecode(Utf8Decoder().convert(response.bodyBytes));
    print(jsonResponse);
  
  }

OR

utf8.decode(response.bodyBytes);

eg:-

 final url = Uri.parse('https://www.limeiraweb.com.br/api_eventos/listar.php');
  final response = await get(url);
  if (response.statusCode == 200) {

    final jsonResponsed = jsonDecode(utf8.decode(response.bodyBytes));
    print(jsonResponsed);
  
  }

answered Feb 15, 2022 at 13:17

lava

7,6262 gold badges44 silver badges35 bronze badges

2 Comments

Luis Ribeiro Over a year ago

It worked perfectly in both examples. Thanks a lot for the help. God bless you

Timo Over a year ago

Note this is a good opportunity to create an extension method on Response because a client API seldomly travels alone. For example: Map<String,dynamic> get bodyJson => convert.jsonDecode(utf8.decode(response.bodyBytes));.

Collectives™ on Stack Overflow

utf-8 encoding in api result - dart/flutter

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related