Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.
importante
Amazon QuickSight tiene nuevas operaciones de API para incorporar análisis: GenerateEmbedUrlForAnonymousUser
yGenerateEmbedUrlForRegisteredUser
.
Puede seguir utilizando las operaciones GetDashboardEmbedUrl
y las de la GetSessionEmbedUrl
API para incrustar los paneles y la QuickSight consola, pero no incluyen las funciones de incrustación más recientes. Para obtener más información sobre la integración mediante las antiguas operaciones de la API, consulte Incorporación de análisis mediante el GetDashboardEmbedURL y GetSessionEmbedURL Operaciones de la API.
Se aplica a: Enterprise Edition |
Público objetivo: QuickSight desarrolladores de Amazon |
En las siguientes secciones, encontrarás información detallada sobre cómo configurar los QuickSight paneles de Amazon integrados para los usuarios registrados de Amazon QuickSight.
Temas
Paso 1: configuración de permisos
En la siguiente sección, puede encontrar cómo configurar los permisos de la aplicación de backend o del servidor web. Esta tarea requiere acceso administrativo a IAM.
Cada usuario que accede a un panel de control asume un rol que le da QuickSight acceso a Amazon y permisos para acceder al panel. Para que esto sea posible, cree un rol de IAM en su. Cuenta de AWS Asocie una política de IAM al rol para proporcionar permisos a cualquier usuario que lo asuma. El rol de IAM debe proporcionar permisos para recuperar la incrustación de un grupo URLs de usuarios específico. Con la ayuda del carácter comodín *, puede conceder los permisos para generar una URL para todos los usuarios de un espacio de nombres específico, o para un subconjunto de usuarios de espacios de nombres específicos. Para ello, añada quicksight:GenerateEmbedUrlForRegisteredUser
.
Puede crear una condición en su política de IAM que limite los dominios que los desarrolladores pueden incluir en el parámetro AllowedDomains
de una operación de la API GenerateEmbedUrlForRegisteredUser
. El parámetro AllowedDomains
es opcional. Como desarrollador, tiene la opción de anular los dominios estáticos que están configurados en el menú Administrar. QuickSight En su lugar, puede enumerar hasta tres dominios o subdominios que pueden acceder a la URL generada. A continuación, esta URL se integra en el sitio web que cree. Solo los dominios que aparecen en el parámetro pueden acceder al elemento visual integrado. Sin esta condición, usted puede incluir cualquier dominio de Internet en el parámetro AllowedDomains
.
Para limitar los dominios que los desarrolladores pueden usar con este parámetro, añada una condición AllowedEmbeddingDomains
a su política de IAM. Para obtener más información sobre el AllowedDomains
parámetro, consulta GenerateEmbedUrlForRegisteredUserla referencia de la QuickSight API de Amazon.
La siguiente política de ejemplo ofrece estos permisos.
{ "Version": "2012-10-17", "Statement": [ { "Effect": "Allow", "Action": [ "quicksight:GenerateEmbedUrlForRegisteredUser" ], "Resource": "arn:
partition
:quicksight:region
:accountId
:user/namespace
/userName
", "Condition": { "ForAllValues:StringEquals": { "quicksight:AllowedEmbeddingDomains": [ "https://my.static.domain1.com", "https://*.my.static.domain2.com" ] } } } ] }
Además, si vas a crear usuarios primerizos que vayan a ser QuickSight lectores de Amazon, asegúrate de añadir el quicksight:RegisterUser
permiso en la política.
El siguiente ejemplo de política proporciona permiso para recuperar una URL incrustada para los usuarios primerizos que vayan a ser lectores. QuickSight
{
"Version": "2012-10-17",
"Statement": [
{
"Action": "quicksight:RegisterUser",
"Resource": "*",
"Effect": "Allow"
},
{
"Effect": "Allow",
"Action": [
"quicksight:GenerateEmbedUrlForRegisteredUser"
],
"Resource": [
"arn:{{partition}}:quicksight:{{region}}:{{accountId}}:namespace/{{namespace}}",
"arn:{{partition}}:quicksight:{{region}}:{{accountId}}:dashboard/{{dashboardId-1}}",
"arn:{{partition}}:quicksight:{{region}}:{{accountId}}:dashboard/{{dashboardId-2}}"
],
"Condition": {
"ForAllValues:StringEquals": {
"quicksight:AllowedEmbeddingDomains": [
"https://my.static.domain1.com",
"https://*.my.static.domain2.com"
]
}
}
}
]
}
Finalmente, la identidad de IAM de su aplicación debe tener asociada una política de confianza para permitir el acceso al rol que acaba de crear. Esto significa que cuando un usuario accede a tu aplicación, esta puede asumir la función en nombre del usuario y aprovisionarlo. QuickSight En el siguiente ejemplo, se muestra una muestra de política de confianza.
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "AllowLambdaFunctionsToAssumeThisRole",
"Effect": "Allow",
"Principal": {
"Service": "lambda.amazonaws.com"
},
"Action": "sts:AssumeRole"
},
{
"Sid": "AllowEC2InstancesToAssumeThisRole",
"Effect": "Allow",
"Principal": {
"Service": "ec2.amazonaws.com"
},
"Action": "sts:AssumeRole"
}
]
}
Para obtener más información sobre las políticas de confianza para la autenticación de OpenID Connect o SAML, consulte las siguientes secciones de la Guía del usuario de IAM:
Paso 2: generación de la URL con el código de autenticación adjunto
En la siguiente sección, puede obtener información sobre cómo autenticar el usuario y obtener la URL del panel integrable en el servidor de su aplicación. Si planea incrustar paneles para los tipos de QuickSight identidad o de IAM, compártalos con los usuarios.
Cuando un usuario accede a su aplicación, esta asume el rol de IAM en nombre del usuario. A continuación, agrega el usuario a QuickSight, si ese usuario aún no existe. A continuación, transfiere un identificador como ID de sesión de rol único.
Al realizar estos pasos, se garantiza que cada visor del panel esté aprovisionado de forma única. QuickSight También aplica la configuración por usuario, como la seguridad de nivel de fila y los valores predeterminados dinámicos de los parámetros.
Los siguientes ejemplos realizan la autenticación de IAM en nombre del usuario. Este código se ejecuta en el servidor de aplicaciones.
import com.amazonaws.auth.AWSCredentials;
import com.amazonaws.auth.BasicAWSCredentials;
import com.amazonaws.auth.AWSCredentialsProvider;
import com.amazonaws.regions.Regions;
import com.amazonaws.services.quicksight.AmazonQuickSight;
import com.amazonaws.services.quicksight.AmazonQuickSightClientBuilder;
import com.amazonaws.services.quicksight.model.GenerateEmbedUrlForRegisteredUserRequest;
import com.amazonaws.services.quicksight.model.GenerateEmbedUrlForRegisteredUserResult;
import com.amazonaws.services.quicksight.model.RegisteredUserEmbeddingExperienceConfiguration;
import com.amazonaws.services.quicksight.model.RegisteredUserDashboardEmbeddingConfiguration;
/**
* Class to call QuickSight AWS SDK to get url for dashboard embedding.
*/
public class GetQuicksightEmbedUrlRegisteredUserDashboardEmbedding {
private final AmazonQuickSight quickSightClient;
public GetQuicksightEmbedUrlRegisteredUserDashboardEmbedding() {
this.quickSightClient = AmazonQuickSightClientBuilder
.standard()
.withRegion(Regions.US_EAST_1.getName())
.withCredentials(new AWSCredentialsProvider() {
@Override
public AWSCredentials getCredentials() {
// provide actual IAM access key and secret key here
return new BasicAWSCredentials("access-key", "secret-key");
}
@Override
public void refresh() {}
}
)
.build();
}
public String getQuicksightEmbedUrl(
final String accountId, // AWS Account ID
final String dashboardId, // Dashboard ID to embed
final List<String> allowedDomains, // Runtime allowed domain for embedding
final String userArn // Registered user arn to use for embedding. Refer to Get Embed Url section in developer portal to find out how to get user arn for a QuickSight user.
) throws Exception {
final RegisteredUserEmbeddingExperienceConfiguration experienceConfiguration = new RegisteredUserEmbeddingExperienceConfiguration()
.withDashboard(new RegisteredUserDashboardEmbeddingConfiguration().withInitialDashboardId(dashboardId));
final GenerateEmbedUrlForRegisteredUserRequest generateEmbedUrlForRegisteredUserRequest = new GenerateEmbedUrlForRegisteredUserRequest();
generateEmbedUrlForRegisteredUserRequest.setAwsAccountId(accountId);
generateEmbedUrlForRegisteredUserRequest.setUserArn(userArn);
generateEmbedUrlForRegisteredUserRequest.setAllowedDomains(allowedDomains);
generateEmbedUrlForRegisteredUserRequest.setExperienceConfiguration(experienceConfiguration);
final GenerateEmbedUrlForRegisteredUserResult generateEmbedUrlForRegisteredUserResult = quickSightClient.generateEmbedUrlForRegisteredUser(generateEmbedUrlForRegisteredUserRequest);
return generateEmbedUrlForRegisteredUserResult.getEmbedUrl();
}
}
global.fetch = require('node-fetch');
const AWS = require('aws-sdk');
function generateEmbedUrlForRegisteredUser(
accountId,
dashboardId,
openIdToken, // Cognito-based token
userArn, // registered user arn
roleArn, // IAM user role to use for embedding
sessionName, // Session name for the roleArn assume role
allowedDomains, // Runtime allowed domain for embedding
getEmbedUrlCallback, // GetEmbedUrl success callback method
errorCallback // GetEmbedUrl error callback method
) {
const stsClient = new AWS.STS();
let stsParams = {
RoleSessionName: sessionName,
WebIdentityToken: openIdToken,
RoleArn: roleArn
}
stsClient.assumeRoleWithWebIdentity(stsParams, function(err, data) {
if (err) {
console.log('Error assuming role');
console.log(err, err.stack);
errorCallback(err);
} else {
const getDashboardParams = {
"AwsAccountId": accountId,
"ExperienceConfiguration": {
"Dashboard": {
"InitialDashboardId": dashboardId
}
},
"UserArn": userArn,
"AllowedDomains": allowedDomains,
"SessionLifetimeInMinutes": 600
};
const quicksightClient = new AWS.QuickSight({
region: process.env.AWS_REGION,
credentials: {
accessKeyId: data.Credentials.AccessKeyId,
secretAccessKey: data.Credentials.SecretAccessKey,
sessionToken: data.Credentials.SessionToken,
expiration: data.Credentials.Expiration
}
});
quicksightClient.generateEmbedUrlForRegisteredUser(getDashboardParams, function(err, data) {
if (err) {
console.log(err, err.stack);
errorCallback(err);
} else {
const result = {
"statusCode": 200,
"headers": {
"Access-Control-Allow-Origin": "*", // Use your website domain to secure access to GetEmbedUrl API
"Access-Control-Allow-Headers": "Content-Type"
},
"body": JSON.stringify(data),
"isBase64Encoded": false
}
getEmbedUrlCallback(result);
}
});
}
});
}
import json
import boto3
from botocore.exceptions import ClientError
sts = boto3.client('sts')
# Function to generate embedded URL
# accountId: AWS account ID
# dashboardId: Dashboard ID to embed
# userArn: arn of registered user
# allowedDomains: Runtime allowed domain for embedding
# roleArn: IAM user role to use for embedding
# sessionName: session name for the roleArn assume role
def getEmbeddingURL(accountId, dashboardId, userArn, allowedDomains, roleArn, sessionName):
try:
assumedRole = sts.assume_role(
RoleArn = roleArn,
RoleSessionName = sessionName,
)
except ClientError as e:
return "Error assuming role: " + str(e)
else:
assumedRoleSession = boto3.Session(
aws_access_key_id = assumedRole['Credentials']['AccessKeyId'],
aws_secret_access_key = assumedRole['Credentials']['SecretAccessKey'],
aws_session_token = assumedRole['Credentials']['SessionToken'],
)
try:
quicksightClient = assumedRoleSession.client('quicksight', region_name='us-west-2')
response = quicksightClient.generate_embed_url_for_registered_user(
AwsAccountId=accountId,
ExperienceConfiguration = {
"Dashboard": {
"InitialDashboardId": dashboardId
}
},
UserArn = userArn,
AllowedDomains = allowedDomains,
SessionLifetimeInMinutes = 600
)
return {
'statusCode': 200,
'headers': {"Access-Control-Allow-Origin": "*", "Access-Control-Allow-Headers": "Content-Type"},
'body': json.dumps(response),
'isBase64Encoded': bool('false')
}
except ClientError as e:
return "Error generating embedding url: " + str(e)
El siguiente ejemplo muestra el archivo JavaScript (Node.js) que puede usar en el servidor de aplicaciones para generar la URL del panel integrado. Puede utilizar esta URL en su sitio web o aplicación para mostrar el panel.
const AWS = require('aws-sdk');
const https = require('https');
var quicksightClient = new AWS.Service({
apiConfig: require('./quicksight-2018-04-01.min.json'),
region: 'us-east-1',
});
quicksightClient.generateEmbedUrlForRegisteredUser({
'AwsAccountId': '111122223333',
'ExperienceConfiguration': {
'Dashboard': {
'InitialDashboardId': '1c1fe111-e2d2-3b30-44ef-a0e111111cde'
}
},
'UserArn': 'REGISTERED_USER_ARN',
'AllowedDomains': allowedDomains,
'SessionLifetimeInMinutes': 100
}, function(err, data) {
console.log('Errors: ');
console.log(err);
console.log('Response: ');
console.log(data);
});
//The URL returned is over 900 characters. For this example, we've shortened the string for //readability and added ellipsis to indicate that it's incomplete. { Status: 200, EmbedUrl: 'https://
quicksightdomain
/embed/12345/dashboards/67890...' RequestId: '7bee030e-f191-45c4-97fe-d9faf0e03713' }
En el siguiente ejemplo, se muestra el código .NET/C# que puede usar en el servidor de aplicaciones para generar la URL del panel integrado. Puede utilizar esta URL en su sitio web o aplicación para mostrar el panel.
using System;
using Amazon.QuickSight;
using Amazon.QuickSight.Model;
namespace GenerateDashboardEmbedUrlForRegisteredUser
{
class Program
{
static void Main(string[] args)
{
var quicksightClient = new AmazonQuickSightClient(
AccessKey,
SecretAccessKey,
SessionToken,
Amazon.RegionEndpoint.USEast1);
try
{
RegisteredUserDashboardEmbeddingConfiguration registeredUserDashboardEmbeddingConfiguration
= new RegisteredUserDashboardEmbeddingConfiguration
{
InitialDashboardId = "dashboardId"
};
RegisteredUserEmbeddingExperienceConfiguration registeredUserEmbeddingExperienceConfiguration
= new RegisteredUserEmbeddingExperienceConfiguration
{
Dashboard = registeredUserDashboardEmbeddingConfiguration
};
Console.WriteLine(
quicksightClient.GenerateEmbedUrlForRegisteredUserAsync(new GenerateEmbedUrlForRegisteredUserRequest
{
AwsAccountId = "111122223333",
ExperienceConfiguration = registeredUserEmbeddingExperienceConfiguration,
UserArn = "REGISTERED_USER_ARN",
AllowedDomains = allowedDomains,
SessionLifetimeInMinutes = 100
}).Result.EmbedUrl
);
} catch (Exception ex) {
Console.WriteLine(ex.Message);
}
}
}
}
Para asumir la función, elija una de las siguientes AWS Security Token Service (AWS STS) operaciones de API:
-
AssumeRole— Utilice esta operación cuando utilice una identidad de IAM para asumir la función.
-
AssumeRoleWithWebIdentity— Utilice esta operación cuando utilice un proveedor de identidad web para autenticar a su usuario.
-
AssumeRoleWithSaml— Usa esta operación cuando utilices SAML para autenticar a tus usuarios.
En el siguiente ejemplo, se muestra el comando de la CLI para definir el rol de IAM. El rol debe tener los permisos de quicksight:GenerateEmbedUrlForRegisteredUser
habilitados. Si opta por añadir usuarios just-in-time la primera vez que abren un panel de control, el rol también necesita tener habilitados los permisos. quicksight:RegisterUser
aws sts assume-role \ --role-arn "
arn:aws:iam::111122223333:role/embedding_quicksight_dashboard_role
" \ --role-session-namejohn.doe@example.com
La operación assume-role
devuelve tres parámetros de salida: la clave de acceso, la clave secreta y el token de sesión.
nota
Si se produce un error ExpiredToken
al llamar a la operación AssumeRole
, probablemente se debe a que el SESSION TOKEN
anterior aún se encuentra en las variables de entorno. Para retirarlo, establezca las variables siguientes:
-
AWS_ACCESS_KEY_ID
-
AWS_SECRET_ACCESS_KEY
-
AWS_SESSION_TOKEN
En el siguiente ejemplo, se muestra cómo definir estos tres parámetros en la CLI. Si utiliza un equipo con Microsoft Windows, utilice set
en lugar de export
.
export AWS_ACCESS_KEY_ID = "
access_key_from_assume_role
" export AWS_SECRET_ACCESS_KEY = "secret_key_from_assume_role
" export AWS_SESSION_TOKEN = "session_token_from_assume_role
"
Al ejecutar estos comandos, se define el ID de sesión del rol del usuario que visita su sitio web como embedding_quicksight_dashboard_role/john.doe@example.com
. El ID de sesión del rol está compuesto por el nombre del rol de role-arn
y el valor de role-session-name
. Al utilizar el ID de sesión del rol único para cada usuario, se garantiza que se definan los permisos correspondientes para cada usuario. También evitará la limitación del acceso de los usuarios. La limitación es una función de seguridad que impide que el mismo usuario acceda QuickSight desde varios lugares.
El ID de sesión del rol también se convierte en el nombre de usuario en QuickSight. Puede utilizar este patrón para aprovisionar a sus usuarios QuickSight con antelación o para aprovisionarlos la primera vez que accedan al panel de control.
En el siguiente ejemplo, se muestra el comando de la CLI que puede utilizar para incluir a un usuario. Para obtener más información RegisterUsery otras operaciones de la QuickSight API, consulta la referencia de la QuickSight API. DescribeUser
aws quicksight register-user \ --aws-account-id
111122223333
\ --namespacedefault
\ --identity-typeIAM
\ --iam-arn "arn:aws:iam::111122223333:role/embedding_quicksight_dashboard_role
" \ --user-roleREADER
\ --user-namejhnd
\ --session-name "john.doe@example.com
" \ --emailjohn.doe@example.com
\ --regionus-east-1
\ --custom-permissions-nameTeamA1
Si el usuario se ha autenticado a través de Microsoft AD, no es necesario utilizar RegisterUser
para configurarlo. En cambio, deberá suscribirse automáticamente la primera vez que obtenga acceso a QuickSight. En el caso de los usuarios de Microsoft AD, puede utilizar DescribeUser
para obtener el ARN del usuario.
La primera vez que un usuario accede QuickSight, también puede añadirlo al grupo con el que se comparte el panel. En el siguiente ejemplo, se muestra el comando de la CLI para añadir un usuario a un grupo.
aws quicksight create-group-membership \ --aws-account-id=
111122223333
\ --namespace=default \ --group-name=financeusers
\ --member-name="embedding_quicksight_dashboard_role/john.doe@example.com
"
Ahora tienes un usuario de tu aplicación que también es usuario del panel de QuickSight control y tiene acceso a él.
Por último, para obtener una URL firmada para el panel, llame a generate-embed-url-for-registered-user
desde el servidor de aplicaciones. Esta operación devuelve la URL del panel integrable. En el siguiente ejemplo, se muestra cómo generar la URL de un panel integrado mediante una llamada desde el servidor para los usuarios autenticados mediante un inicio de sesión único ( AWS Managed Microsoft AD IAM Identity Center).
aws quicksight generate-embed-url-for-registered-user \ --aws-account-id
111122223333
\ --session-lifetime-in-minutes600
\ --user-arnarn:aws:quicksight:us-east-1:111122223333:user/default/embedding_quicksight_visual_role/embeddingsession
\ --allowed-domains '["domain1
","domain2
"]' \ --experience-configuration Dashboard={InitialDashboardId=1a1ac2b2-3fc3-4b44-5e5d-c6db6778df89
}
Para obtener más información sobre el uso de esta operación, consulte GenerateEmbedUrlForRegisteredUser. Puedes usar esta y otras operaciones de la API en tu propio código.
Paso 3 integración de la URL del panel
En la siguiente sección, encontrará información sobre cómo utilizar el Amazon QuickSight Embedding SDK
-
Coloque el panel en una página HTML.
-
Transferir los parámetros al panel.
-
Resolver los estados de error con mensajes que se personalizan en su aplicación.
Llamar a la operación de la API GenerateEmbedUrlForRegisteredUser
para generar la dirección URL que puede integrar en la aplicación. Esta URL es válida durante 5 minutos, y la sesión resultante es válida hasta 10 horas. La operación de la API proporciona la URL con un auth_code
que permite una sesión con inicio único.
El siguiente es un ejemplo de respuesta de generate-embed-url-for-registered-user
.
//The URL returned is over 900 characters. For this example, we've shortened the string for //readability and added ellipsis to indicate that it's incomplete. { "Status": "200", "EmbedUrl": "https://
quicksightdomain
/embed/12345/dashboards/67890..", "RequestId": "7bee030e-f191-45c4-97fe-d9faf0e03713" }
Inserte este panel en su página web mediante el SDK de QuickSight incrustación
El dominio que alojará los paneles integrados debe estar en la lista de dominios permitidos, la lista de dominios aprobados para su suscripción. Amazon QuickSight Este requisito protege los datos impidiendo que dominios no aprobados alojen paneles integrados. Para obtener más información acerca de añadir dominios a los paneles integrados, consulte Permite publicar dominios en tiempo de ejecución con la API QuickSight .
En el siguiente ejemplo, se muestra cómo utilizar la URL generada. Este código se genera en el servidor de aplicaciones.
<!DOCTYPE html>
<html>
<head>
<title>Dashboard Embedding Example</title>
<script src="https://unpkg.com/amazon-quicksight-embedding-sdk@2.0.0/dist/quicksight-embedding-js-sdk.min.js"></script>
<script type="text/javascript">
const embedDashboard = async() => {
const {
createEmbeddingContext,
} = QuickSightEmbedding;
const embeddingContext = await createEmbeddingContext({
onChange: (changeEvent, metadata) => {
console.log('Context received a change', changeEvent, metadata);
},
});
const frameOptions = {
url: '<YOUR_EMBED_URL>',
container: '#experience-container',
height: "700px",
width: "1000px",
onChange: (changeEvent, metadata) => {
switch (changeEvent.eventName) {
case 'FRAME_MOUNTED': {
console.log("Do something when the experience frame is mounted.");
break;
}
case 'FRAME_LOADED': {
console.log("Do something when the experience frame is loaded.");
break;
}
}
},
};
const contentOptions = {
parameters: [
{
Name: 'country',
Values: [
'United States'
],
},
{
Name: 'states',
Values: [
'California',
'Washington'
]
}
],
locale: "en-US",
sheetOptions: {
initialSheetId: '<YOUR_SHEETID>',
singleSheet: false,
emitSizeChangedEventOnSheetChange: false,
},
toolbarOptions: {
export: false,
undoRedo: false,
reset: false
},
attributionOptions: {
overlayContent: false,
},
onMessage: async (messageEvent, experienceMetadata) => {
switch (messageEvent.eventName) {
case 'CONTENT_LOADED': {
console.log("All visuals are loaded. The title of the document:", messageEvent.message.title);
break;
}
case 'ERROR_OCCURRED': {
console.log("Error occurred while rendering the experience. Error code:", messageEvent.message.errorCode);
break;
}
case 'PARAMETERS_CHANGED': {
console.log("Parameters changed. Changed parameters:", messageEvent.message.changedParameters);
break;
}
case 'SELECTED_SHEET_CHANGED': {
console.log("Selected sheet changed. Selected sheet:", messageEvent.message.selectedSheet);
break;
}
case 'SIZE_CHANGED': {
console.log("Size changed. New dimensions:", messageEvent.message);
break;
}
case 'MODAL_OPENED': {
window.scrollTo({
top: 0 // iframe top position
});
break;
}
}
},
};
const embeddedDashboardExperience = await embeddingContext.embedDashboard(frameOptions, contentOptions);
const selectCountryElement = document.getElementById('country');
selectCountryElement.addEventListener('change', (event) => {
embeddedDashboardExperience.setParameters([
{
Name: 'country',
Values: event.target.value
}
]);
});
};
</script>
</head>
<body onload="embedDashboard()">
<span>
<label for="country">Country</label>
<select id="country" name="country">
<option value="United States">United States</option>
<option value="Mexico">Mexico</option>
<option value="Canada">Canada</option>
</select>
</span>
<div id="experience-container"></div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Basic Embed</title>
<script src="https://unpkg.com/amazon-quicksight-embedding-sdk@1.0.15/dist/quicksight-embedding-js-sdk.min.js"></script>
<script type="text/javascript">
var dashboard
function onDashboardLoad(payload) {
console.log("Do something when the dashboard is fully loaded.");
}
function onError(payload) {
console.log("Do something when the dashboard fails loading");
}
function embedDashboard() {
var containerDiv = document.getElementById("embeddingContainer");
var options = {
// replace this dummy url with the one generated via embedding API
url: "https://us-east-1.quicksight.aws.amazon.com/sn/dashboards/dashboardId?isauthcode=true&identityprovider=quicksight&code=authcode",
container: containerDiv,
parameters: {
country: "United States"
},
scrolling: "no",
height: "700px",
width: "1000px",
locale: "en-US",
footerPaddingEnabled: true
};
dashboard = QuickSightEmbedding.embedDashboard(options);
dashboard.on("error", onError);
dashboard.on("load", onDashboardLoad);
}
function onCountryChange(obj) {
dashboard.setParameters({country: obj.value});
}
</script>
</head>
<body onload="embedDashboard()">
<span>
<label for="country">Country</label>
<select id="country" name="country" onchange="onCountryChange(this)">
<option value="United States">United States</option>
<option value="Mexico">Mexico</option>
<option value="Canada">Canada</option>
</select>
</span>
<div id="embeddingContainer"></div>
</body>
</html>
Para que este ejemplo funcione, asegúrese de utilizar el SDK de Amazon QuickSight Embedding para cargar el panel integrado en su sitio web utilizando JavaScript. Para obtener su copia, siga uno de estos pasos:
-
Descargue el SDK de Amazon QuickSight Embedding
desde GitHub. Este repositorio lo mantiene un grupo de QuickSight desarrolladores. -
Descargue la última versión del SDK de incrustación desde https://www.npmjs.com/package/amazon-quicksight-embedding-sdk
. -
Si lo usas
npm
para JavaScript dependencias, descárgalo e instálalo ejecutando el siguiente comando.npm install amazon-quicksight-embedding-sdk