Need to configure your backend?See Build a Backend →
サインアップ
Amplifyは、Amplify Authなどのバックエンドリソースと対話できるクライアントライブラリを提供します。
まず、signUp() APIを使用してバックエンドに新しいユーザーを作成できます：
import { signUp } from "aws-amplify/auth"
const { isSignUpComplete, userId, nextStep } = await signUp({ username: "hello@mycompany.com", password: "hunter2", options: { userAttributes: { email: "hello@mycompany.com", phone_number: "+15555555555" // E.164 number convention }, }});signUp APIレスポンスには nextStep プロパティが含まれており、これを使用して追加のアクションが必要かどうかを判定できます。以下のネクストステップが返される可能性があります：
| ネクストステップ | 説明 |
|---|---|
CONFIRM_SIGN_UP | サインアップをユーザーからコードを収集して confirmSignUp を呼び出すことで確認する必要があります。 |
DONE | サインアッププロセスが完全に完了しました。 |
COMPLETE_AUTO_SIGN_IN | サインアッププロセスを autoSignIn APIを呼び出して完了する必要があります。 |
サインアップの確認
デフォルトでは、サインアップしたすべてのユーザーは、メールアドレスまたは電話番号に送信された確認コードで確認するまで、未確認のステータスのままです。以下は、loginWith オプションとして phone または email が使用される場合に使用されるデフォルトの検証方法です。
| ログインオプション | ユーザーアカウント検証チャネル |
|---|---|
phone | 電話番号 |
email | メール |
email と phone | メール |
ユーザーから確認コードを受け取った後、サインアップを確認できます：
import { confirmSignUp } from 'aws-amplify/auth';
const { isSignUpComplete, nextStep } = await confirmSignUp({ username: "hello@mycompany.com", confirmationCode: "123456"});パスワードレス方式でのサインアップ
アプリケーションのユーザーはパスワードレス方式を使用してサインアップすることもできます。詳細については、パスワードレスのコンセプトページをご覧ください。
SMS OTP
// 電話番号を使用してサインアップしますconst { nextStep: signUpNextStep } = await signUp({ username: 'hello', options: { userAttributes: { phone_number: '+15555551234', }, },});
if (signUpNextStep.signUpStep === 'DONE') { console.log(`SignUp Complete`);}
if (signUpNextStep.signUpStep === 'CONFIRM_SIGN_UP') { console.log( `Code Delivery Medium: ${signUpNextStep.codeDeliveryDetails.deliveryMedium}`, ); console.log( `Code Delivery Destination: ${signUpNextStep.codeDeliveryDetails.destination}`, );}
// 受け取ったOTPでサインアップを確認しますconst { nextStep: confirmSignUpNextStep } = await confirmSignUp({ username: 'hello', confirmationCode: '123456',});
if (confirmSignUpNextStep.signUpStep === 'DONE') { console.log(`SignUp Complete`);}メールOTP
// メールアドレスを使用してサインアップしますconst { nextStep: signUpNextStep } = await signUp({ username: 'hello', options: { userAttributes: { email: 'hello@example.com', }, },});
if (signUpNextStep.signUpStep === 'DONE') { console.log(`SignUp Complete`);}
if (signUpNextStep.signUpStep === 'CONFIRM_SIGN_UP') { console.log( `Code Delivery Medium: ${signUpNextStep.codeDeliveryDetails.deliveryMedium}`, ); console.log( `Code Delivery Destination: ${signUpNextStep.codeDeliveryDetails.destination}`, );}
// 受け取ったOTPでサインアップを確認しますconst { nextStep: confirmSignUpNextStep } = await confirmSignUp({ username: 'hello', confirmationCode: '123456',});
if (confirmSignUpNextStep.signUpStep === 'DONE') { console.log(`SignUp Complete`);}自動サインイン
// 認証フロータイプとして `USER_AUTH` を指定して `signUp` APIを呼び出しますconst { nextStep: signUpNextStep } = await signUp({ username: 'hello', options: { userAttributes: { email: 'hello@example.com', phone_number: '+15555551234', }, autoSignIn: { authFlowType: 'USER_AUTH', }, },});
if (signUpNextStep.signUpStep === 'CONFIRM_SIGN_UP') { console.log( `Code Delivery Medium: ${signUpNextStep.codeDeliveryDetails.deliveryMedium}`, ); console.log( `Code Delivery Destination: ${signUpNextStep.codeDeliveryDetails.destination}`, );}
// 受け取ったOTPで `confirmSignUp` APIを呼び出しますconst { nextStep: confirmSignUpNextStep } = await confirmSignUp({ username: 'hello', confirmationCode: '123456',});
if (confirmSignUpNextStep.signUpStep === 'COMPLETE_AUTO_SIGN_IN') { // フローを完了するために `autoSignIn` APIを呼び出します const { nextStep } = await autoSignIn();
if (nextStep.signInStep === 'DONE') { console.log('Successfully signed in.'); }}