【速報】Amplify Flutterがリリースされました！（プレビュー）#Amplify #Flutter

岡春奈

2020.08.21

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

こんにちは、クラスメソッドの岡です。

本日、Amplify FlutterのSDKとCLIがリリースされました！
現在はDeveloper Previewです。

モバイルアプリの開発がさらに加速化していきますね！

公式アナウンス

概要

Flutterは、Googleによって開発されたオープンソースのモバイルアプリケーションフレームワークです。
Flutterを使えば、モバイルアプリ/WEBアプリ/デスクトップアプリをワンソースで提供することができます。
さらにAmplifyを利用することでバックエンドとの統合もお手軽になります！

(なお、WebおよびデスクトッププラットフォームはAmplify Flutterではまだサポートされていません。)

機能

Developer Previewの時点で以下の機能が提供されています。

認証（Cognito）
分析（Pinpoint）
ストレージ（S3）

ロードマップとして、以下の機能も今後提供されるようです。

API(GraphQL and REST)
DataStore
Predictions
Storage（S3以外の拡張）
Escape Hatches

アーキテクチャ

出典: Announcing AWS Amplify Flutter (Developer Preview)

Amplify Flutterの内部ではAmplify iOS, Androidを使用しています。
将来的にはDartに置き換えて、Webやデスクトップなどの異なるプラットフォームもサポートできるよう拡張性をもたせた設計になっているようです。

インストール

CLI

$ npm install -g @aws-amplify/cli@flutter-preview

※Flutterのv1.20.0以上がインストールされている必要があります。

ユースケース(引用)

以下は公式ブログから引用したサンプルコードです。
現在はプレビュー版のため今後変更になる恐れがあります。ご注意ください。

認証: サインアップとサインイン

サインアップ

try {
  Map<String, dynamic> userAttributes = {
    'email': '[email protected]' ,
    'phone_number': '+10123456789',
    // additional attributes as needed
  };
  SignUpResult res = await Amplify.Auth.signUp(
    username: 'myusername',
    password: 'mysupersecurepassword',
    options: CognitoSignUpOptions(
      userAttributes: userAttributes
    )
  );
  setState(() {
    _isSignUpComplete = res.isSignUpComplete;
  });
} on AuthError catch (error) {
  print(error);
}

サインイン

try {
  SignInResult res = await Amplify.Auth.signIn(
    username: 'myusername',
    password: 'mysupersecurepassword',
  );
  setState(() {
    _isSignedIn = res.isSignedIn;
  });
} on AuthError catch (error) {
  print(error);
}

分析

アプリ内のカスタムイベントを記録

AnalyticsEvent event = AnalyticsEvent('PasswordReset');
event.properties.addStringProperty('Channel', 'SMS'); 
event.properties.addBoolProperty('Successful', true);
event.properties.addIntProperty('ProcessDuration', 792); 

Amplify.Analytics.recordEvent(event: event);

ストレージ

ファイルのアップロード

try {
  File local = await FilePicker.getFile(type: FileType.image);
  final key = 'myKey';

  S3UploadFileOptions options = S3UploadFileOptions(
      accessLevel: StorageAccessLevel.protected);

  UploadFileResult result = await Amplify.Storage.uploadFile(
      key: key, local: local, options: options);

  setState(() {
    _uploadFileResult = result.key;
  });
} catch (error) {
  print(error);
}

ダウンロードURLを生成

try {
  final key = 'myKey';
  GetUrlResult result =
      await Amplify.Storage.getUrl(key: key);
  setState(() {
    _getUrlResult = result.url;
  });
} catch (error) {
  print(error);
}