web-dev-qa-db-ja.com

Flutterがサーバーから日本語の文字をフェッチすると、正しくデコードされない

Flutterを使用してモバイルアプリを構築しています。

日本語のテキストを含むjsonファイルをサーバーからフェッチする必要があります。返されるjsonの一部は次のとおりです。

_{
     "id": "egsPu39L5bLhx3m21t1n",  
     "userId": "MCetEAeZviyYn5IMYjnp",  
     "userName": "巽 裕亮",  
     "content": "フルマラソン完走に対して2018/05/06のふりかえりを行いました!"
}
_

Postmanまたはchrome=で同じリクエストを試行すると、期待される結果が得られます(日本語の文字は出力で適切にレンダリングされます)。

ただし、データが次のコードスニペットによってDartでフェッチされる場合:

_  import 'Dart:convert';
  import 'package:http/http.Dart' as http;

  //irrelevant parts have been omitted    
  final response = await http.get('SOME URL',headers: {'Content-Type': 'application/json'});
  final List<dynamic> responseJson = json.decode(response.body)
  print(responseJson);
_

Logcatのprintステートメントの結果は

_{
     id: egsPu39L5bLhx3m21t1n, 
     userId: MCetEAeZviyYn5IMYjnp, 
     userName: å·½ è£äº®, 
     content: ãã«ãã©ã½ã³å®èµ°ã«å¯¾ãã¦2018/05/06ã®ãµãããããè¡ãã¾ããï¼
}
_

日本語の文字(contentキーの値)だけが意味不明になり、他の日本語以外の値は引き続き正しく表示されることに注意してください。

2つの注意事項は次のとおりです。

  1. この日本語のテキストをText()を介してアプリに表示しようとすると、同じ意味不明な表現がレンダリングされるため、Android Studioのlogcatの障害ではありません。
  2. Text('put some Japanese text here directly')(例:Text('睡眠'))を使用すると、Flutterは正しく表示するため、日本語の文字を混乱させるのはTextウィジェットではありません。
18
Tran Triet

郵便屋さんを見ると、おそらくContent-Typeサーバーから送信されたhttpヘッダーにencodingタグがありません。これにより、Dart httpクライアントは本文をutf-8ではなくLatin-1としてデコードします。簡単な回避策があります:

http.Response response = await http.get('SOME URL',headers: {'Content-Type': 'application/json'});
List<dynamic> responseJson = json.decode(utf8.decode(response.bodyBytes));
39
Richard Heap