适用于 Flutter 的 AWS Amplify_flutter aws

最新推荐文章于 2024-05-08 11:12:27 发布

2401_84159966

最新推荐文章于 2024-05-08 11:12:27 发布

阅读量292

点赞数 4

分类专栏： 2024年程序员学习文章标签： flutter aws 云计算

本文链接：https://blog.csdn.net/2401_84159966/article/details/137688299

版权

2024年程序员学习专栏收录该内容

115 篇文章 1 订阅

订阅专栏

要将 Amplify 与 AWS 资源一起使用，您首先需要使用您的 AWS 账户对其进行配置。按照以下说明使用 AWS 账户配置 Amplify：

amplify configure

以后，amplify configure将要求您在浏览器中通过 AWS 控制台登录。登录后。CLI 将要求创建一个 IAM 用户。按照下面给出的代码：

Specify the AWS Region
? region:  # Your preferred region
Specify the username of the new IAM user:
? user name: the # User name for Amplify IAM user
Complete the user-created using the AWS console

创建一个用户以AdministratorAccess在您的项目中创建所有必需的资源。

您只能根据需要授予所需的权限

成功创建 IAM 用户后，它将在最后提供accessKeyId和secretAccessKey。当被询问时，将这些密钥提供给 CLI。

Enter the access key of the newly created user:
? accessKeyId:  # YOUR_ACCESS_KEY_ID
? secretAccessKey:  # YOUR_SECRET_ACCESS_KEY
This would update/create the AWS Profile in your local machine
? Profile Name:  # (default)

Successfully set up the new user.

成功配置 Amplify 后，导航到 JavaScript、iOS、Android 或 Flutter 项目根目录，并通过运行amplify init. 它会问你几个配置问题。在此命令之后，它将在您的根目录中创建一个放大文件夹以及该amplifyconfiguration文件。

Amplify CLI 命令

amplify init

这是创建 Amplify 支持的应用程序的一次性初始化过程。此命令可帮助您选择使用哪个 AWS 配置文件来分配所有 AWS 资源，并选择与项目对应的框架语言（Javascript、Flutter、Java、Swift）。amplify init在 S3 存储桶中创建一个父 CloudFormation 模板，该模板将包含嵌套的 CloudFormation 模板，以便在添加其他 AWS 资源时使用。同一个 S3 存储桶还包含 Lambda zip 文件以及 AppSync 架构和解析器文件。amplify/目录在成功完成amplify init命令后创建，其中包含所有必要的元数据文件。

这是amplify/目录结构的样子：

<project-root>
    |_amplify/
    |_ #current-cloud-backend/
        |_ amplify-meta.json
    |_ .config
        |_ aws-info.json
        |_ project-config.json
    |_ backend/
        |_amplify-meta.json
    |_.amplifyrc

amplify <category> add

用户可以使用此命令将必要的资源添加到他们的项目中。这将为amplify/backend/目录中的资源创建一个 CloudFormation 模板。此过程完成后，用户可以运行amplify push以运行 CloudFormation 模板并使用 Amplify IAM 用户将所有资源分配给该项目。

amplify push
该命令用于创建和更新云资源。使用它，CLI 会将最新的嵌套堆栈模板上传到 S3，然后调用 AWS CloudFormation API 来创建或更新资源。一旦 CloudFormation 成功完成，awsconfiguration.dart（对于 Flutter 项目）将被更新。此 CloudFormation 模板可在中找到amplify/backend/awscloudformation。

amplify pull
该amplify pull命令类似于git pull。它所做的只是获取远程后端配置并更新本地环境以匹配定义。当多个开发人员在同一个后端工作并且远程后端不断更新时，此命令很有帮助。建议amplify pull定期运行以防止后端冲突。

amplify console
此命令将使用 Amplify 控制台打开浏览器到您的项目。此控制台提供集中访问以管理和查看项目中使用的所有资源。所有用户数据也在控制台中进行分析。

命令列表：

amplify <category> <subcommand>
amplify push
amplify pull
amplify env <subcommand>
amplify configure
amplify console
amplify delete
amplify help
amplify init
amplify publish
amplify run
amplify status
amplify logout

Amplify控制台

Amplify 控制台可以通过 AWS 控制台访问，并充当全栈应用程序开发和部署的控制中心。Amplify 控制台由两部分组成：

Amplify托管
Amplify管理用户界面

Amplify托管

