httpパッケージの利用方法
dartでhttp通信を利用するには、一般的にはhttpパッケージを利用します。httpパッケージを利用する場合には、以下のようにpubspec.yamlにhttpパッケージを追加します。
dependencies: : （省略） http: ^0.13.4
httpパッケージを使ったGETリクエスト
httpパッケージを使ってGETリクエストをする場合の実装例がリスト3です。このような使い方がもっとも簡単な利用方法です。
// （1） httpパッケージのインポート処理
import 'package:http/http.dart' as http;
// : （省略）
class HttpLoginController extends ILoginController{
Map _config = {};
@override
Future config() async{
// （2） リクエストするURLの作成
var url = Uri.parse("http://hostname/config.php");
// （3） GETリクエスト
var response = await http.get(url);
// （4） ステータスコード
if(response.statusCode == 200){
// （5） 日本語が文字化けしてしまう
// _config = jsonDecode(response.body) as Map;
// （6） 日本語が含まれている場合
_config = jsonDecode(utf8.decode(response.bodyBytes)) as Map;
return Future.value(true);
}
else{
return Future.value(false);
}
}
// : （省略）
}
httpパッケージを利用するには、（1）のように名前をつけてインポートします。続いて、リクエストするURLは（2）のようにUriクラスのインスタンスを作成します。UriクラスはGETパラメータなどがある場合にはより簡単にリクエストURLの文字列が作成できるようになります。
そして、（3）でGETリクエストを送信します。また、レスポンスコードは（4）のようにstatusCodeで取得可能です。また、（5）のようにレスポンスデータの文字列はbodyで取得できます。今回のレスポンスデータはJSONデータであるため、取得したデータを（5）のようにjsonDecodeを使ってMap形式に変換します。
しかし、レスポンスデータには日本語が含まれているために、この処理では文字化けしてしまうので、bodyプロパティではなく、（6）のようにレスポンスデータのバイトデータを保持するbodyBytesを使います。このデータをutf8でデコードした文字列を使って処理するようにします。
POST処理をする
続いて、POST処理をする場合にはリスト4のように処理します。
class HttpLoginController extends ILoginController{
// （省略）
Future loginForm(String loginId, String password) async {
var url = Uri.parse("http://hostname/login/form.php");
// （1） POST処理をする
var response = await http.post(url, body : {
'login_id' : loginId,
'password' : password
},headers: {
'X-Chat-App-Key' : 'api_key'
});
// : （省略）
}
}
（1）のようにPOSTするデータはbodyに設定し、追加のヘッダがある場合には、headersに設定します。headersはGETリクエストでも利用できます。また、bodyにMap形式を使えば、自動的にリクエストするデータはapplication/x-www-form-urlencoded形式になります。
しかし、POSTデータをJSON形式、つまり、application/json形式でリクエストしたい場合に自動的に変換されるのは困ります。その場合には、リスト5のようにします。
class HttpLoginController extends ILoginController{
// （省略）
Future loginJson(String loginId, String password) async{
var url = Uri.parse("http://hostname/login/json.php");
// （1） Content-Typeを設定する
var headers = {
'Content-Type': 'application/json',
'X-Chat-App-Key' : 'api_key'
};
var body = {
'login_id' : loginId,
'password' : password
};
// （2） bodyにJSONエンコードし設定
var response = await http.post(url, body : jsonEncode(body),headers: headers);
// : （省略）
}
}
Content-Typeのヘッダ情報は（1）のように設定します。ただし、この設定処理はヘッダ情報を変更しているだけです。つまり、実装に送信するデータは（2）のように実際にjsonEncode関数を使ってエンコードしbodyに設定します。
今回はGET／POST処理だけを紹介していますが、他のメソッドも同様なので、詳しくはこちらを参照してください。
