web-dev-qa-db-fra.com

Est-il possible d'intégrer des graphiques de tableau de bord Amazon QuickSight à une application Web?

Je souhaite afficher des graphiques interactifs en direct basés sur les données client présentes dans MySQL. Pour générer les graphiques, je prévois d’utiliser Amazon Quick Sight, mais je voudrais savoir si les graphiques générés peuvent être intégrés à l’interface utilisateur de mon application Web. La source de données MYSQL est hébergée sur AWS.

Toute autre solution de conception meilleure est également la bienvenue :)

8
DPK
  • Je ne pense pas. Même si vous voulez partager le tableau de bord avec Quelqu'un, vous devez créer un utilisateur dans QuickSight. Plus de 1 Utilisateur sera facturé par AWS.
  • Le tableau de bord ne peut pas être public et vous devez vous connecter pour afficher le tableau de bord . S'il était public, vous auriez pu l'intégrer dans votre page Web Sous forme d'iframe. Mais tu ne peux pas.
  • Donc, je pense que vous avez des options limitées ici, en ce qui concerne QuickSight.
  • Vous pouvez toujours utiliser D3 ou Google Charts pour afficher les données de En exposant les services REST pour vos données dans MySQL.
  • Si vous avez une base de données volumineuse, vous pouvez envisager d'indexer les données Dans Elasticsearch et d'effectuer des requêtes à ce sujet. 
  • Vérifiez si Kibana + Elasticsearch fonctionne pour vous.

Bonne chance!

Mise à jour: 28 décembre 2018

Amazon a annoncé en novembre 2018 que les tableaux de bord Amazon QuickSight peuvent désormais être intégrés aux applications. Lisez-en plus ici AWS QuickSight Update .

8

AWS a permis l'incorporation des tableaux de bord dans des applications Web. La fonctionnalité a été publiée le 27 novembre 2018. Voici quelques liens utiles:
1. https://aws.Amazon.com/blogs/big-data/embed-interactive-dashboards-in-your-application-with-Amazon-quicksight/
2. https://docs.aws.Amazon.com/quicksight/latest/user/embedded-dashboards-setup.html

1
Prateek Balhara

Remarque: Cette réponse est applicable uniquement si vous utilisez AWS Cognito.

Pour générer l'URL du tableau de bord sécurisé Quicksight, procédez comme suit:

