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

# Connect Customer Web 呼叫小工具的其他自訂
<a name="more-customizations-web-calling-widget"></a>

您可以將下列其他自訂新增至您的 Web 通話小工具：
+ 將[背景模糊](#background-blur)套用至客戶的視訊圖磚。
+ 將小工具設定為[全螢幕](#fullscreen-mode)。
+ 選取[預設攝影機裝置](#choose-default-camera)。
+ [調整視訊大小](#resize-video)以符合其容器。

下列各節說明自訂的詳細資訊、其使用案例，以及如何設定它們。您可以透過設定 `WebCallingCustomizationObject` 來管理這些自訂。

**Topics**
+ [背景模糊](#background-blur)
+ [全螢幕模式](#fullscreen-mode)
+ [選擇預設攝影機裝置](#choose-default-camera)
+ [調整視訊大小](#resize-video)
+ [設定自訂物件](#configure-customization-object-web)
+ [支援的選項和限制](#supported-options-web-calling)

## 背景模糊
<a name="background-blur"></a>

此自訂可控制客戶視訊的背景模糊行為。啟用時，若視訊作用中，客戶的背景會模糊。這有助於保護他們在視訊通話期間可能在背景中顥示的個人資訊或私有空間。

若要啟用背景模糊，請在 `WebCallingCustomizationObject` 中將 `videoFilter.backgroundBlur.option` 設定為 `ENABLED_ON_BY_DEFAULT`。

## 全螢幕模式
<a name="fullscreen-mode"></a>

使用此自訂來控制小工具的全螢幕行為。有兩種方式可以啟用全螢幕：
+ 將全螢幕按鈕新增至小工具。客戶可以使用按鈕來開啟和關閉全螢幕。

  若要新增全螢幕按鈕，請將 `fullscreen.displayButton` 設定為 `ENABLED`。

或
+ 載入時將小工具設定為全螢幕。

  若要在載入時啟用全螢幕，請將 `fullscreen.fullscreenOnLoad` 設定為 `ENABLED`。

當客戶需要專注於小工具時，例如在螢幕共用期間，使用全螢幕模式特別有用。

您可以個別或組合使用這兩個選項。

## 選擇預設攝影機裝置
<a name="choose-default-camera"></a>

此自訂可讓小工具在您客戶啟用視訊時選取預設攝影機裝置，為前置或後置攝影機提供選項。例如，此功能對於遠端診斷設備非常有用。客戶可以使用後置攝影機向客服顯示設備。

若要選取後置攝影機做為預設值，請將 `devices.defaultCamera` 設定為 `Back`。

## 調整視訊大小
<a name="resize-video"></a>

此自訂可控制如何在小工具中調整客戶和客服的視訊圖磚大小。例如，視訊影格可以調整大小以填滿整個視訊圖磚，或縮放以符合視訊圖磚，如果視訊影格的長寬比不符合視訊圖磚，則會留下空白空間。
+ 若要調整客戶的視訊大小，請將 `videoTile.localVideoObjectFit` 設定為目標值。
+ 若要調整客服的視訊大小，請將 `videoTile.remoteVideoObjectFit` 設定為目標值。

如需詳細資訊，請參閱[支援的選項和限制](#supported-options-web-calling)。

## 設定自訂物件
<a name="configure-customization-object-web"></a>

下列範例展示如何實作選用的自訂進行 Web 通話。如需這些選項的詳細描述，請參閱 [支援的選項和限制](#supported-options-web-calling)。

您可以實作以下範例中顯示的部分或全部欄位。當您未實作自訂時，預設行為會用於缺少的欄位。

```
amazon_connect('webCallingCustomizationObject', { 
        videoFilter: { 
            backgroundBlur: { 
                option: "ENABLED_OFF_BY_DEFAULT" 
            }
        },
        fullscreen: {
            displayButton: "ENABLED",
            fullscreenOnLoad: "DISABLED"
        },
        devices: { 
            defaultCamera: "Front" 
        },
        videoTile: {
            localVideoObjectFit: "cover",
            remoteVideoObjectFit: "cover"
        },
        copyDisplayNameFromAuthenticatedChat: true
});
```

下圖顯示自訂在未處於全螢幕模式時的樣子。

![未處於全螢幕模式時的自訂。](http://docs.aws.amazon.com/zh_tw/connect/latest/adminguide/images/fullscreenmode.png)


下圖顯示自訂在處於全螢幕模式時的樣子。

![處於全螢幕模式時的自訂。](http://docs.aws.amazon.com/zh_tw/connect/latest/adminguide/images/nonfullscreenmode.png)


## 支援的選項和限制
<a name="supported-options-web-calling"></a>

下表會列出支援的自訂欄位和建議的數值條件限制。


| 自訂配置選項 | Type | 值 | Description | 
| --- | --- | --- | --- | 
| `videoFilter.backgroundBlur.option` | string | `ENABLED_ON_BY_DEFAULT` \| `ENABLED_OFF_BY_DEFAULT` | 設定客戶的視訊圖磚背景模糊。根據預設，當您的客戶啟用視訊時，背景模糊篩選條件將會套用至視訊圖磚，如果您不想要預設啟用篩選條件，您可以將其設定為 `ENABLED_OFF_BY_DEFAULT`，您的客戶仍然可以在小工具的偏好設定頁面中手動啟用篩選條件。 | 
| `fullscreen.displayButton` | string | `ENABLED` | 將按鈕新增至小工具的右上角，使其在瀏覽器中變成全螢幕。根據預設，此按鈕將不會新增至小工具，如果想要新增此按鈕，您可以將其設定為 `ENABLED`。 | 
| `fullscreen.fullscreenOnLoad` | string | `ENABLED` | 使小工具在瀏覽器中變成全螢幕。根據預設，小工具會錨定到網頁的右下角，將其設定為 `ENABLED` 會使小工具在瀏覽器中變成全螢幕。 | 
| `devices.defaultCamera` | string | `Front` \| `Back` | 當您的客戶啟用視訊時，設定預設攝影機裝置。這是針對行動或平板電腦使用案例。預設會選取預設攝影機 ([詳細資訊](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/enumerateDevices))。(如需詳細資訊，請參閱 Mozilla 開發人員文件中的 [MediaDevices: enumerateDevices() 方法](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/enumerateDevices)。) 當您將其設定為 `Front\|Back` 時，它會選取對應的攝影機，如果可用的話。 | 
| `copyDisplayNameFromAuthenticatedChat` | boolean | `true` \| `false` | 在最終客戶使用[驗證客戶](authenticate-customer.md)流程區塊進行驗證的情況下，將值設定為 `true` 會將顯示名稱複製到語音聯絡人。預設值為 `false`。 | 
| `videoTile.localVideoObjectFit` | string | `fill` \| `contain` \| `cover` \| `none` \| `scale-down` | 在小工具中設定客戶影片圖磚的 [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) 屬性。根據預設，值取決於影片解析度的寬度和高度：如果高度大於寬度，則其將為 `contain`，否則將為 `cover`。如需每個值的詳細描述，請參閱 Mozilla 開發人員文件中的 [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit)。 此屬性只會套用至小工具中客戶視訊的顯示高度和寬度。傳送給客服的客戶視訊高度和寬度不會改變。  | 
| `videoTile.remoteVideoObjectFit` | string | `fill` \| `contain` \| `cover` \| `none` \| `scale-down` | 在小工具中設定客戶影片圖磚的 [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) 屬性。根據預設，值取決於影片解析度的寬度和高度：如果高度大於寬度，則其將為 `contain`，否則將為 `cover`。如需每個值的詳細描述，請參閱 Mozilla 開發人員文件中的 [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit)。 此屬性只會套用至小工具中客服視訊的顯示高度和寬度。  |