AWS Amplify 란 무엇입니까?

모바일 어플리케이션 및 웹 어플리케이션을 간단하게 구축하는 프레임워크 지원
예를 들어 iOS 앱을 만들려면 인증에서 코그니토 설정, 액세스용 API Gateway 설정 등을 별도로 만들어야 한다.
그러나 AWS Amplify를 사용하면 Cloudformation을 통해 AWS Amplify로부터 모든 설정을 할 수 있습니다.
또한 구축된 환경도 delete 명령을 통해 한꺼번에 삭제할 수 있다

이 문장으로 설명하다

AWS Amplify를 사용한 iOS 개발의 토대는 다음과 같습니다.

Cognito의 iOS 애플리케이션을 사용한 로그인 기능 설치

S3에 데이터 업로드 기능 설치

App Sync를 사용하여 DynamoDB에 데이터를 추가하고 데이터를 얻으며 하위 화면 생중계

감사의 말

기본적으로 공식 iOS 샘플 제작 내용을 참고합니다.
대단히 감사합니다
https://aws-amplify.github.io/docs/
그럼 바로 시작합시다.

전제 조건

Mac 터미널이 있음(Mac OS High Sierra를 통해 작업 확인됨)
Xcode 설치 완료(Xcode10.1 동작 확인)
cocopods가 설치되었음(pod1.5.3으로 동작이 확인됨)

AWS Amplify 설치

$ npm install -g @aws-amplify/cli

# 途中でAWSマネジメントコンソールへのログインを求められるので、ログインする
# Amplify用のIAMユーザの作成(Admin権限あり)を求められるので、作成する
# AWS CLIですでに設定を行っている場合は、そちらの設定を利用可能なので、この手順は不要
$ amplify configure

Comgnito를 사용한 iOS 애플리케이션의 로그인 기능

Xcode 프로젝트의 기본 작성

Xcode 프로젝트 제작 화면에서 "Createa new Xcode 프로젝트"

선택

Single View Apply 선택

Product Name에 항목 이름을 입력합니다(이번에는amplify-learn).

Language가 "Swift"

임을 확인

Include Unit Tests 및 Include UI Tests에 대한 검사 취소

대상 폴더를 저장하려면 "Create"(이번에는 ~/Downloads에 저장)

를 누르십시오

AWS Amplify의 기초 작성

# 保存したXcode Project内に移動
# 今回はDownloads直下に作成したので以下のコマンドで移動
$ cd ~/Downloads/amplify-learn

# 初期設定
$ amplify init
# デフォルトのエディタを聞かれるので、好きなものを選択（今回はNoneを選択）
# ビルドするアプリのタイプを聞かれるので、「ios」を選択
# AWSのプロファイルを使用するか聞かれるので、「y」を入力
# 設定しているプロファイルを選択する（使用するIAMキーのこと、admin権限が必要）

위 명령을 모두 실행하면 Cloudformation에 스택이 생성됩니다.

사용할 iOS SDK 설치 및 설정

# Xcodeプロジェクトのルートに移動
$ cd ~/Downloads/amplify-learn

# podファイル作成
$ pod init

위 명령을 실행하면 Podfile이라는 파일이 생성됩니다.
아래와 같이 그 파일을 편집하십시오
Podfile

target 'amplify-learn' do
  use_frameworks!

  # Pods for amplify-learn
  pod 'AWSMobileClient', '~> 2.7.0'
  pod 'AWSAuthUI', '~> 2.7.0'
  pod 'AWSUserPoolsSignIn', '~> 2.7.0' 
end

다음 명령은 Xcode 프로젝트에 필요한 SDK를 추가합니다.

# 必要なSDKを追加
$ pod install --repo-update

앞으로 "amplify-learn.codeproj"를 열지 말고 "amplify-learn.ccworkspace"를 열어 주세요.

Cognito 작성 및 설정

이번 iOS 어플리케이션 인증은 Cognito를 사용합니다.
따라서 사용자 수영장과 ID 수영장을 만들어야 한다

$ amplify add auth
# 設定をどうするか聞かれるので、デフォルト設定を選択する

# Authが追加されているか確認する
$ amplify status

오케이
Category
Resource name
Operation
Provider plugin
Auth
cognitoa8619e4c
Create
awscloudformation

# Cognitoを作成するようにクラウド側に命令
$ amplify push
# 続けていいか聞かれるので、trueを選択

상술한 지령은 약간의 시간이 필요하다
명령이 끝나면 "awsconfiguration.json"이라는 파일을 생성합니다
사용자 그룹 정보 및 ID 풀 정보 등이 기재되어 있습니다.
응용 프로그램은 이 정보를 사용하여 인증할 것이다

코그니토에 한번 들어가 볼게요.

