Amazon Web Services ブログ

新機能 – Amazon QuickSightのインタラクティブなダッシュボードを独自アプリケーションへ埋め込み可能に

本日より、 Amazon QuickSight のダッシュボードをお客様独自のアプリケーションに埋め込むことが可能になります。これは、インタラクティブなデータ可視化&分析の機能を追加開発無しでクイックにあなたのアプリケーションに追加できるという事です。分析のコンポーネントについての開発、メンテナンス、機能追加といった部分について気にする必要はありません。また、アプリケショーションが多く利用されるようになってきた際の分析サーバのスケーラビリティにも気を使う必要はありません。これにより開発時間や費用を削減し、お客様はコアアプリケーションの開発にフォーカスすることが出来るようになります。

Amazon QuickSightのダッシュボードを埋め込むことで、QuickSightのサーバレスアーキテクチャを活用できます。ユーザ利用量に合わせて自動的にスケールし、QuickSightの特徴であるPay-per-sessionの料金により、利用した分だけの支払いで利用することができます。ダッシュボードを閲覧するユーザは、フェデレーションのSSO (SAML、OpenID Connect、もしくはAWS IAM Federation)で認証済である必要があります。これにより、ユーザはQuickSight独自のログイン画面を経由することなく、パーソナライズされたダッシュボードをセキュアに得ることが可能になります。ダッシュボードの埋め込み(Dashboard embedding)機能は、Amazon QuickSight Enterprise Editionが稼働する全リージョンで利用可能です。

埋め込みの実現を簡単にするために、AWSではAmazon QuickSight JavaScript SDKと、Amazon QuickSight 管理APIの最初の機能セットをローンチします。Amazon QuickSight JavaScript SDKはデフォルトの設定、接続コントロール、エラーハンドリング等を提供することでAmazon QuickSightダッシュボードと独自アプリケーションとの連携を容易に実現します。管理APIであるユーザ&グループAPIはユーザとグループへの操作をプログラムから実行可能にします。これによりAmazon QuickSightをより容易に提供可能にし、グループ単位でのリソースコントロールを実現します。ユーザAPIはStandard Edition、Enterprise Edition両方で利用可能です。グループAPIはEnterprise Editionのみに提供されます。

ではどのようにしてアプリケーションに埋め込むことが出来るのかクイックに見ていきましょう。以下の4つのステップでダッシュボードを埋め込むことが可能です。

Step 1: Amazon QuickSight上でダッシュボードを作成し、ドメインを登録(ホワイトリスト)する

このステップでは、最初にダッシュボードを作成し、それを埋め込まれた状態で閲覧して欲しいリーダーに対して共有します。閲覧するユーザはAmazon QuicckSightアカウントのメンバーである必要がありますが、User APIを使うことで事前に登録、もしくは必要となった際に登録することが可能です。閲覧者にダッシュボードをアクセス可能にするためには、個別のユーザごとではなくグループに対して共有するのが良いでしょう。グループに共有しておき、QuickSightアカウントが準備されたタイミングでグループにユーザを追加するようにします。

ダッシュボードを共有する際に新しいオプションが追加されています。これにより、アドバンスドフィルタリングの有効・無効、およびCSVでのダウンロードを許可する・しないを設定することができ、必要に応じてシンプルなダッシュボードを提供することが可能です。

不必要なアクセスを防ぐため、QuickSight管理者(Administrator)はAmazon QuickSightの管理画面で、アプリケーションのドメインを明示的に指定し、ダッシュボードがどこに埋め込まれるかを指示する必要があります。QuickSightの管理画面から”Manage QuickSight “を選択することで設定可能です。開発用、本番用に限らず、すべてのドメインはここにホワイトリスト(登録)されており、かつHTTPSでアクセスされる必要があります。

Step 2: AWSアカウントで、埋め込のビューアー向けパーミッションを設定する

あなたの独自アプリケーションのユーザをAmazon QuickSightアカウントのメンバーとして登録するために、AWS Identity and Access Management (IAM) ロールを作成し、そのロールをユーザが利用可能にします。ロールには閲覧者用のパーミッションとして以下が必要です。

  • Amazon QuickSightのReaderになる (quicksight:RegisterUser)
  • 特定の埋込ダッシュボードにアクセスする (quicksight:GetDashboardEmbedUrl)

上記パーミッションを含むサンプルのポリシーを以下に示します。

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Action": "quicksight:RegisterUser",
            "Resource": "*",
            "Effect": "Allow"
        },
        {
            "Action": "quicksight:GetDashboardEmbedUrl",
            "Resource": "arn:aws:quicksight:us-west-2:293424211206:dashboard/26a7dcad-7831-4266-9f75-ffd9265aa335",
            "Effect": "Allow"
        }
    ]
}