Amplify 托管用于管理应用程序的前端部分。它对应于使用 Git。Git 中的每个分支都已部署，并且可通过唯一的 URL 访问。

Amplify管理用户界面

Amplify Admin UI 用于管理所有后端服务，如 DataStore 架构、身份验证、功能、存储、API 等。Admin UI 为底层 AWS 服务提供控制台。

https://docs.amplify.aws/images/console/backend-envs.gif

将 Amplify 与Flutter集成

将 Amplify 添加到您的项目是一个非常简单且非常快速的过程。先决条件是您应该使用 AWS 账户设置 Amplify CLI。

创建新的Flutter项目：

i) 使用 Flutter CLI 创建您的项目。

flutter create flutter_amplify_demo

pubspec.yamlii）接下来，通过打开并粘贴下面给出的依赖项来放大对项目的依赖项：

dependencies:
  flutter:
    sdk: flutter

  amplify_flutter: '<1.0.0'
  amplify_auth_cognito: '<1.0.0'
  amplify_analytics_pinpoint: '<1.0.0'

iii）在此之后，运行Flutter pub get：

flutter pub get

iv) 现在要集成 Amplify，进入项目根目录并运行amplify init，如下所示：

➜  flutter_amplify_demo $ amplify init
Initializing new Amplify CLI version...
Done initializing new version.
Scanning for plugins...
Plugin scan successful
Note: It is recommended to run this command from the root of your app directory
? Enter a name for the project: flutteramplifydemo
? Enter a name for the environment: dev
? Choose your default editor: Visual Studio Code
? Choose the type of app that you're building: flutter
Please tell us about your project
? Where do you want to store your configuration file?: ./lib/
Using default provider: awscloudformation
? Select the authentication method you want to use: AWS profile

For more information on AWS Profiles, see:
https://docs.aws.amazon.com/cli/latest/userguide/cli-configure-profiles.html

? Please choose the profile you want to use: default

v) 要使用 Amplify 项目，必须在应用程序启动时对其进行初始化。为此，请编辑main.dart文件和下面给出的样板代码：

import 'package:flutter/material.dart';
import 'package:amplify_flutter/amplify.dart';
import 'package:amplify_analytics_pinpoint/amplify_analytics_pinpoint.dart';
import 'package:amplify_auth_cognito/amplify_auth_cognito.dart';
import 'amplifyconfiguration.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool _amplifyConfigured = false;

  @override
  void initState() {
    super.initState();
    _configureAmplify(); 
  }

  void _configureAmplify() async {
  }

  void _recordEvent() async {
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: const Text('Amplify Core example app'),
          ),
          body: ListView(padding: EdgeInsets.all(10.0), children: <Widget>[
            Center( 
              child: Column (
                children: [
                  const Padding(padding: EdgeInsets.all(5.0)),
                  Text(
                    _amplifyConfigured ? 'configured' : 'not configured'
                  ),                  
                  ElevatedButton(
                    onPressed: _amplifyConfigured ? _recordEvent : null,
                    child: const Text('record event')
                  )
                ]
              ),
            )
          ])
      )
    );
  }
}

在 Amplify 中使用任何 Amplify 封装功能之前，都必须提到配置调用。请注意，此init方法只能在项目的根目录调用一次。

void _configureAmplify() async {
  if (!mounted) return;

  // Add Pinpoint and Cognito Plugins
  Amplify.addPlugin(AmplifyAnalyticsPinpoint());
  Amplify.addPlugin(AmplifyAuthCognito());

  // Once Plugins are added, configure Amplify
  // Note: Amplify can only be configured once.
  try {
    await Amplify.configure(amplifyconfig);
  } on AmplifyAlreadyConfiguredException {
    print("Amplify was already configured. Was the app restarted?");
  }
  try {
    setState(() {
      _amplifyConfigured = true;
    });
  } catch (e) {
    print(e);
  }

}

addPlugin()应该总是在之前调用Amplify.configure()。多次调用Amplify.configure将导致异常。

这是 Amplify with Flutter 框架系列文章的第一篇。本系列将详细介绍 Amplify 为 Flutter 提供的各项服务。所以请继续关注。

非常感谢您阅读😁。这就是今天的内容。

如果大伙有什么好的学习方法或建议欢迎大家在评论中积极留言哈，希望大家能够共同学习、共同努力、共同进步。

小编在这里祝小伙伴们在未来的日子里都可以升职加薪，当上总经理，出任CEO，迎娶白富美，走上人生巅峰！！