Dart / Flutter

Flutter アプリと Dart サーバーのための Dart イディオムなパターン

シンプルなケースなら http パッケージ、インターセプターやリトライが欲しければ dio を使います。以下では http を使います —— Flutter の Dart SDK に標準で同梱されています。

pubspec.yaml

dependencies:
  http: ^1.2.2

Configure

import 'dart:convert';
import 'dart:io';
import 'package:http/http.dart' as http;

const api = 'https://openapi.thunderbit.com/openapi/v1';
final headers = <String, String>{
  'Authorization': 'Bearer ${Platform.environment['THUNDERBIT_API_KEY']}',
  'Content-Type': 'application/json',
};

ページを Distill する

Future<String> distill(String url) async {
  final res = await http.post(
    Uri.parse('$api/distill'),
    headers: headers,
    body: jsonEncode({'url': url}),
  );
  if (res.statusCode >= 400) throw Exception(res.body);
  final body = jsonDecode(res.body) as Map<String, dynamic>;
  return body['data']['markdown'] as String;
}

構造化データを Extract する

Future<Map<String, dynamic>> extract(String url) async {
  final res = await http.post(
    Uri.parse('$api/extract'),
    headers: headers,
    body: jsonEncode({
      'url': url,
      'schema': {
        'type': 'object',
        'properties': {
          'name':  {'type': 'string'},
          'price': {'type': 'number'},
        },
        'required': ['name', 'price'],
      },
    }),
  );
  return (jsonDecode(res.body) as Map<String, dynamic>)['data'];
}

Flutter UI のコツ

呼び出しは FutureBuilder でラップして UI をブロックしないようにしましょう —— 本番では API Key は Flutter アプリではなく Dart サーバー側に持たせてください。

Batch ジョブは投入後にサーバー側の Webhook ハンドラに任せます。Webhooks を参照。

公式 Dart SDK は開発中です —— もう少しお待ちください。