【速報】Amplify Flutterがリリースされました!(プレビュー)#Amplify #Flutter

2020.08.21

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

本日、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': 'my@email.com' ,
    '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);
}

参考

Flutter (Preview) - Getting started - Amplify Docs
Announcing AWS Amplify Flutter (Developer Preview)
aws-amplify/amplify-flutter - Github