

本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。

# 使用 Amazon Quick Sight 內嵌 SDK 啟用內嵌儀表板檢視的可共用連結
<a name="embedded-view-sharing"></a>

Amazon Quick Sight 開發人員可以使用 Amazon Quick Sight 內嵌 SDK (2.8.0 版及更高版本） 來允許內嵌儀表板的讀者接收可共用連結並將其分發至其對內嵌儀表板的檢視。開發人員可以使用儀表板或主控台內嵌，透過使用 Amazon Quick Sight 內嵌 SDK 封裝的 Amazon Quick Sight 參考，產生可共用的應用程式頁面連結。然後，Amazon Quick Sight Readers 可以將此可共用連結傳送給其對等。當其對等存取共用連結時，它們會移至包含內嵌 Amazon Quick Sight 儀表板的應用程式上的 頁面。開發人員也可以產生和儲存儀表板檢視的可共用連結，這些連結可在使用匿名內嵌時做為 Amazon Quick Sight 匿名讀者的書籤。

**先決條件**

開始使用之前，請確定您使用的是 Amazon Quick Sight 內嵌 SDK 2.8.0 版或更新版本

**Topics**
+ [啟用 Amazon Quick Sight 內嵌分析`SharedView`的功能組態](embedded-view-sharing-set-up.md)
+ [使用 Amazon Quick Sight `createSharedView` API 建立共用檢視](embedded-view-sharing-sdk-create.md)
+ [使用共用的 Amazon Quick Sight 檢視](embedded-view-sharing-sdk-consume.md)

# 啟用 Amazon Quick Sight 內嵌分析`SharedView`的功能組態
<a name="embedded-view-sharing-set-up"></a>

當您使用 Amazon Quick Sight API 建立內嵌執行個體時，請將`FeatureConfigurations`承載`SharedView`中的 值設定為 `true`，如以下範例所示。 會`SharedView`覆寫存取內嵌儀表板的已註冊使用者`StatePersistence`組態。如果儀表板使用者已停用 `StatePersistence` 並啟用 `SharedView`，則其狀態仍將持續存在。

```
const generateNewEmbedUrl = async () => {
    const generateUrlPayload = {
        experienceConfiguration: {
            QuickSightConsole: {
            FeatureConfigurations: {
                "SharedView": { 
                    "Enabled": true
                 },
            },
        },
    }
    const result: GenerateEmbedUrlResult = await generateEmbedUrlForRegisteredUser(generateUrlPayload);
    return result.url;
};
```

# 使用 Amazon Quick Sight `createSharedView` API 建立共用檢視
<a name="embedded-view-sharing-sdk-create"></a>

將嵌入式 SDK 更新至 2.8.0 版或更新版本後，請使用 `createSharedView` API 建立新的共用檢視。記錄操作傳回的 `sharedViewId` 和 `dashboardId`。下方範例會建立新的共用檢視。

```
const response = await embeddingFrame.createSharedView();
const sharedViewId = response.message.sharedViewId;
const dashboardId = response.message.dashboardId;
```

只有在使用者檢視儀表板時，才能呼叫 `createSharedView`。如果要建立主控台特定的共用檢視，請確定使用者位於儀表板頁面，然後再啟用 `createSharedView` 動作。您可以使用 `PAGE_NAVIGATION` 事件執行此操作，如下方範例所示。

```
const contentOptions = {
    onMessage: async (messageEvent, metadata) => {
    switch (messageEvent.eventName) {
            case 'CONTENT_LOADED': {
                console.log("Do something when the embedded experience is fully loaded.");
                break;
            }
            case 'ERROR_OCCURRED': {
                console.log("Do something when the embedded experience fails loading.");
                break;
            }
            case 'PAGE_NAVIGATION': {
                setPageType(messageEvent.message.pageType); 
                if (messageEvent.message.pageType === 'DASHBOARD') {
                    setShareEnabled(true);
                    } else {
                    setShareEnabled(false);
                }
                break;
            }
        }
    }
};
```

# 使用共用的 Amazon Quick Sight 檢視
<a name="embedded-view-sharing-sdk-consume"></a>

建立新的共用檢視後，請使用嵌入式 SDK 讓其他使用者也可使用共用檢視。以下範例為 Amazon Quick Sight 中的內嵌儀表板設定消耗性共用檢視。

------
#### [ With an appended URL ]

在 ` /views/{viewId}` 下，將 `sharedViewId` 附加至嵌入式 URL，並將此 URL 公開給您的使用者。使用者可以使用此 URL 來導覽至該共用檢視。

```
const response = await dashboardFrame.createSharedView();
const newEmbedUrl = await generateNewEmbedUrl();
const formattedUrl = new URL(newEmbedUrl);
formattedUrl.pathname = formattedUrl.pathname.concat('/views/' + response.message.sharedViewId);
const baseUrl = formattedUrl.href;
alert("Click to view this QuickSight shared view", baseUrl);
```

------
#### [ With the contentOptions SDK ]

將 `viewId` 傳遞至 `contentOptions`，以開啟具有指定 `viewId` 的檢視。

```
const contentOptions = {
    toolbarOptions: {
        ...
    },
    viewId: sharedViewId,
};

const embeddedDashboard = await embeddingContext.embedDashboard(
    {container: containerRef.current},
    contentOptions
);
```

------
#### [ With the InitialPath property ]

```
const shareView = async() => {
    const returnValue = await consoleFrame.createSharedView();
    const {dashboardId, sharedViewId} = returnValue.message;
    const newEmbedUrl = await generateNewEmbedUrl(`/dashboards/${dashboardId}/views/${sharedViewId}`);
    setShareUrl(newEmbedUrl);
};

const generateNewEmbedUrl = async (initialPath) => {
    const generateUrlPayload = {
        experienceConfiguration: {
            QuickSightConsole: {
            InitialPath: initialPath,
            FeatureConfigurations: {
                "SharedView": { 
                    "Enabled": true
                 },
            },
        },
    }
    const result: GenerateEmbedUrlResult = await generateEmbedUrlForRegisteredUser(generateUrlPayload);
    return result.url;
};
```

------