AWS QuickSight嵌入式仪表板在Chrome和Firefox中引发错误/警告

问题描述

我已经成功生成了QuickSight Dashboard网址,但是当我尝试使用quicksight-embedding-sdk将我的仪表板嵌入到Amplify应用程序中时,包含嵌入式仪表板的div将不会显示该仪表板,而是一个错误

在Chrome中,它是: “ us-east-1.quicksight.aws.amazon.com拒绝连接。”

出现这些“问题”:

 "Indicate whether to send a cookie in a cross-site request by specifying its SameSite attribute"

 "Indicate whether a cookie is intended to be set in cross-site context by specifying its SameSite 
 attribute"

在Firefox中是:

    "Firefox Can’t Open This Page
     To protect your security,us-east-1.quicksight.aws.amazon.com will not allow Firefox 
     to display the page if another site has embedded it. To see this page,you need to open it in a new window."

出现以下警告:

Content Security Policy: Couldn’t process unkNown directive ‘report-to’
Cookie “qs_lang” will be soon rejected because it has the “sameSite” attribute set to “none” or an invalid value,without the “secure” attribute. To kNow more about the “sameSite“ attribute,read https://developer.mozilla.org/docs/Web/HTTP/Headers/Set-Cookie/SameSite
This error page has no error code in its security info

我当前的工作流程是: 我的Amplify应用程序中的一个用户登录后,这些Cognito凭据用于调用触发lambda函数的api,该函数注册一个用户,然后生成一个嵌入的url,然后该URL成功返回。

我已经将仪表板共享给了通过我的应用程序注册用户,并将我的放大应用程序的域列入了白名单。

我不确定这是否重要,但是我的认知和仪表板位于“ us-east-2”中,但是我不得不使用“ us-east-1”来注册我的用户(否则我会收到一条错误消息,询问我使用“ us-east-1”。

相关代码段:

HTML:

<div id="embeddingContainer"></div>

JS:

embedDashboard(embedUrl) {
    //embedUrl is being returned as expected
    const options = {
        url: embedUrl,container: document.getElementById("embeddingContainer"),scrolling: "no",height: "700px",width: "1000px",locale: "en-US",footerPaddingEnabled: true,};
    let dashboard = embedDashboard(options);
    dashboard.on("error",this.onError);
    dashboard.on("load",this.onDashboardLoad);
},//Neither onDashboardLoad nor onError are being called
onDashboardLoad(payload) {
    console.log("Do something when the dashboard is fully loaded.",payload);
},onError(payload) {
    console.log("Do something when the dashboard fails loading",

我不确定我是否已经破坏了某些内容,或者Chrome / Firefox不再支持该库。 我看到较早的https://answers.quicksight.aws.amazon.com/sn/questions/4701/quicksight-embedding-no-longer-works-in-new-chrome.html浏览器支持存在问题吗?但是从我的答复中我认为已经解决了。

感谢所有帮助和见解!

解决方法

我尝试过

AWS.config.update({
    "region": "us-east-2"
});

var quicksight = new AWS.QuickSight();

注册用户后(按用户分类,数据在us-east-2中),但在临时创建嵌入url之前,现在显示我的仪表板。