あなたのアプリケーションのIAMアイデンティティは、上記ロールに紐付けたトラストポリシーを持つ必要があります。つまり、ユーザがあなたのアプリケーションにアクセスした際に、あなたのアプリケーションはQuickSightEmbedロール(Step 2の最初に作ったロール)をユーザに代わって引き継ぎ(Assume role)、Amazon QuickSight内にユーザをプロビジョンします。以下は、先に作ったロール(QuickSightEmbed)に関連付けたポリシーの例です。OpenID Connectの場合や、SAML認証の場合は、リンクからドキュメントを参照してください。

{
    "Version": "2012-10-17",
    "Statement": {
        "Effect": "Allow",
        "Action": "sts:AssumeRole",
        "Resource": "arn:aws:iam::293424211206:role/QuickSightEmbed"
    }
}

Step 3: あなたのアプリケーションサーバ上でユーザを認証し、埋込ダッシュボードのURLを取得する

ユーザがあなたのアプリケーションにアクセスしてきたら、あなたのプログラムはStep2で作成したIAMロール(例:QuickSightEmbed)をAssume Roleし、ユーザのアカウントをAmazon QuickSight内にプロビジョンします。ユーザはそれぞれ個別のAmazon QuickSightアカウントとしてプロビジョンされている必要があり、場合によっては、行レベルセキュリティやダイナミックデフォルトの値が設定されています。また固有のID名(ユーザ名もしくはEメールアドレス)をロールセッション名として渡す必要があります。

以下のAWS Command Line Interface (AWS CLI) コマンドが上記を実行する際の例です:

aws sts assume-role --role-arn "arn:aws:iam::293424211206:role/QuickSightEmbed" --role-session-name tom.smith@abc.com

上記コマンドの例ではあなたのWebアプリにアクセスしたユーザのロールセッションIDを “QuickSightEmbed/tom.smith@abc.com”として設定しています。これはAmazon QuickSight内のユーザ名でもあります。このパターンは事前にQuickSight上にユーザを登録する場合にも、最初にアプリケーションにアクセスされた際に登録する場合にも利用できます。費用はAmazon QuickSightにアクセスされた際のみ発生します。以下のAWS CLI コマンドはユーザをプロビジョンする例です。

aws quicksight register-user --aws-account-id 293424211206 --namespace default --identity-type IAM --iam-arn "arn:aws:iam::293424211206:role/QuickSightEmbed" --user-role READER --session-name tom.smith@abc.com --email tom.smith@abc.com  

最初のアクセス時には、このユーザをダッシュボードが共有されているグループへ追加する必要があります。

aws quicksight create-group-membership --aws-account-id=293424211206 --namespace=default --group-name=financeusers --member-name=” QuickSightEmbed/tom.smith@abc.com”

これで、あなたのアプリケーションにアクセスしているユーザがAmazon QuickSightのユーザとしてダッシュボードにアクセスできるようになりました。Step 3の最後のパートとして get-dashboard-embed-url APIを呼び出し、埋め込みようダッシュボードのURL (Signed URL)を取得します。

aws quicksight get-dashboard-embed-url --aws-account-id 293424211206 --dashboard-id 26a7dcad-7831-4266-9f75-ffd9265aa335 --identity-type IAM

Step 4: Amazon QuickSight JavaScript SDKを利用してダッシュボードをアプリケーションに埋め込む

Amazon QuickSight JavaScript SDKはこちらからダウンロード可能です。Step 3で取得したSigned URLをアプリケーションページに埋め込むためにSDKを使用します。SDKはダッシュボードをアプリケーションのHTML内に生成し、パラメータをダッシュボードに渡し、エラー状況やエラーメッセージのハンドリングを可能にします。

function embedDashboard() {
                var containerDiv = document.getElementById("dashboardContainer");
                var options = {
                    url: "Step 3で取得したSigned URL",
                    container: containerDiv,
                    parameters: {
                        country: 'United States'
                    },
                    scrolling: "no",
                    height: "700px",
                    width: "1000px"
                };
                dashboard = QuickSightEmbedding.embedDashboard(options);
                dashboard.on('error', onDashboardLoad);
                dashboard.on('load', onError);
            }

これまで使ってきたCLIコマンドは、AWS SDKの一部です。つまりAWS SDKがサポートしているプログラミング言語を利用することで、CLIと同じ操作が可能です。より詳細な情報は、「アマゾン ウェブ サービス のツール」をご覧ください。

上記4つのステップにより、Amazon QuickSightでダッシュボードを作成し、アプリケーションに埋め込み、ユーザにリッチでインタラクティブな分析を提供できるようになりました。


参考情報

この他にも以下のような記事が参考になります。

著者について

Jose Kunnackal はAmazon QuickSightのプリンシパルプロダクトマネージャです。

 

 

 

 

翻訳:下佐粉 昭(@simosako)

原文:https://thinkwithwp.com/jp/blogs/big-data/embed-interactive-dashboards-in-your-application-with-amazon-quicksight/