ReactにてCongit認証後、IAMのユーザIDを取得する方法

0

現在、会員制のWebサービスを構築しています。 ユーザ固有の設定をDataModdle(以降UserTableと表記)に格納したいと思っています。 そのため初回ログイン時に下記フローにてユーザ固有設定レコードを作成したいと思っています。 1,認証後、認証したIAMのIDをUserTableにて検索。 →合致したレコードがある場合は通常画面へ(終了) →合致しない場合、2へ遷移

2,初期設定画面を出力。 3,ユーザが入力後、ボタン押下 4,IAM IDをプライマリーキーにしたレコードを生成。 5,1へ遷移 以上。

上記フローを実装するため、そもそもIAM IDが取得可能であるか下記ソースで確認した所取得できない状態でした。

import React, { useEffect, useState } from 'react';
import { Amplify, Auth, Hub} from 'aws-amplify';
import {NavBarHeader} from './ui-components';
import { withAuthenticator ,Flex } from '@aws-amplify/ui-react';
import '@aws-amplify/ui-react/styles.css';
import awsExports from './aws-exports';
Amplify.configure(awsExports);

function App() {
  const [user, setUser] = useState(null);

  useEffect(() => {
    Auth.currentAuthenticatedUser()
      .then(userData => {
        setUser(userData);
      })
      .catch(() => {
        setUser(null);
      });

    // Hubを使用してCognitoセッションの変更を監視
    Hub.listen('auth', data => {
      const { payload } = data;
      if (payload.event === 'signOut') {
        // ユーザーがログアウトした場合の処理
        setUser(null);
      }
    });
  }, []);

  return (
    <div>
    <Flex direction="column" alignItems="center">          
      {user ? (
          <div>
            <NavBarHeader />
            <p>testdayo</p>
            <p>{user.attributes['custom:iam_id']}</p>
          </div>
        
      ) : (
        <p>Not Auther it</p>

      )}
    </Flex>
    </div>

  );
}

export default withAuthenticator(App);

■質問 そもそもフロント側にてIAM IDを参照せずにIAMとUserTableを関連させる方法ってありますでしょうか? 無いのであれば、IAM IDを採取する方法をおしえてください。

akame
gefragt vor 6 Monaten483 Aufrufe
2 Antworten
0

質問内ではIAM IDと呼ばれていますが、用途から想像するとIAMではなく認証したCognitoのユーザーネームなどであると仮定して回答します。

Amplify Librariesの使い方ではなくReactコードの書き方の問題かと思われます。useEffectの第二引数に空配列を指定した場合、コンポーネントがレンダリングされた初回にしか処理が実行されません。 未検証ですが、記載されているコードでは初回レンダリング時のみ currentAuthenticatedUser() が実行されるため常にnullがUserに書き込まれるのではないでしょうか。

下記のサンプルを参考に、Hub.listen() 内でsetUserを呼び出すことを検討してみてはどうでしょう。 https://docs.amplify.aws/lib/auth/social/q/platform/js/#set-up-your-frontend

AWS
beantwortet vor 6 Monaten
0

ご質問内の IAM IDは、IAM ロールなど IAM 権限に紐づく ID 情報 でなく、認証を実施したユーザーを一意に識別できる情報かとお見受けしております。[1]

上記認識にて下記へ引き続き回答を記載させていただきます。

回答

そもそもフロント側にてIAM IDを参照せずにIAMとUserTableを関連させる方法ってありますでしょうか?

恐れ入りますが、現在の Amplify Framework では、上記ご要望を満たすような機能等 ( ユーザーを一意に識別できる情報を参照せずに UserTable ( DynamoDB 等 ) からユーザーの関連情報を取得いただけるような機能等 ) は提供されていない状況でございます。

無いのであれば、IAM IDを採取する方法をおしえてください。

認証を実施したユーザーを一意に識別できる情報に関しましては、currentAuthenticatedUser メソッドのレスポンス値から取得をいただけるかと存じます。

Amazon Cognito ではユーザープールに登録されたユーザーへ一意の ID となる sub 属性を付与いたします。[2]

currentAuthenticatedUser メソッドは Cognito リソースにて認証されたユーザー情報を含むデータを返却いたしますため、こちらの sub 属性の情報などが一意のユーザーID としてご活用いただけるかと存じます。[3]

上記情報がご要望に沿うものであるかご確認をいただけますと幸いです。

参考

[1] IAM ID

IAM は、ユーザー、ユーザーグループ、ロール、ポリシー、およびサーバー証明書に対していくつかの異なった ID を使います。

https://docs.aws.amazon.com/ja_jp/IAM/latest/UserGuide/reference_identifiers.html#identifiers-unique-ids

[2] ユーザープール属性

sub を除き、標準属性はすべてのユーザーに対してデフォルトでオプションとなります。属性を必須にする場合は、ユーザープールの作成プロセスで、属性の横にある [必須] チェックボックスをオンにします。Amazon Cognito は、各ユーザーの sub 属性に一意のユーザー識別子の値を割り当てます。

https://docs.aws.amazon.com/ja_jp/cognito/latest/developerguide/user-pool-settings-attributes.html

[3] currentAuthenticatedUser

https://aws-amplify.github.io/amplify-js/api/classes/authclass.html#currentauthenticateduser

AWS
beantwortet vor 6 Monaten

Du bist nicht angemeldet. Anmelden um eine Antwort zu veröffentlichen.

Eine gute Antwort beantwortet die Frage klar, gibt konstruktives Feedback und fördert die berufliche Weiterentwicklung des Fragenstellers.

Richtlinien für die Beantwortung von Fragen