사용자 수영장은 쉽게 말하면 사용자를 관리하는 기능이다
예를 들어 서명과 로그인 등을 관리할 수 있다
ID 풀은 사용자에게 어떤 권한을 부여하는지 관리하는 기능입니다.
예를 들어 사용자 수영장에 로그인한 사용자에게 S3에 대한 접근 권한을 부여할 수 있다
이번에는 이용자 수영장과 아이디 수영장을 연합할 필요가 있습니다.
이를 위해 사용자 풀에 응용 클라이언트를 만들고 클라이언트 ID를 ID 풀의 인증 공급자로 설정합니다.
이렇게 하면 사용자의 수영장에 로그인한 사용자에게 캐릭터를 설정하고 AWS 자원에 접근할 수 있다

인증 기능의 실현

awsconfiguration.Xcode 항목에 json 추가

amplify-learn.xcworkspace

열기

"awsconfiguration.json"을 Xcode의amplify-learn 프로젝트 바로 아래로 드래그

Copy items if needed 검사를 취소하고 Create groups를 선택하고 Finish

를 클릭합니다.

Navigation Controller 및 UI 주변 설치 추가

Main.storyboard를 열고 Navigation Controller

를 추가합니다.

Root View Controller Scene도 함께 제작되었으므로 Root View Controller Scene 제거

Navigation Controller Scene 선택,attrates inspector 선택
initial View Controller 검사

이렇게 하면 네비게이션 컨트롤러가 먼저 나와요.
그런 다음 Navigation Controller Scene에서 View Controller Scene에 대한 루트 뷰 controller sege 추가
이렇게 되면 View Controller Scene 은 내비게이션 디렉터 로 이동합니다.
※ 이미지를 쉽게 이해할 수 있도록 "로그인 완료"라벨을 붙였습니다

인증 코드 구현

다음 설치 코드 측면
ViewController.swift 편집
ViewController.swift

import UIKit

// 以下を追加
import AWSMobileClient

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        // 以下を追加
        AWSMobileClient.sharedInstance().initialize { (userState, error) in
            if let userState = userState {
                switch(userState){
                case .signedIn:
                    DispatchQueue.main.async {
                        print("Sign In")
                    }
                case .signedOut:
                    AWSMobileClient.sharedInstance().showSignIn(navigationController: self.navigationController!, { (userState, error) in
                        if(error == nil){       //Successful signin
                            DispatchQueue.main.async {
                                print("Sign In")
                            }
                        }
                    })
                default:
                    AWSMobileClient.sharedInstance().signOut()
                }
            } else if let error = error {
                print(error.localizedDescription)
            }
        }
    }
}

코드에 대한 자세한 설명은 피하지만 다음 함수가 중요합니다.
이 함수는 "awsconfiguration.json"구성 파일을 읽고 설정된 AWSMobile Client 단식 인스턴스를 반환합니다.
이렇게 되면 사용자 수영장 설정 등 번거로운 일은 전혀 할 필요가 없다.
너무 좋아!!

AWSMobileClient.sharedInstance()

이 상태에서 Xcode 왼쪽 상단에 있는 실행 버튼을 눌러 시뮬레이터를 시작합니다.
아래 화면, 로그인 및 서명

"create new account"를 클릭하고 사인을 해보세요.
입력이 완료되면 메일 주소로 인증 코드를 발송합니다
그쪽에 입력하면 로그인 완료 후 로그인 화면으로 이동
다음에 서명 출력 처리 추가
storyboard에서 로그아웃 버튼, ViewController를 구성합니다.swift에 대한 동작 연결을 생성하십시오.
Connection은 Action이고, Name은push SignoutButon으로 제작되었습니다.
push SignoutButon 함수를 다음과 같이 수정하십시오.
ViewController.swift(발췌문)

@IBAction func pushSignoutButton(_ sender: Any) {
    // サインアウト処理
    AWSMobileClient.sharedInstance().signOut()

    // サインイン画面を表示
    AWSMobileClient.sharedInstance().showSignIn(navigationController: self.navigationController!, { (userState, error) in
        if(error == nil){       //Successful signin
            DispatchQueue.main.async {
                print("Sign In")
            }
        }
    })
}

이렇게 하면 사인 버튼을 누르면 사인이 되고 로그인 화면이 나와요.
최종 화면 레이아웃은 아래 그림과 같다.

총결산

AWS Amplify가 사용된 iOS 애플리케이션 개발 기반에 대해 설명했다.
Amplify를 사용하면 백엔드 서비스 구축과 응용프로그램 설정 등을 함께 설정할 수 있어 편리하다.
이번에는 인증 기능(서명, 서명, 로그인)을 실시했지만 인증 기능은 모든 응용에 필수적인 기능이다.
인증 기능은 수십 줄에서 실현될 수 있어 개발자에게 부담이 가벼우니 꼭 해 보세요.
AWS Amplify 기반 iOS 어플리케이션 개발 시작(Part2)에서는 데이터를 S3에 업로드하는 방법에 대해 설명합니다.