Étape 1: Créez un nouveau pool d’identité. Allez à https://console.aws.Amazon.com/cognito/home?region=u-east-1 , cliquez sur "Créer un nouveau pool d’identité"

  • Donnez un nom approprié.
  • Accédez à la section Fournisseurs d’authentification , sélectionnez Cognito .
  • Indiquez l'ID de pool d'utilisateurs (votre ID de pool d'utilisateurs) et l'ID de client d'application (allez à App Clients dans le pool d'utilisateurs et copiez l'ID).
  • Cliquez sur ‘Create Pool’ . Cliquez ensuite sur ‘Autoriser’ pour créer les rôles du pool d’identités Dans IAM.

Étape 2: Affecter une stratégie personnalisée au rôle de pool d'identités

  • Créez une politique personnalisée avec le JSON ci-dessous.
 {
 "Version": "2012-10-17", 
 "Déclaration": [
 {
 "Action": "coup d'œil rapide : RegisterUser ", 
" Ressource ":" * ", 
" Effet ":" Autoriser "
}, 
 {
" Action " : "quicksight: GetDashboardEmbedUrl", 
 "Ressource": "*", 
 "Effet": "Autoriser" 
}, 
 {
 "Action": "sts: AssumeRole", 
 "Ressource": "*", 
 "Effet": "Autoriser" 
} 
]. 
} 

Remarque: si vous souhaitez limiter l'utilisateur à un seul tableau de bord, remplacez * par le nom de l'ARN du tableau de bord dans quicksight: GetDashboardEmbedUrl,

  • puis passez aux rôles dans IAM.
  • sélectionnez le rôle IAM du pool d'identités et affectez la stratégie personnalisée au rôle.

Étape 3: Configuration pour générer l'utilisateur IAM temporaire (STS)

  • Connectez-vous à votre application avec les informations d'identification de l'utilisateur.

  • Pour créer un utilisateur IAM temporaire, nous utilisons les informations d'identification Cognito.

  • Lorsque l'utilisateur se connecte, Cognito génère 3 ID de jeton: IDToken, AccessToken, RefreshToken. Ces jetons seront envoyés à votre serveur d'applications.

Pour créer un utilisateur IAM temporaire, nous utilisons Cognito Access Token. Les informations d'identification ressemblent à celles décrites ci-dessous.

 AWS.config.region = 'us-east-1';
       AWS.config.credentials = new AWS.CognitoIdentityCredentials({
           IdentityPoolId:"Identity pool ID",
           Logins: {
               'cognito-idp.us-east-1.amazonaws.com/UserPoolID': AccessToken
           }
       });
  • Pour générer des informations d'identification IAM temporaires, nous appelons la méthode sts.assume role Avec les paramètres ci-dessous.
 var params = {
 RoleArn: "Cognito Identity role arn", 
 RoleSessionName: "nom de session" 
}; 
.
 
 sts.assumeRole (params, fonction (err, données) {
 if (err) console.log (err, err.stack); // une erreur est survenue 
 else {
 console.log (données); 
}) 
 
  • Vous pouvez ajouter des paramètres supplémentaires tels que la durée (en secondes) pour l'utilisateur . 
  • Maintenant, nous allons obtenir le AccessKeyId, SecretAccessKey et Session
    Jeton
    de l'utilisateur temporaire.

Étape 4: Enregistrer l'utilisateur dans Quicksight

  • Avec l’aide des mêmes identifiants Cognito utilisés dans Étape 3 , nous enregistrerons L’utilisateur rapidement en utilisant la méthode quicksight.registerUser Avec sous les paramètres
 var params = {
 AwsAccountId: «id du compte», 
 Email: 'email', 
 IdentityType: 'IAM', 
 Espace de noms: 'default', 
 UserRole: ADMIN | AUTEUR LECTEUR | RESTRICTED_AUTHOR | RESTRICTED_READER, 
 IamArn: 'Rôle d’identité Cognito arn', 
 Nom de session: 'nom de session indiqué dans la création du rôle assume', 
}; 
quicksight.registerUser(params, function (err, data1) {
                   if (err) console.log("err register user”); // an error occurred
                   else {
                       // console.log("Register User1”);
                   }
               });
  • Maintenant, l'utilisateur sera enregistré dans quicksight.

Étape 5: Mettez à jour la configuration AWS avec de nouvelles informations d'identification.

  • Le code ci-dessous montre comment configurer AWS.config () avec les nouvelles informations d'identification Générées Étape 3.
 AWS.config.update ({
 AccessKeyId: AccessToken, 
 SecretAccessKey: SecretAccessKey, 
 SessionToken: SessionToken, 
 "Région": Région 
}); 

Étape 6: Génère l'URL Embed pour les tableaux de bord:

  • En utilisant les informations d’identification générées dans Étape 3 , nous appellerons le quicksight.getDashboardEmbedUrl avec les paramètres ci-dessous.
 var params = {
 AwsAccountId: "ID de compte", 
 DashboardId: "ID de tableau de bord", 
 IdentityType: "IAM", 
 ResetDisabled : true, 
 SessionLifetimeInMinutes: entre 15 et 600 minutes, 
 UndoRedoDisabled: True | False 
} 
 Quicksight.getDashboardEmbedUrl (params, 
 Function (err, données) {
 If (! Err) {
 Console.log ( data); 
} else {
 console.log (err); 
} 
} 
); 
 
  • Nous allons maintenant obtenir l’URL intégrée pour le tableau de bord.
  • Appelez le QuickSightEmbedding.embedDashboard du frontal avec l’aide De l’URL générée ci-dessus.
  • Le résultat sera le tableau de bord intégré à votre application avec les contrôles de filtre .
0
Siva Sumanth

Je sais que c'est une réponse très tardive, mais juste au cas où quelqu'un d'autre tomberait sur cette question ... Nous utilisons periscopedata.com pour intégrer des tableaux de bord BI dans notre application SaaS. Tout ce dont vous avez besoin est une connaissance de SQL (pour créer les graphiques/tableaux de bord) et suffisamment de connaissances en développement pour appeler leur point de terminaison d'API afin d'afficher le tiret dans votre propre application.

0
latearrival