Le traduzioni sono generate tramite traduzione automatica. In caso di conflitto tra il contenuto di una traduzione e la versione originale in Inglese, quest'ultima prevarrà.

# Configurare l’esperienza di chat dei clienti in Amazon Connect
<a name="enable-chat-in-app"></a>

È possibile fornire ai clienti un'esperienza di chat usando uno dei seguenti metodi: 
+ [Aggiungere un’interfaccia utente di chat a un sito web ospitato da Amazon Connect](add-chat-to-website.md). 
+ [Personalizzare la chat con l’esempio open source di Amazon Connect](download-chat-example.md). 
+ [Personalizza la tua soluzione con Amazon Connect APIs](integrate-with-startchatcontact-api.md). Per personalizzare le esperienze di chat, è consigliabile iniziare con la libreria open source ChatJS di Amazon Connect. Per altre informazioni, consulta il repository [Amazon Connect ChatJS](https://github.com/amazon-connect/amazon-connect-chatjs) in GitHub. 

## Altre risorse per personalizzare l'esperienza di chat
<a name="more-resource-customize-chat"></a>
+ I messaggi interattivi forniscono ai clienti un prompt e opzioni di visualizzazione preconfigurate tra cui scegliere. Questi messaggi sono alimentati da Amazon Lex e configurati tramite Amazon Lex utilizzando una funzione Lambda. Per istruzioni su come aggiungere messaggi interattivi tramite Amazon Lex, consulta questo blog: [Easily set up interactive messages for your Amazon Connect chatbot](https://aws.amazon.com/blogs/contact-center/easily-set-up-interactive-messages-for-your-amazon-connect-chatbot/).

  Amazon Connect supporta i seguenti modelli: un selettore di elenco e un selettore di orario. Per ulteriori informazioni, consulta [Aggiunta di messaggi interattivi Amazon Lex per i clienti in chat](interactive-messages.md). 
+  [Abilitazione di Apple Messages for Business con Amazon Connect](apple-messages-for-business.md) 
+  [Documentazione dell'API del servizio Amazon Connect](https://docs.aws.amazon.com/connect/latest/APIReference), in particolare l'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API.
+  [API di servizio Amazon Connect per i partecipanti](https://docs.aws.amazon.com/connect-participant/latest/APIReference/Welcome.html). 
+  [SDK per le chat Amazon Connect e implementazioni di esempio](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/) 
+  [Amazon Connect Streams](https://github.com/aws/amazon-connect-streams). Usala per integrare le app esistenti con Amazon Connect. Puoi incorporare i componenti del Pannello di controllo dei contatti (CCP) nell'app. 
+  [Abilita lo streaming di messaggi per la chat basata sull'intelligenza artificiale](message-streaming-ai-chat.md) 

# Il chat/SMS canale in Amazon Connect
<a name="web-and-mobile-chat"></a>

**Importante**  
**Stai cercando di contattare Amazon per ricevere assistenza?** Consulta la pagina del [servizio clienti Amazon](https://www.amazon.com/gp/help/customer/display.html?icmpid=docs_connect_messagingcap_customerservice) (ordini e consegne Amazon) o il [Supporto AWS](https://aws.amazon.com/premiumsupport/?icmpid=docs_connect_messagingcap_premiumsupport) (Amazon Web Services).

Amazon Connect consente di integrare funzionalità di messaggistica chat (chat per dispositivi mobili, chat web, SMS e servizi di messaggistica di terze parti) nel sito web e nelle app per dispositivi mobili. Consente ai tuoi clienti di iniziare una conversazione via chat con gli agenti dei contact center da qualsiasi applicazione aziendale, Web o per dispositivi mobili. 

Le interazioni sono asincrone e consentono ai tuoi clienti di avviare una chat con un agente o un Amazon Lex Bot, sospendere e quindi riprendere nuovamente la conversazione. Possono anche cambiare dispositivo e continuare la chat.

**Topics**
+ [Più canali, un'unica esperienza](#unified-experience-chat)
+ [Nozioni di base](#enable-chat)
+ [Scenario di chat di esempio](#example-chat-scenario)
+ [Quando finiscono le chat?](#when-do-chats-end)
+ [Prezzi](#web-and-mobile-chat-pricing)
+ [Ulteriori informazioni](#chat-more-info)

## Più canali, un'unica esperienza
<a name="unified-experience-chat"></a>

Gli agenti dispongono di un'unica interfaccia utente per aiutare i clienti a utilizzare voce, chat e attività. Ciò riduce il numero di strumenti che gli agenti devono imparare a usare e il numero di schermi con cui devono interagire. 

Le attività di chat si integrano nei flussi del contact center esistenti e nell'automazione che hai creato per la voce. I flussi vengono creati una sola volta e riutilizzati su più canali. 

La raccolta di metriche e i pannelli di controllo che hai creato traggono automaticamente vantaggio dalle metriche su più canali.

## Nozioni di base
<a name="enable-chat"></a>

Per aggiungere funzionalità di messagistica chat al contact center Amazon Connect e consentire agli agenti di partecipare alle chat, esegui la procedura seguente:
+ La chat è abilitata a livello di istanza quando [viene creato un bucket Amazon S3 per l'archiviazione delle trascrizioni della chat](amazon-connect-instances.md#get-started-data-storage).
+ [Aggiungi la chat al profilo di routing del tuo agente.](routing-profiles.md)
+ Facoltativamente, puoi configurare sottotipi di chat come messaggistica SMS. Puoi procurarti un numero di telefono abilitato agli SMS utilizzandolo AWS End User Messaging SMS Amazon Connect, importandolo e assegnandolo ai tuoi flussi. Per ulteriori informazioni, consulta: 
  + [Richiedi un numero di telefono abilitato agli SMS tramite AWS End User Messaging SMS](sms-number.md)
  + [Configurare la messaggistica SMS in Amazon Connect](setup-sms-messaging.md)

Gli agenti possono quindi iniziare ad accettare le chat tramite il Pannello di controllo contatti.

Puoi visualizzare le metriche storiche e in tempo reale per il canale di messaggistica di chat (ad esempio, orario di arrivo, orario di gestione) come parte delle metriche complessive del canale di chat nella stessa esperienza di reporting utilizzata per valutare le prestazioni e la calls/chats/tasks produttività degli agenti.

Amazon Connect offre diverse risorse per aiutarti ad aggiungere chat al tuo sito web. Per ulteriori informazioni, consulta [Configurare l’esperienza di chat dei clienti in Amazon Connect](enable-chat-in-app.md).

## Scenario di chat di esempio
<a name="example-chat-scenario"></a>

È in corso una chat tra un cliente e un agente. Il cliente smette di rispondere all'agente. L'agente chiede "Ci sei?" ma non ottiene risposta. L'agente lascia la chat. Ora la chat non è più associata a un agente; il flusso determina cosa succede dopo. 

In questo scenario, il cliente alla fine invia un altro messaggio ("Ehi, sono tornato") e la chat riprende. A seconda della logica che hai definito nel flusso, la chat può essere assegnata all'agente originale o a un agente diverso o a una cosa diversa.

Ecco come si crea questo scenario:

1. Creare un flusso di disconnessione. L'immagine seguente mostra il [Flusso di disconnessione di esempio in Amazon Connect](sample-disconnect.md) nella finestra del designer del flusso. Questo flusso include i seguenti blocchi connessi: **Riproduci prompt**, **Attes**a che si dirama in tre opzioni **Riproduci prompt** (per **Cliente tornato**, **Tempo scaduto** ed **Errore**), quindi **Trasferisci in coda** e **Disconnetti**.  
![\[Il flusso di disconnessione di esempio.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/sample-disconnect-flow.png)

1.  Nel flusso di disconnessione aggiungere un blocco di [Wait (Attesa)](wait.md). Il blocco Wait (Attesa) ha due rami: 
   +  **Timeout**: esegui questo ramo se il cliente non ha inviato un messaggio dopo un determinato periodo di tempo. La durata totale della chat, inclusi i blocchi **Attesa**, non può superare i 7 giorni. 

      Ad esempio, per questo ramo potresti semplicemente voler eseguire un blocco **Disconnect (Disconnetti)** e terminare la chat. 
   +  **Customer return (Ritorno cliente)**: esegui questo ramo quando il cliente ritorna e invia un messaggio. Con questo ramo è possibile indirizzare il cliente all'agente precedente, alla coda precedente oppure impostare una nuova coda operativa o un nuovo agente operativo. 

1.  Nel flusso di contatti in entrata, aggiungi il blocco [Imposta flusso disconnessione](set-disconnect-flow.md). Questo blocco viene usato per specificare che quando l'agente o l'Amazon Lex Bot si sono disconnessi dalla chat e rimane solo il cliente deve essere eseguito il flusso di disconnessione impostato. 

    Nel blocco seguente, ad esempio, è stato specificato che il **Sample disconnect flow (Flusso di disconnessione di esempio)** deve essere eseguito.   
![\[Il blocco Imposta flusso disconnessione, il menu a discesa Seleziona un flusso, l'opzione Flusso di disconnessione di esempio.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/set-disconnect-flow.png)

    Per un esempio che utilizza il blocco di **Set disconnect flow (Imposta flusso di disconnessione)** consultare il [Flusso in entrata di esempio](sample-inbound-flow.md). 

## Quando finiscono le chat?
<a name="when-do-chats-end"></a>

 Per impostazione predefinita, la durata totale di una conversazione di chat, incluso il tempo trascorso in attesa quando il cliente non è attivo, non può superare le 25 ore. Tuttavia, puoi modificare questa durata predefinita e configurare invece una durata della chat personalizzata. Puoi configurare una chat in modo che duri da un minimo di 1 ora (60 minuti) a un massimo di 7 giorni (10.080 minuti). Per configurare una durata della chat personalizzata, chiama l'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API e aggiungi il `ChatDurationInMinutes` parametro. 

Durante una sessione di chat in corso, non esiste alcun limite al numero di volte in cui un cliente può uscire e accedere nuovamente a una sessione di chat in corso esistente. A tale scopo, utilizza il blocco [Attesa](wait.md). Ad esempio, potresti attendere 12 ore che il cliente riprenda la chat prima di terminare la sessione di chat. Se il cliente cerca di riprendere la chat dopo 12 ore, puoi fare in modo nel flusso che un Amazon Lex Bot chieda se ti sta contattando per lo stesso problema o un problema diverso. 

Specificando un tempo di attesa significativamente inferiore alla durata della chat, contribuisci a garantire che i clienti abbiano un'esperienza positiva. Ad esempio, per una chat della durata di 25 ore, è possibile che il cliente riprenda la chat dopo 24 ore e 58 minuti e che quindi questa venga interrotta dopo due minuti perché la conversazione termina automaticamente allo scadere del limite di 25 ore.

**Suggerimento**  
Se utilizzi Amazon Lex con la chat, tieni presente che il timeout predefinito per una sessione Amazon Lex è di 5 minuti. La durata totale di una sessione non può superare le 24 ore. Per modificare il timeout della sessione, consulta [Impostazione del timeout di sessione](https://docs.aws.amazon.com/lex/latest/dg/context-mgmt.html#context-mgmt-session-timeoutg) nella *Guida per gli sviluppatori di Amazon Lex*. 

## Prezzi
<a name="web-and-mobile-chat-pricing"></a>

La chat viene addebitata in base all'utilizzo. Non sono richiesti pagamenti anticipati, impegni a lungo termine o tariffe mensili minime. Paghi per messaggio di chat, indipendentemente dal numero di agenti o clienti che la utilizzano. I prezzi regionali possono variare. Per ulteriori informazioni, consulta [Prezzi di Amazon Connect](https://aws.amazon.com/connect/pricing/). 

## Ulteriori informazioni
<a name="chat-more-info"></a>

Per ulteriori informazioni sulla chat, consulta i seguenti argomenti:
+  [Testare le esperienze per chiamate vocali, chat e attività in Amazon Connect](chat-testing.md) 
+  [Come funziona l'instradamento con più canali](about-routing.md#routing-profile-channels-works) 
+  [Creare un profilo di routing in Amazon Connect per collegare le code agli agenti](routing-profiles.md) 
+  [SDK per le chat Amazon Connect e implementazioni di esempio](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/) 

# Aggiungere un’interfaccia utente di chat a un sito web ospitato da Amazon Connect
<a name="add-chat-to-website"></a>

Per supportare i clienti tramite chat, puoi aggiungere un widget di comunicazione al sito web ospitato da Amazon Connect. Puoi configurare il widget di comunicazione nel sito web di Amazon Connect amministrazione. Puoi personalizzare il carattere e i colori e proteggere il widget in modo che possa essere avviato solo dal sito web. Alla fine avrai un frammento di codice breve da aggiungere al sito web. 

Poiché Amazon Connect ospita il widget, garantisce che sul tuo sito web sia sempre disponibile la versione più recente. 

**Suggerimento**  
L'uso del widget di comunicazione è soggetto a Service Quotas predefinite, come il numero di caratteri richiesti per ogni messaggio. Prima di avviare la produzione del widget di comunicazione, assicurati che le Service Quotas siano impostate in base alle esigenze dell'organizzazione. Per ulteriori informazioni, consulta [Amazon Connect quote di servizio](amazon-connect-service-limits.md). 

**Topics**
+ [Campi snippet del widget supportati che sono personalizzabili](supported-snippet-fields.md)
+ [Browser supportati](#chat-widget-supported-browsers)
+ [Passaggio 1: personalizzazione del widget di comunicazione](#customize-chat-widget)
+ [Passaggio 2: specifica dei domini del sito web in cui è prevista la visualizzazione del widget di comunicazione](#chat-widget-domains)
+ [Passaggio 3: confermare e copiare il codice del widget di comunicazione e le chiavi di sicurezza](#confirm-and-copy-chat-widget-script)
+ [Ricevi messaggi di errore?](#chat-widget-error-messages)
+ [Customize widget launch behavior and button icon](customize-widget-launch.md)
+ [Trasmissione del nome visualizzato del cliente](pass-display-name-chat.md)
+ [Trasmissione degli attributi di contatto](pass-contact-attributes-chat.md)
+ [Personalizzazioni aggiuntive per il widget di chat](pass-customization-object.md)
+ [Scaricare la trascrizione del widget di chat](chat-widget-download-transcript.md)
+ [Download e personalizzazione il nostro esempio open source](download-chat-example.md)
+ [Avvia chat nelle tue applicazioni utilizzando Amazon Connect APIs](integrate-with-startchatcontact-api.md)
+ [Inviare notifiche via browser ai clienti quando arrivano messaggi di chat](browser-notifications-chat.md)
+ [Disconnessione della chat a livello di programmazione](programmatic-chat-disconnect.md)
+ [Trasferire proprietà personalizzate per la sovrascrittura delle impostazioni predefinite nel widget di comunicazione](pass-custom-styles.md)
+ [Scegli come target il pulsante e la cornice del widget con CSS/ JavaScript](target-widget-button.md)
+ [Risoluzione dei problemi relativi al widget di comunicazione](ts-cw.md)
+ [Aggiungere un modulo di pre-contatto o pre-chat](add-precontact-form.md)
+ [Sondaggio post-chat](enable-post-chat-survey.md)

# Campi snippet del widget supportati in Amazon Connect che sono personalizzabili
<a name="supported-snippet-fields"></a>

Nella tabella seguente sono elencati i campi snippet del widget di comunicazione che è possibile personalizzare. Il codice di esempio dopo la tabella mostra come utilizzare i campi snippet.


| Campo snippet | Tipo | Description | Documentazione supplementare | 
| --- | --- | --- | --- | 
| `snippetId` | Stringa | Obbligatorio, generato automaticamente | N/A | 
| `styles` | Stringa | Obbligatorio, generato automaticamente | N/A | 
| `supportedMessagingContentTypes` | Array | Obbligatorio, generato automaticamente | N/A | 
| `customLaunchBehavior` | Oggetto | Personalizzazione del modo in cui il sito web esegue il rendering e avvia l'icona del widget ospitato | [Personalizzare il comportamento di avvio dei widget e l’icona dei pulsanti per un sito web ospitato in Amazon Connect](customize-widget-launch.md), in seguito in questo argomento | 
| `authenticate` | Funzione | Funzione di callback per abilitare la sicurezza JWT sul sito web | [Passaggio 2: specifica dei domini del sito web in cui è prevista la visualizzazione del widget di comunicazione](add-chat-to-website.md#chat-widget-domains), in precedenza in questa sezione. | 
| `customerDisplayName` | Funzione | Passare il nome visualizzato del cliente durante l'inizializzazione di un contatto | [Passare il nome visualizzato del cliente all’avvio di una chat Amazon Connect](pass-display-name-chat.md), in seguito in questa sezione. | 
| `customStyles` | Oggetto | Sostituzione degli stili CSS predefiniti | [Trasferire proprietà personalizzate per la sovrascrittura delle impostazioni predefinite nel widget di comunicazione in Amazon Connect](pass-custom-styles.md), in seguito in questa sezione. | 
| `chatDurationInMinutes` | Numero | La durata totale della nuova sessione di chat avviata | Impostazione predefinita: 1500 - Min 60, Max: 10080 | 
| `enableLogs` | Booleano | Abilitazione dei log di debug | Impostazione predefinita: false | 
| `language` | Stringa |  Amazon Connect può eseguire traduzioni per i codici di lingua in formato ISO-639 supportati. Per ulteriori informazioni, vedere [https://en.wikipedia. org/wiki/List\$1of\$1ISO\$1639-1\$1Codes](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes). La traduzione non includerebbe le sostituzioni di testo personalizzate e il contenuto dei messaggi (sia inviati che ricevuti).  | Impostazione predefinita: en\$1US. Supportati: ’cs\$1CZ’, ’da\$1DK’, ’de\$1DE’, ’en\$1AU’, ’en\$1CA’, ’en\$1GB’, ’en\$1US’, ’es\$1ES’, ’fi\$1FI’, ’fr\$1FR’, ’hu\$1HU’, ’id\$1ID’, ’it\$1IT’, ’ja\$1JP’, ’ko\$1KR’, ’nl\$1NL’, ’nn\$1NO’ ’pt\$1BR’, ’pt\$1PT’, ’sk\$1SK’, ’sv\$1SE’, ’zh\$1CN’, ’zh\$1TW’ | 
| `disableCSM` | Booleano | Disabilita il monitoraggio delle metriche lato client dal widget di comunicazione. | Impostazione predefinita: false | 
| `nonce` | Stringa | Valore di handshake tra iframe e policy csp del sito web del cliente. Esempio: csp del cliente consente il valore nonce 1234, l'iframe che inserisce un altro script deve avere lo stesso valore nonce 1234 in modo che il browser sappia che si tratta di uno script attendibile del sito principale dell'iframe. | Impostazione predefinita: undefined | 
| `customizationObject` | Oggetto | Personalizzazione del layout e della trascrizione del widget | Per ulteriori informazioni, consulta [Personalizzazioni aggiuntive per il widget di chat Amazon Connect](pass-customization-object.md), in seguito in questa sezione. | 
| `contactAttributes` | Oggetto | Passa gli attributi al flusso di contatto direttamente dal codice dello snippet, senza configurazione di JWT | Per ulteriori informazioni, consulta [Passare gli attributi di contatto all’avvio di una chat](https://docs.aws.amazon.com/connect/latest/adminguide/pass-contact-attributes-chat.html). | 
| `customDisplayNames` | Oggetto | Sostituisce le configurazioni del logo e del nome visualizzato System o Bot impostate nel sito web di amministrazione di Amazon Connect. | Per ulteriori informazioni, consulta [Come passare i logo e i nomi visualizzati system e bot di override per il widget di comunicazione](https://docs.aws.amazon.com/connect/latest/adminguide/pass-custom-styles.html#pass-override-system). | 
| `contactMetadataHandler` | Funzione | Funzione di callback per accedere a contactId. Ad esempio, aggiungi un listener di eventi per gestire scenari come chiamare la StopContact funzione con ContactID quando la scheda del browser è chiusa o mantenere la persistenza della chat con un ContactID precedente.  |  | 
| `registerCallback` | Oggetto | Consente di eseguire callback per gli eventi del ciclo di vita esposti.  Per ulteriori informazioni, consulta [amazon-connect-chatjs](https://github.com/amazon-connect/amazon-connect-chatjs).  | [\[See the AWS documentation website for more details\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/supported-snippet-fields.html) | 
| `initialMessage` | Stringa | Messaggio da inviare alla chat appena creata. Limitazioni della lunghezza: minimo 1, massimo 1024. | Per invocare il bot Lex configurato nel flusso di contatto utilizzando un messaggio iniziale, modifica il [blocco di flusso Recupera input cliente](get-customer-input.md) selezionando l’opzione **Inizializza il bot con un messaggio**. Per ulteriori informazioni, consulta [Come configurare il blocco di flusso Recupera input cliente](get-customer-input.md#get-customer-input-properties). | 
| `authenticationParameters` | Oggetto | Abilita il blocco di flusso [Autentica il cliente](authenticate-customer.md) | Per ulteriori informazioni, consulta [Abilitare l’autenticazione del cliente](enable-connect-managed-auth.md). | 
| `mockLexBotTyping` | Booleano | Abilita la simulazione dell’indicatore di digitazione per i messaggi del bot Lex. | Impostazione predefinita: false | 
| `customStartChat` | Funzione | Funzione di callback per chiamare l’API Start Chat dal tuo backend. | Per ulteriori informazioni, consulta [Interfaccia utente del widget ospitato con API Start Chat personalizzata](https://github.com/amazon-connect/amazon-connect-chat-interface#option-3-hosted-widget-ui-with-custom-start-chat-api)  | 

L'esempio seguente mostra come aggiungere campi snippet allo script HTML che aggiunge il widget di chat al sito web.

```
(function(w, d, x, id) {   /* ... */})(window, document, 
'amazon_connect', 'widgetId');
 amazon_connect('snippetId', 'snippetId');
 amazon_connect('styles', /* ... */);
 amazon_connect('registerCallback', {
    // Custom event example
    // WIDGET_FRAME_CLOSED
    /**
     * This event is triggered when user clicks on the chat widget close button, 
     * either widget close button was clicked when error in the chat session or normally by the user. 
     * This event can be used for webview use cases to go back to main app
     * 
     * @param {string} status - The reason for widget closure
     *   - "error_chat": Indicates the user clicked on widget close button due to an error in the chat session
     *   - "close_chat": Indicates the user clicked on widget close button normally by the user
     */
    'WIDGET_FRAME_CLOSED': (eventName, { status }) => {
        // You can implement custom logic based on the status value(error_chat or close_chat)
        if (status == "error_chat") {
            // handle error chat
        } else if (status == "close_chat") {
            // handle close chat  
        } 
    },
    // System event example
    /**
     * chatDetails: { 
     *     contactId: string, 
     *     participantId: string,
     *     participantToken: string,
     * }
     * data: {
     *     AbsoluteTime?: string,
     *     ContentType?: string,
     *     Type?: string,
     *     ParticipantId?: string,
     *     DisplayName?: string,
     *     ParticipantRole?: string,
     *     InitialContactId?: string
     * }
     */
    'PARTICIPANT_JOINED': (eventName, { chatDetails, data }) => {
        alert(`${data.ParticipantRole} joined the chat.`);
    },
    'event_Name_3': callback(function),
    'event_Name_4': callback(function),
    // ...
}); 
amazon_connect('initialMessage', 'Your initial message string');
// ... 
amazon_connect('snippetFieldHere', /* ... */);
<script/>
```

## Browser supportati
<a name="chat-widget-supported-browsers"></a>

Il widget di comunicazione predefinito supporta le seguenti versioni del browser e le versioni successive: 
+ Google Chrome 85.0
+ Safari 13.1
+ Microsoft Edge versione 85
+ Mozilla Firefox 81.0

Il widget di comunicazione supporta le notifiche del browser per i dispositivi desktop. Per ulteriori informazioni, consulta [Inviare notifiche via browser ai clienti quando arrivano messaggi di chat](browser-notifications-chat.md).

## Passaggio 1: personalizzazione del widget di comunicazione
<a name="customize-chat-widget"></a>

In questo passaggio, puoi personalizzare l'esperienza del widget di comunicazione per i tuoi clienti.

1. Accedi al sito web di Amazon Connect amministrazione all'indirizzo https://*instance name*.my.connect.aws/. Scegli **Personalizza widget di comunicazione**.  
![\[Pagina della guida alla configurazione, collegamento Personalizza widget di comunicazione.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-customize-chat-window-button.png)

1. Nella pagina **Widget di comunicazione**, scegli **Aggiungi widget di comunicazione** per iniziare a personalizzare una nuova esperienza con il widget di comunicazione. Per modificare, eliminare o duplicare un widget di comunicazione esistente, scegli una delle opzioni nella colonna **Azioni**, come mostrato nell'immagine seguente.   
![\[Nella pagina dei widget di comunicazione, aggiungi il collegamento al pulsante del widget di comunicazione.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-add-chat-widget.png)

1. Inserisci un **nome** e una **descrizione** per il widget di comunicazione. 
**Nota**  
Il nome deve essere univoco per ogni widget di comunicazione creato in un'istanza Amazon Connect. 

1. Nella sezione **Opzioni di comunicazione**, scegli in che modo i clienti possono interagire con il widget, quindi seleziona **Salva e continua**.
**Nota**  
Puoi abilitare un’attività o un modulo di pre-contatto e-mail solo se le opzioni chat e voce non sono abilitate.

   L’immagine seguente mostra le opzioni per consentire le conferme di ricezione dei messaggi di chat e creare un modulo di pre-chat per i clienti. Per abilitare un modulo di pre-chat, devi prima creare una [visualizzazione](view-resources-sg.md) con un pulsante di azione di connessione e selezionare l’azione `StartChatContact`. Per ulteriori informazioni sui moduli di pre-chat e pre-contatto, consulta [Aggiungere il widget Amazon Connect al sito web](connect-widget-on-website.md).  
![\[La pagina del widget di comunicazione configurata per chiamata web e chat.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/comm-widget-page-chat.png)

1. Nella pagina **Crea widget di comunicazione**, scegli gli stili del pulsante del widget e visualizza i nomi e gli stili.

   Durante la scelta dei colori, l'anteprima della chat si aggiorna automaticamente in modo che sia possibile vedere come apparirà il widget.  
![\[L'anteprima del widget di comunicazione.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/netra-chat-preview.png)

**Stili dei pulsanti**

1. Scegli i colori per lo sfondo del pulsante inserendo valori esadecimali ([codici colore HTML](https://htmlcolorcodes.com/)).

1. Scegli **Bianco** o **Nero** per il colore dell'icona. Il colore dell'icona non può essere personalizzato.

**Intestazione del widget**

1. Indica i valori per il messaggio e il colore dell'intestazione e il colore di sfondo del widget. 

1. **URL del logo**: inserisci un URL che punti al banner con il logo da un bucket Amazon S3 o da un'altra origine online.
**Nota**  
L'anteprima del widget di comunicazione nella pagina di personalizzazione non mostrerà il logo se proviene da un'origine online diversa da un bucket Amazon S3. Tuttavia, il logo verrà visualizzato quando il widget di comunicazione personalizzato verrà implementato nella tua pagina.

   Il banner deve essere in formato .svg, .jpg o .png. L'immagine può misurare fino a 280 px (larghezza) per 60 px (altezza). Qualsiasi immagine più grande di tali dimensioni verrà dimensionata per adattarsi allo spazio dei componenti del logo di 280x60px.

   1. Per istruzioni su come caricare un file come il banner con il logo su S3, consulta [Caricamento degli oggetti](https://docs.aws.amazon.com/AmazonS3/latest/userguide/upload-objects.html) nella *Guida dell'utente di Amazon Simple Storage Service*.

   1. Assicurati che le autorizzazioni dell'immagine siano impostate correttamente in modo che il widget di comunicazione disponga delle autorizzazioni per accedervi. Per informazioni su come rendere un oggetto S3 accessibile al pubblico, consulta [Passaggio 2: aggiunta di una policy del bucket](https://docs.aws.amazon.com/AmazonS3/latest/userguide/WebsiteAccessPermissionsReqd.html#bucket-policy-static-site) nell'argomento *Impostazione delle autorizzazioni per l'accesso al sito web*.

**Visualizzazione chat**

1.  **Carattere**: utilizza il menu a discesa per scegliere il font per il testo nel widget di comunicazione.

1. 
   + **Nome di visualizzazione del messaggio di sistema**: digita un nuovo nome di visualizzazione per sostituire quello predefinito. Il valore predefinito è **SYSTEM\$1MESSAGE**.
   + **Nome di visualizzazione per i messaggi di bot**: digita un nuovo nome di visualizzazione per sostituire quello predefinito. Il valore predefinito è **BOT**.
   + **Segnaposto di input di testo**: digita un nuovo segnaposto per sostituire quello predefinito. Il valore predefinito è **Digita un messaggio**. 
   + **Testo del pulsante Termina chat**: digita un nuovo testo per sostituire quello predefinito. Il valore predefinito è **Termina chat**.

1. **Colore del fumetto della chat dell'agente**: scegli i colori per i fumetti dei messaggi dell'agente inserendo valori esadecimali ([codici di colore HTML](https://htmlcolorcodes.com/)).

1. **Colore del fumetto della chat del cliente**: scegli i colori per i fumetti dei messaggi del cliente inserendo valori esadecimali ([codici di colore HTML](https://htmlcolorcodes.com/)). 

1. Seleziona **Salva e continua**.

## Passaggio 2: specifica dei domini del sito web in cui è prevista la visualizzazione del widget di comunicazione
<a name="chat-widget-domains"></a>

1. Inserisci i domini dei siti web in cui desideri posizionare il widget di comunicazione. La chat viene caricata solo sui siti web selezionati in questo passaggio. 

   Scegli **Aggiungi un dominio** per aggiungere fino a 50 domini.  
![\[L'opzione Aggiungi un dominio.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-add-domain.png)

   Comportamento dell’elenco di domini consentiti:
   + I sottodomini vengono inclusi automaticamente. Ad esempio, se consenti example.com, sono consentiti anche tutti i relativi sottodomini come sub.example.com.
   + Il protocollo http:// o https:// deve corrispondere esattamente alla tua configurazione. Specifica il protocollo esatto quando configuri i domini consentiti.
   + Tutti i percorsi URL sono consentiti automaticamente. Ad esempio, se example.com è consentito, tutte le pagine sottostanti (ad esempio. com/cart or example.com/checkout) sono accessibili. Non puoi consentire o bloccare sottodirectory specifiche.
**Importante**  
Ricontrolla che il tuo sito web URLs sia valido e non contenga errori. Includi l'URL completo che inizia con https://.
Si consiglia di utilizzare https:// per i siti web e le applicazioni di produzione.

1. Nella sezione **Aggiungi sicurezza per il widget di comunicazione**, ti consigliamo di scegliere **Sì** e di collaborare con l'amministratore del sito web per configurare i server web in modo che emettano JSON Web Tokens (JWTs) per nuove richieste di chat. Ciò ti offre un maggiore controllo sull'avvio di nuove chat, inclusa la possibilità di verificare che le richieste di chat inviate ad Amazon Connect provengano da utenti autenticati.  
![\[L’attivazione della sicurezza per le nuove richieste del widget di comunicazione.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-choose-security.png)

   Scegliendo **Sì** si ottiene quanto segue:
   + Amazon Connect fornisce una chiave di sicurezza di 44 caratteri nella pagina successiva che puoi utilizzare per creare token Web JSON (). JWTs
   + Amazon Connect aggiunge una funzione di callback all'interno dello script di incorporamento del widget di comunicazione che verifica la presenza di un token Web JSON (JWT) quando viene avviata una chat.

     È necessario implementare la funzione di callback nel frammento incorporato, come mostrato nell'esempio seguente.

     ```
     amazon_connect('authenticate', function(callback) {
       window.fetch('/token').then(res => {
         res.json().then(data => {
           callback(data.data);
         });
       });
     });
     ```

   Se scegli questa opzione, nel passaggio successivo riceverai una chiave di sicurezza per tutte le richieste di chat avviate sui tuoi siti web. Chiedi all'amministratore del tuo sito Web di configurare i server Web in modo che emettano l' JWTs utilizzo di questa chiave di sicurezza. 

1. Scegli **Save** (Salva).

## Passaggio 3: confermare e copiare il codice del widget di comunicazione e le chiavi di sicurezza
<a name="confirm-and-copy-chat-widget-script"></a>

In questo passaggio, vengono confermate le selezioni, copiato il codice per il widget di comunicazione e incorporato nel sito web. Se hai scelto di utilizzarla JWTs nel [passaggio 2](#chat-widget-domains), puoi anche copiare le chiavi segrete per crearle. 

### Chiave di sicurezza
<a name="chat-widget-security-key"></a>

Usa questa chiave di sicurezza di 44 caratteri per generare token web JSON dal tuo web server. Puoi anche aggiornare o ruotare le chiavi se devi cambiarle. Quando esegui questa operazione, Amazon Connect ti fornisce una nuova chiave e mantiene la chiave precedente fino a quando non hai la possibilità di sostituirla. Dopo aver distribuito la nuova chiave, puoi tornare ad Amazon Connect ed eliminare la chiave precedente.

![\[La chiave di sicurezza fornita da Amazon Connect.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-security-key.png)


Quando i clienti interagiscono con l'icona di avvio della chat sul sito web, il widget di comunicazione richiede al server web un JWT. Quando viene fornito questo JWT, il widget lo includerà come parte della richiesta di chat del cliente finale ad Amazon Connect. Amazon Connect utilizza quindi la chiave segreta per decrittografare il token. In caso di successo, ciò conferma che il JWT è stato emesso dal tuo server web e Amazon Connect instrada la richiesta di chat agli agenti del tuo contact center.

#### Specifiche del token web JSON
<a name="jwt"></a>
+ Algoritmo: **HS256**
+ Richieste:
  + **sottotitolo:** *widgetId*

    Sostituisci il valore `widgetId` con il tuo widgetId. Per trovare il widgetID, consulta l'esempio in [Script del widget di comunicazione](#chat-widget-script).
  + **iat**: \$1emissione al momento.
  + **exp**: \$1scadenza (massimo 10 minuti).
  + **segmentAttributes (facoltativo)**: un set di coppie chiave-valore definite dal sistema archiviate su singoli segmenti di contatto utilizzando una mappa di attributi. Per ulteriori informazioni, SegmentAttributes consulta l'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html#connect-StartChatContact-request-SegmentAttributes)API.
  + **attributi (opzionale)**: oggetto con coppie string-to-string chiave-valore. Gli attributi dei contatti devono rispettare le limitazioni impostate dall'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html#connect-StartChatContact-request-Attributes)API.
  + **relatedContactId (opzionale)**: Stringa con un ID di contatto valido. relatedContactId Devono seguire le limitazioni stabilite dall'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API.
  + **customerId (facoltativo)**: può trattarsi di un ID di Amazon Connect Customer Profiles o di un identificatore personalizzato di un sistema esterno, come un CRM. 

  \$1 Per informazioni sul formato della data, consulta la documentazione IETF (Internet Engineering Task Force): [Token Web JSON (JWT)](https://tools.ietf.org/html/rfc7519), pagina 5. 

Il seguente frammento di codice mostra un esempio di come generare un JWT in Python:

```
import jwt 
import datetime 
CONNECT_SECRET = "your-securely-stored-jwt-secret" 
WIDGET_ID = "widget-id" 
JWT_EXP_DELTA_SECONDS = 500

payload = { 
'sub': WIDGET_ID, 
'iat': datetime.datetime.utcnow(), 
'exp': datetime.datetime.utcnow() + datetime.timedelta(seconds=JWT_EXP_DELTA_SECONDS), 
'customerId': "your-customer-id",
'relatedContactId':'your-relatedContactId',                    
'segmentAttributes': {"connect:Subtype": {"ValueString" : "connect:Guide"}}, 'attributes': {"name": "Jane", "memberID": "123456789", "email": "Jane@example.com", "isPremiumUser": "true", "age": "45"} } 
header = { 'typ': "JWT", 'alg': 'HS256' } 
encoded_token = jwt.encode((payload), CONNECT_SECRET, algorithm="HS256", headers=header) // CONNECT_SECRET is the security key provided by Amazon Connect
```

### Script del widget di comunicazione
<a name="chat-widget-script"></a>

L'immagine seguente mostra un esempio di JavaScript ciò che incorpori nei siti Web in cui desideri che i clienti chattino con gli agenti. Questo script visualizza il widget nell'angolo in basso a destra del sito web. 

![\[Lo script del widget di comunicazione.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-code.png)


Quando il sito web viene caricato, la prima cosa che il cliente vede è l'icona **Avvia**. Quando si sceglie questa icona, il widget di comunicazione viene aperto e i clienti possono inviare un messaggio agli agenti.

Per apportare modifiche al widget di comunicazione in qualsiasi momento, scegli **Modifica**.

**Nota**  
Le modifiche salvate aggiornano l'esperienza del cliente in pochi minuti. Conferma la configurazione del widget prima di salvarlo. 

![\[Il collegamento di modifica nell'anteprima del widget.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-edit.png)


Per apportare modifiche alle icone dei widget sul sito web, riceverai un nuovo frammento di codice per aggiornare direttamente il sito web.

## Ricevi messaggi di errore?
<a name="chat-widget-error-messages"></a>

Se vengono visualizzati messaggi di errore, consulta [Risolvere i problemi relativi al widget di comunicazione Amazon Connect](ts-cw.md).

# Personalizzare il comportamento di avvio dei widget e l’icona dei pulsanti per un sito web ospitato in Amazon Connect
<a name="customize-widget-launch"></a>

Per personalizzare ulteriormente il modo in cui il sito web visualizza e avvia l'icona del widget ospitato, puoi configurare il comportamento di avvio e nascondere l'icona predefinita. Ad esempio, puoi avviare il widget in modo programmatico da un elemento del pulsante **Chatta con noi** visualizzato sul sito web.

**Topics**
+ [Come configurare il comportamento di avvio personalizzato per il widget](#config-widget-launch)
+ [Vincoli e opzioni supportate](#launch-options-constraints)
+ [Configurazione dell'avvio del widget per casi d'uso personalizzati](#launch-usage)
+ [Abilitare la persistenza della sessione di chat tra le schede](#chat-persistence-across-tabs)

## Come configurare il comportamento di avvio personalizzato per il widget
<a name="config-widget-launch"></a>

Per trasmettere un comportamento di avvio personalizzato, utilizza il seguente blocco di codice di esempio e incorporalo nel tuo widget. Tutti i campi mostrati nell'esempio seguente sono facoltativi e può essere utilizzata qualsiasi combinazione.

```
amazon_connect('customLaunchBehavior', {
    skipIconButtonAndAutoLaunch: true,
    alwaysHideWidgetButton: true,
    programmaticLaunch: (function(launchCallback) {
        var launchWidgetBtn = document.getElementById('launch-widget-btn');
        if (launchWidgetBtn) {
            launchWidgetBtn.addEventListener('click', launchCallback);
            window.onunload = function() {
            launchWidgetBtn.removeEventListener('click', launchCallback);
            return;
            }
        }
    })
});
```

## Vincoli e opzioni supportate
<a name="launch-options-constraints"></a>

La tabella seguente elenca le opzioni di comportamento di avvio personalizzato supportate. I campi sono facoltativi e può essere utilizzata qualsiasi combinazione.


| Nome opzione | Tipo | Description | Valore predefinito | 
| --- | --- | --- | --- | 
|  `skipIconButtonAndAutoLaunch`  | Booleano  | Un contrassegno per enable/disable l'avvio automatico del widget senza che l'utente clicchi sul caricamento della pagina. | indefinito | 
|  `alwaysHideWidgetButton`  | Booleano  | Un contrassegno per enable/disable impedire il rendering del pulsante dell'icona del widget (a meno che non sia in corso una sessione di chat). | indefinito | 
|  `programmaticLaunch`  | Funzione  |  | indefinito | 

## Configurazione dell'avvio del widget per casi d'uso personalizzati
<a name="launch-usage"></a>

### Pulsante di avvio del widget personalizzato
<a name="custom-launch-button"></a>

L'esempio seguente mostra le modifiche da apportare al widget per configurare l'avvio programmatico in modo che si apra solo quando l'utente sceglie un elemento del pulsante personalizzato visualizzato in qualsiasi punto del sito web. Ad esempio, puoi scegliere un pulsante denominato **Contattaci** o **Chatta con noi**. Facoltativamente, puoi nascondere l'icona predefinita del widget Amazon Connect fino all'apertura del widget.

```
<button id="launch-widget-btn">Chat With Us</button>
```

```
<script type="text/javascript">
 (function(w, d, x, id){
    s=d.createElement("script");
    s.src="./amazon-connect-chat-interface-client.js"
    s.async=1;
    s.id=id;
    d.getElementsByTagName("head")[0].appendChild(s);
    w[x] =  w[x] || function() { (w[x].ac = w[x].ac || []).push(arguments) };
  })(window, document, 'amazon_connect', 'asfd-asdf-asfd-asdf-asdf');
  amazon_connect('styles', { openChat: { color: '#000', backgroundColor: '#3498fe'}, closeChat: { color: '#fff', backgroundColor: '#123456'} });
  amazon_connect('snippetId', "QVFJREFsdafsdfsadfsdafasdfasdfsdafasdfz0=")
  amazon_connect('customLaunchBehavior', {
        skipIconButtonAndAutoLaunch: true,
        alwaysHideWidgetButton: true,
        programmaticLaunch: (function(launchCallback) {
            var launchWidgetBtn = document.getElementById('launch-widget-btn');
            if (launchWidgetBtn) {
                launchWidgetBtn.addEventListener('click', launchCallback);
                window.onunload = function() {
                launchWidgetBtn.removeEventListener('click', launchCallback);
                return;
                }
            }
        }),
    });
</script>
```

### Supporto di collegamento ipertestuali
<a name="hyperlink-support"></a>

L'esempio seguente mostra le modifiche da apportare al widget per configurare `auto-launch`, che apre il widget senza attendere che l'utente faccia clic. Puoi eseguire la distribuzione su una pagina ospitata dal sito web per creare un collegamento ipertestuale condivisibile.

```
https://example.com/contact-us?autoLaunchMyWidget=true
```

```
<script type="text/javascript">
 (function(w, d, x, id){
    s=d.createElement("script");
    s.src="./amazon-connect-chat-interface-client.js"
    s.async=1;
    s.id=id;
    d.getElementsByTagName("head")[0].appendChild(s);
    w[x] =  w[x] || function() { (w[x].ac = w[x].ac || []).push(arguments) };
  })(window, document, 'amazon_connect', 'asfd-asdf-asfd-asdf-asdf');
  amazon_connect('styles', { openChat: { color: '#000', backgroundColor: '#3498fe'}, closeChat: { color: '#fff', backgroundColor: '#123456'} });
  amazon_connect('snippetId', "QVFJREFsdafsdfsadfsdafasdfasdfsdafasdfz0=")
  amazon_connect('customLaunchBehavior', {
        skipIconButtonAndAutoLaunch: true
    });
</script>
```

### Caricamento delle risorse del widget quando si fa clic sul pulsante
<a name="load-assets"></a>

L'esempio seguente mostra le modifiche da apportare al widget per velocizzare il caricamento della pagina del sito web recuperando le risorse statiche del widget quando un utente fa clic sul pulsante **Chatta con noi**. In genere, solo una piccola percentuale di clienti che visita una pagina **Contattaci** apre il widget Amazon Connect. Il widget potrebbe aggiungere latenza al caricamento della pagina recuperando i file dalla CDN, anche se i clienti non aprono mai il widget.

Una soluzione alternativa consiste nell'eseguire il codice del frammento in modo asincrono (o mai) premendo un pulsante. 

```
<button id="launch-widget-btn">Chat With Us</button>
```

```
var buttonElem = document.getElementById('launch-widget-btn');

buttonElem.addEventListener('click', function() {
    (function(w, d, x, id){
        s=d.createElement("script");
        s.src="./amazon-connect-chat-interface-client.js"
        s.async=1;
        s.id=id;
        d.getElementsByTagName("head")[0].appendChild(s);
        w[x] =  w[x] || function() { (w[x].ac = w[x].ac || []).push(arguments) };
    })(window, document, 'amazon_connect', 'asfd-asdf-asfd-asdf-asdf');
    amazon_connect('styles', { openChat: { color: '#000', backgroundColor: '#3498fe'}, closeChat: { color: '#fff', backgroundColor: '#123456'} });
    amazon_connect('snippetId', "QVFJREFsdafsdfsadfsdafasdfasdfsdafasdfz0=")
    amazon_connect('customLaunchBehavior', {
        skipIconButtonAndAutoLaunch: true
    });
});
```

### Avvio di una nuova chat in una finestra del browser
<a name="new-chat-browser-window"></a>

L'esempio seguente mostra le modifiche da apportare al widget per avviare una nuova finestra del browser e avviare automaticamente la chat a schermo intero.

```
<button id="openChatWindowButton">Launch a Chat</button>
```

```
<script> // Function to open a new browser window with specified URL and dimensions
    function openNewWindow() {
        var url = 'https://mycompany.com/support?autoLaunchChat=true';

        // Define the width and height
        var width = 300;
        var height = 540;

        // Calculate the left and top position to center the window
        var left = (window.innerWidth - width) / 2;
        var top = (window.innerHeight - height) / 2;

        // Open the new window with the specified URL, dimensions, and position
        var newWindow = window.open(url, '', 'width=${width}, height=${height}, left=${left}, top=${top}');
    }

    // Attach a click event listener to the button
    document.getElementById('openChatWindowButton').addEventListener('click', openNewWindow);
</script>
```

## Abilitare la persistenza della sessione di chat tra le schede
<a name="chat-persistence-across-tabs"></a>

Per impostazione predefinita, se una chat è aperta in una scheda e poi l’utente apre una nuova scheda e avvia un’altra chat, viene eseguito l’avvio di una nuova chat anziché la connessione alla chat esistente. Puoi abilitare la persistenza della sessione di chat tra le schede se desideri che l’utente si connetta alla chat esistente avviata nella scheda iniziale. 

La sessione di chat viene archiviata nella memoria della sessione del browser nella variabile `persistedChatSession`. Devi copiare questo valore nella memoria della sessione della nuova scheda quando il widget viene inizializzato per la prima volta. Di seguito sono riportate le istruzioni.

Per connetterti alla stessa sessione di chat quando l’utente naviga in sottodomini diversi, puoi impostare la proprietà del dominio del cookie. Ad esempio, supponiamo che tu possieda due sottodomini: `domain1.example.com` e `domain2.example.com`. Puoi aggiungere la proprietà `domain=.example.com` per far sì che il cookie sia accessibile da tutti i sottodomini.

1. Copia il codice seguente accanto alle altre funzioni amazon\$1connect nel frammento del widget ospitato. Questo utilizza gli handler di eventi `registerCallback` per archiviare `persistedChatSession` come cookie in modo che sia possibile accedervi nella nuova scheda. Inoltre, effettua la pulizia del cookie al termine della chat.

   

   ```
   amazon_connect('registerCallback', {
   'CONNECTION_ESTABLISHED': (eventName, { chatDetails, data }) => {
    document.cookie = `activeChat=${sessionStorage.getItem("persistedChatSession")}; SameSite=None; Secure`;
   }, 
   'CHAT_ENDED': () => {
     document.cookie = "activeChat=; SameSite=None; Secure";
   }
   });
   ```

1. Recupera il valore del cookie, se esiste, e imposta il valore di archiviazione della sessione nella nuova scheda.

   ```
   const cookie = document.cookie.split('; ').find(c => c.startsWith('activeChat='));
   if (cookie) {
     const activeChatValue = cookie.split('=')[1];
     sessionStorage.setItem('persistedChatSession', activeChatValue);
   }
   
   //Your hosted widget snippet should be on this page
   ```

# Passare il nome visualizzato del cliente all’avvio di una chat Amazon Connect
<a name="pass-display-name-chat"></a>

Per offrire un'esperienza più personalizzata ai clienti e agli agenti, puoi personalizzare il widget di comunicazione di Amazon Connect in modo da trasferire il nome visualizzato del cliente durante l'inizializzazione del contatto. Il nome è visibile sia al cliente che all'agente durante l'interazione in chat. Questo nome visualizzato viene registrato nella trascrizione della chat.

Le immagini seguenti mostrano il nome visualizzato del cliente nella sua esperienza di chat e il suo nome nel CCP dell'agente.

![\[Il nome del cliente nell'esperienza di chat, il nome del cliente nel CCP dell'agente.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-displayname.png)


1. In che modo il nome visualizzato del cliente può apparire al cliente che utilizza l'interfaccia utente della chat.

1. In che modo il nome visualizzato del cliente può apparire all'agente che utilizza il CCP.

## Come trasferire il nome visualizzato di un cliente nel widget di comunicazione
<a name="setup-display-name"></a>

Per trasmettere il nome visualizzato di un cliente, implementa la funzione di callback nel frammento. Amazon Connect recupera automaticamente il nome visualizzato.

1. Se non lo hai già fatto, completa i passaggi descritti in [Aggiungere un’interfaccia utente di chat a un sito web ospitato da Amazon Connect](add-chat-to-website.md).

1. Aumenta il frammento di widget esistente per aggiungere un callback `customerDisplayName`. Potrebbe assomigliare al seguente esempio:

   ```
   amazon_connect('customerDisplayName', function(callback) {
     const displayName = 'Jane Doe';
     callback(displayName);
   });
   ```

   L'importante è che il nome venga trasmesso a `callback(name)`.

## Cosa occorre sapere sul nome visualizzato del cliente
<a name="setup-display-name-important-notes"></a>
+ Può esistere una sola funzione `customerDisplayName` alla volta.
+ Il nome visualizzato dal cliente deve rispettare le limitazioni stabilite dall'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html#connect-Type-ParticipantDetails-DisplayName)API. Vale a dire, il nome deve essere una stringa compresa tra 1 e 256 caratteri.
+ Una stringa vuota, nulla o indefinita è un dato inserito non valido per il nome visualizzato. Per evitare che questi input vengano trasmessi accidentalmente, il widget registra un errore, `Invalid customerDisplayName provided`, nella console del browser, quindi avvia la chat con il nome visualizzato predefinito, **Cliente**.
+ Poiché il frammento si trova nel front-end del sito web, non trasmettere dati sensibili, come il nome visualizzato. Assicurati di seguire le pratiche di sicurezza appropriate per proteggere i tuoi dati da attacchi e malintenzionati.

# Passare gli attributi di contatto a un agente nel Contact Control Panel (CCP) all’avvio di una chat
<a name="pass-contact-attributes-chat"></a>

Puoi utilizzare gli [attributi del contatto](what-is-a-contact-attribute.md) per acquisire informazioni sul contatto che utilizza il widget di comunicazione. Quindi, puoi mostrare tali informazioni all'agente tramite il Pannello di controllo contatti (CCP) o utilizzarle altrove nel flusso.

Ad esempio, puoi personalizzare il flusso in modo da pronunciare il nome del cliente nel messaggio di benvenuto. In alternativa, puoi utilizzare attributi specifici della tua attività account/member IDs, come identificatori dei clienti come nomi ed e-mail o altri metadati associati a un contatto.

## Come trasferire gli attributi del contatto nel widget di comunicazione
<a name="how-to-contact-attributes-chatwidget"></a>

1. Se non è già stato fatto, abilita la sicurezza nel widget di comunicazione come descritto in [Aggiungere un’interfaccia utente di chat a un sito web ospitato da Amazon Connect](add-chat-to-website.md):

   1. Al passaggio 2, in **Aggiungi le funzionalità di sicurezza per il tuo widget di chat**, scegli **Sì**.

   1. Al passaggio 3, utilizza la chiave di sicurezza per generare token web JSON.

1. Aggiungi gli attributi di contatto al payload del tuo JWT come richiesta `attributes`.

   Di seguito è riportato un esempio di come generare un JWT con attributi di contatto in Python:
**Nota**  
JWT deve essere installato come prerequisito. Per installarlo, esegui `pip install PyJWT` nel tuo terminale.

   ```
   import jwt 
   import datetime 
   CONNECT_SECRET = "your-securely-stored-jwt-secret" 
   WIDGET_ID = "widget-id" 
   JWT_EXP_DELTA_SECONDS = 500
   
   payload = { 
   'sub': WIDGET_ID, 
   'iat': datetime.datetime.utcnow(), 
   'exp': datetime.datetime.utcnow() + datetime.timedelta(seconds=JWT_EXP_DELTA_SECONDS), 
   'segmentAttributes': {"connect:Subtype": {"ValueString" : "connect:Guide"}}, 'attributes': {"name": "Jane", "memberID": "123456789", "email": "Jane@example.com", "isPremiumUser": "true", "age": "45"} } 
   header = { 'typ': "JWT", 'alg': 'HS256' } 
   encoded_token = jwt.encode((payload), CONNECT_SECRET, algorithm="HS256", headers=header) // CONNECT_SECRET is the security key provided by Amazon Connect
   ```

   Nel payload, devi creare una chiave stringa `attributes` (così com'è, tutta in minuscolo), con un oggetto come valore. Tale oggetto deve avere coppie string-to-string chiave-valore. Se in uno degli attributi viene trasmesso qualcosa di diverso da una stringa, la chat non verrà avviata. 

   Gli attributi di contatto devono seguire le limitazioni stabilite dall'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html#connect-StartChatContact-request-Attributes)API: 
   + Le chiavi devono avere una lunghezza minima pari a 1
   + I valori possono avere una lunghezza minima pari a 0

Facoltativamente, puoi aggiungere la stringa SegmentAttributes alla mappa degli [SegmentAttributeValue](https://docs.aws.amazon.com/connect/latest/APIReference/API_SegmentAttributeValue.html)oggetti, nel payload. Gli attributi sono attributi standard. Amazon Connect Puoi accedervi nei flussi. Gli attributi dei contatti devono rispettare le limitazioni impostate dall'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html#connect-StartChatContact-request-SegmentAttributes)API.

## Metodo alternativo: passare gli attributi di contatto direttamente dal codice del frammento
<a name="pass-attributes-directly"></a>

**Nota**  
Il codice del frammento antepone `HostedWidget-` a tutte le chiavi degli attributi di contatto che passa. Nell’esempio seguente, il lato agente vedrà la coppia chiave-valore `HostedWidget-foo: 'bar'`.
Sebbene questi attributi rientrino nell’ambito del prefisso `HostedWidget-`, sono comunque modificabili a seconda del sito client. Utilizza la configurazione JWT se hai bisogno di dati PII o immutabili nel tuo flusso. 

L’esempio seguente mostra come passare gli attributi di contatto direttamente dal codice del frammento senza abilitare la sicurezza del widget. 

```
<script type="text/javascript">
  (function(w, d, x, id){ /* ... */ })(window, document, 'amazon_connect', 'widgetId');
  amazon_connect('snippetId', 'snippetId');
  amazon_connect('styles', /* ... */);
  // ...

  amazon_connect('contactAttributes', {
   foo: 'bar'
  })
<script/>
```

### Utilizzo degli attributi nei flussi
<a name="contact-flow-usage-chat"></a>

Il blocco di flusso [Verifica attributi contatti](check-contact-attributes.md) fornisce l’accesso a questi attributi utilizzando il namespace **Definito dal cliente**, come mostrato nell’immagine seguente. Puoi utilizzare il blocco di flusso per aggiungere una logica di ramificazione. Il percorso completo è `$.Attributes.HostedWidget-attributeName`.

![\[Immagine che mostra un blocco di flusso che si ramifica in prompt validi e non validi.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/flow-check-contact-attrib.png)


## Cose da sapere
<a name="contact-attributes-chatwidget-important-notes"></a>
+ Il widget di comunicazione ha un limite di 6.144 byte per l'intero token codificato. Poiché JavaScript utilizza la codifica UTF-16, vengono utilizzati 2 byte per carattere, quindi la dimensione massima `encoded_token` deve essere di circa 3000 caratteri.
+ L'encoded\$1token deve essere trasmesso a `callback(data)`. Il frammento `authenticate` non necessita di ulteriori modifiche. Esempio:

  ```
  amazon_connect('authenticate', function(callback) {
    window.fetch('/token').then(res => {
      res.json().then(data => {
        callback(data.data);
      });
    });
  });
  ```
+ L'utilizzo di un JWT per il trasferimento degli attributi di contatto garantisce l'integrità dei dati. Se salvaguardi il segreto condiviso e segui le pratiche di sicurezza appropriate, puoi contribuire a garantire che i dati non possano essere manipolati da un malintenzionato.
+ Gli attributi di contatto sono codificati solo nel JWT, non crittografati, quindi è possibile decodificare e leggere gli attributi.
+ Se desideri testare l'esperienza di chat con l'[esperienza di chat simulata](chat-testing.md#test-chat) e includere gli attributi di contatto, assicurati di racchiudere sia la chiave sia il valore tra virgolette, come mostrato nell'immagine seguente.  
![\[La pagina Impostazioni del test, una chiave dell'attributo di contatto tra virgolette, un valore tra virgolette.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/test-chat-contact-attributes.png)

# Personalizzazioni aggiuntive per il widget di chat Amazon Connect
<a name="pass-customization-object"></a>

Puoi aggiungere le seguenti personalizzazioni opzionali all'interfaccia utente della chat:
+ Visualizza il pulsante **Termina chat** nel menu a discesa dell'intestazione anziché nel piè di pagina.
+ Maschera o nascondi i nomi visualizzati.
+ Aggiungi icone dei messaggi.
+ Sovrascrivi i messaggi di evento.
+ Configura una finestra di dialogo di conferma che i clienti vedranno quando scelgono il pulsante **Termina chat**. Questa finestra di dialogo verifica che i clienti intendano effettivamente terminare la sessione di chat. Puoi personalizzare la finestra di dialogo di conferma, il titolo, il messaggio e il testo del pulsante.
+ Sostituisci il messaggio di rifiuto dell’allegato.

## Configurazione dell'oggetto di personalizzazione
<a name="configure-customization-object"></a>

In questo esempio viene illustrato come implementare alcune personalizzazioni opzionali. Per un elenco di tutte le personalizzazioni possibili, consulta [Vincoli e opzioni supportate](#customization-options-constraints). Poiché queste personalizzazioni sono opzionali, puoi implementare alcuni o tutti i campi mostrati nell’esempio seguente. Sostituisci le stringhe `eventNames.customer`, `eventNames.agent`, `eventNames.supervisor`, `eventMessages.participantJoined`, `eventMessages.participantDisconnect`, `eventMessages.participantLeft`, `eventMessages.participantIdle`, `eventMessages.participantReturned` e `eventMessages.chatEnded` in base alle esigenze. Le icone devono essere ospitate su piattaforme pubbliche. URLs

```
amazon_connect('customizationObject', {
        header: { 
            dropdown: true, 
            dynamicHeader: true,
        },
        transcript: { 
            hideDisplayNames: false, 
            eventNames: {
                customer: "User",
                agent: "Webchat Agent",
                supervisor: "Webchat Supervisor"
            },
            eventMessages: {
                participantJoined: "{name} has joined the chat",
                participantDisconnect: "",
                participantLeft: "{name} has dropped",
                participantIdle: "{name}, are you still there?",
                participantReturned: "",
                chatEnded: "Chat ended",
            },
            displayIcons: true,
            iconSources: { 
                botMessage: "imageURL",
                systemMessage: "imageURL",
                agentMessage: "imageURL",
                customerMessage: "imageURL",
            },
        },
        composer: {
            disableEmojiPicker: true,
            disableCustomerAttachments: true,
            alwaysHideToolbar: true,
            hide: false,
        },
        footer: {
            disabled:true,
            skipCloseChatButton: true,
        },
        endChat: {
            enableConfirmationDialog: true,
            confirmationDialogText: {
                title: "End Chat",
                message: "Are you sure you want to end this chat?",
                confirmButtonText: "End Chat",
                cancelButtonText: "Cancel",
        },
    },
    attachment: {
         // Default rejectedErrorMessage: Attachment was rejected.
        rejectedErrorMessage: "Custom Error Message: Files cannot exceed 15 MB." //this is customizable attribute 
    }
});
```

Nell'immagine seguente viene mostrato l'aspetto delle personalizzazioni se si utilizza l'esempio:

![\[Diagramma che mostra gli elementi personalizzabili: nomi visualizzati, posizioni dei menu, icone e finestra di dialogo di conferma Termina chat.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chat-customization-diagram2.png)


## Vincoli e opzioni supportate
<a name="customization-options-constraints"></a>

Nella tabella seguente sono elencati i campi di personalizzazione supportati e i vincoli sui valori consigliati.


| Opzione di layout personalizzato | Tipo | Descrizione | 
| --- | --- | --- | 
|  `header.dropdown`  |  Booleano  |  Esegue il rendering del menu a discesa dell’intestazione anziché del piè di pagina predefinito.  Quando si imposta questa opzione su `true`, il pulsante **Download della trascrizione** viene visualizzato e rimane visibile finché non si imposta l'opzione su `false` o finché non si rimuove l'opzione.   | 
| `header.dynamicHeader` | Booleano | Imposta dinamicamente il titolo dell'intestazione su «Chatting with Bot/». AgentName | 
| `header.hideTranscriptDownloadButton` | Booleano | Nascondi il pulsante di [download della trascrizione](chat-widget-download-transcript.md) nel menu a discesa dell’intestazione. Il valore predefinito è false. | 
|  `transcript.hideDisplayNames`  |  Booleano  |  Nasconde tutti i nomi visualizzati, applica le maschere dei nomi predefinite se `eventNames` non viene fornito.  | 
|  `transcript.eventNames.customer`  |  Stringa  |  Maschera il nome visualizzato del cliente.  | 
|  `transcript.eventNames.agent`  |  Stringa  |  Maschera il nome visualizzato dell’agente.  | 
|  `transcript.eventNames.supervisor`  |  Stringa  |  Maschera il nome visualizzato del supervisore.  | 
|  ` transcript.eventMessages.participantJoined`  |  Stringa  |  Sostituisce il messaggio di evento nella trascrizione in merito al momento in cui un partecipante si è unito alla chat. Se viene specificata una stringa vuota, il messaggio di evento verrà omesso dalla trascrizione. L’elemento `{name}` può essere passato nel messaggio e verrà sostituito con il nome visualizzato del partecipante corrispondente. Il messaggio predefinito è `{name} has joined the chat`.   | 
|  `transcript.eventMessages.participantDisconnect`  |  Stringa  |  Sostituisce il messaggio di evento nella trascrizione in merito al momento in cui un partecipante si è disconnesso dalla chat. Se viene specificata una stringa vuota, il messaggio di evento verrà omesso dalla trascrizione. L’elemento `{name}` può essere passato nel messaggio e verrà sostituito con il nome visualizzato del partecipante corrispondente. Il messaggio predefinito è \$1`name} has been idle too long, disconnecting`.  | 
|  `transcript.eventMessages.participantLeft`  |  Stringa  |  Sostituisce il messaggio di evento nella trascrizione in merito al momento in cui un partecipante ha lasciato la chat. Se viene specificata una stringa vuota, il messaggio di evento verrà omesso dalla trascrizione. L’elemento `{name}` può essere passato nel messaggio e verrà sostituito con il nome visualizzato del partecipante corrispondente. Il messaggio predefinito è `{name} has left the chat`.  | 
|  `transcript.eventMessages.participantIdle`  |  Stringa  |  Sostituisce il messaggio di evento nella trascrizione in merito all’inattività di un partecipante. Se viene specificata una stringa vuota, il messaggio di evento verrà omesso dalla trascrizione. L’elemento `{name}` può essere passato nel messaggio e verrà sostituito con il nome visualizzato del partecipante corrispondente. Il messaggio predefinito è `{name} has become idle`.  | 
|  `transcript.eventMessages.participantReturned`  |  Stringa  |  Sostituisce il messaggio di evento nella trascrizione in merito al momento in cui un partecipante è rientrato nella chat. Se viene specificata una stringa vuota, il messaggio di evento verrà omesso dalla trascrizione. L’elemento `{name} `può essere passato nel messaggio e verrà sostituito con il nome visualizzato del partecipante corrispondente. Il messaggio predefinito è `{name} has returned`.  | 
|  `transcript.eventMessages.chatEnded`  |  Stringa  |  Sostituisce il messaggio di evento nella trascrizione in merito al momento in cui la chat è terminata. Se viene specificata una stringa vuota, il messaggio di evento verrà omesso dalla trascrizione. L’elemento `{name}` può essere passato nel messaggio e verrà sostituito con il nome visualizzato del partecipante corrispondente. Il messaggio predefinito è `Chat has ended!`  | 
|  `transcript.displayIcons`  |  Booleano  |  Abilita le icone di visualizzazione dei messaggi.  | 
|  `transcript.iconSources.botMessage`  |  Stringa  |  Icona visualizzata per messaggi bot, deve essere ospitata su un URL pubblico.  | 
|  `transcript.iconSources.systemMessage`  |  Stringa  |  Icona visualizzata per messaggi di sistema, deve essere ospitata su un URL pubblico.  | 
|  `transcript.iconSources.agentMessage`  |  Stringa  |  Icona visualizzata per messaggi agente, deve essere ospitata su un URL pubblico.  | 
|  `transcript.iconSources.customerMessage`  |  Stringa  |  Icona visualizzata per messaggi cliente, deve essere ospitata su un URL pubblico.  | 
|  `composer.alwaysHideToolbar`  |  Booleano  |  Nasconde la barra degli strumenti di formattazione che include funzionalità di applicazione dello stile al testo come grassetto, corsivo e opzioni per elenchi puntati e numerati.  | 
|  `composer.disableEmojiPicker`  |  Booleano  |  Disabilita il selettore di emoji durante l’utilizzo dell’[editor RTF](enable-text-formatting-chat.md).  | 
| `composer.disableCustomerAttachments` | Booleano | Impedisce ai clienti di inviare o caricare allegati. | 
| `composer.hide` | Booleano | Nasconde il compositore () o lo mostra (`true`). `false` Per cambiare il compositore in base agli eventi (ad esempio quando un agente si unisce), usalo con il metodo. `registerCallback` `hideComposer` Per ulteriori informazioni, consulta [Campi snippet del widget supportati in Amazon Connect che sono personalizzabili](supported-snippet-fields.md).<pre>document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatInterface.hideComposer(false)</pre> | 
|  `footer.disabled`  |  Booleano  |  Nasconde il piè di pagina predefinito con il pulsante **Termina chat**.  | 
|  `footer.skipCloseChatButton`  |  Booleano  |  Chiude direttamente il widget quando si fa clic sul pulsante **Termina chat** anziché mostrare il pulsante **Chiudi**.  | 
| `endChat.enableConfirmationDialog` | Booleano | Abilita la finestra di dialogo di conferma Termina chat. Se confirmationDialogText non viene fornito, vengono utilizzati i testi predefiniti. | 
| `endChat.confirmationDialogText.title` | Stringa | Sostituisce il titolo della finestra di dialogo di conferma Termina chat. | 
| `endChat.confirmationDialogText.message` | Stringa | Sostituisce il messaggio della finestra di dialogo di conferma Termina chat. | 
| `endChat.confirmationDialogText.confirmButtonText` | Stringa | Sostituisce il testo del pulsante di conferma nella finestra di dialogo di conferma Termina chat. | 
| `endChat.confirmationDialogText.cancelButtonText` | Stringa | Sostituisce il testo del pulsante di annullamento nella finestra di dialogo di conferma Termina chat. | 
| `attachment.rejectedErrorMessage` | Stringa | Sostituisce il messaggio di errore relativo al rifiuto degli allegati del widget di chat. | 

# Scaricare la trascrizione del widget di chat in Amazon Connect
<a name="chat-widget-download-transcript"></a>

Puoi scaricare un PDF della trascrizione nel widget di chat.

**Topics**
+ [Abilitare il menu a discesa dell’intestazione](#chat-widget-download-transcript-enable-header-dropdown)
+ [Scaricare il PDF delle trascrizioni delle chat](#chat-widget-download-transcript-pdf)

## Abilitare il menu a discesa dell’intestazione
<a name="chat-widget-download-transcript-enable-header-dropdown"></a>

Il pulsante per scaricare la trascrizione si trova all’interno di un menu a discesa nell’intestazione. Per abilitare il menu a discesa dell’intestazione, è necessario configurare [customizationObject](pass-customization-object.md) del widget di chat nello script del widget.

```
amazon_connect('customizationObject', {
        header: { 
            dropdown: true, 
        }
});
```

Tieni presente che l’abilitazione del menu a discesa disabilita automaticamente il piè di pagina poiché la funzionalità **Termina chat** viene spostata nel menu a discesa dell’intestazione. Se desideri mantenere il piè di pagina, puoi riabilitarlo utilizzando quanto segue:

```
amazon_connect('customizationObject', {
        header: { 
            dropdown: true, 
        },
        footer: {
            disabled: false,
        }
});
```

## Scaricare il PDF delle trascrizioni delle chat
<a name="chat-widget-download-transcript-pdf"></a>

Dopo aver abilitato il menu a discesa dell’intestazione, dovrebbe comparire un menu con tre punti in alto a sinistra del widget della chat. All’interno di quel menu a discesa, dovrebbe comparire un pulsante per scaricare la **trascrizione della chat**.

![\[Mostra il pulsante per scaricare la trascrizione della chat.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chat-widget-download-transcript-pdf-1.png)


Scegliendo di scaricare la **trascrizione della chat**, viene avviato il download del PDF. Il PDF della trascrizione della chat include tutti i messaggi, i nomi visualizzati, i timestamp e gli eventi di messaggio, come l’uscita o l’entrata dei partecipanti.

![\[Esempio di trascrizione della chat scaricata.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chat-widget-download-transcript-pdf-2.png)


# Personalizzare la chat con l’esempio open source di Amazon Connect
<a name="download-chat-example"></a>

Puoi personalizzare ulteriormente l'esperienza di chat utilizzata dai clienti per interagire con gli agenti. Usa la [libreria open source Amazon Connect](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/tree/master/cloudformationTemplates/asyncCustomerChatUX) su GitHub. Si tratta di una piattaforma che consente di iniziare rapidamente a utilizzare il prodotto. Come funziona:
+ Il GitHub repository si collega a un CloudFormation modello, che avvia l'endpoint Amazon API Gateway che avvia una funzione Lambda. Puoi usare questo modello come esempio.
+ Dopo aver creato lo AWS CloudFormation stack, puoi richiamare questa API dalla tua app, importare il widget di comunicazione predefinito, passare la risposta al widget e iniziare a chattare. 

Per ulteriori informazioni sulla personalizzazione dell'esperienza di chat, consulta: 
+ [Documentazione dell'API del servizio Amazon Connect](https://docs.aws.amazon.com/connect/latest/APIReference/welcome.html), in particolare l'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API. 
+  [API di servizio Amazon Connect per i partecipanti](https://docs.aws.amazon.com/connect-participant/latest/APIReference/Welcome.html). 
+  [Amazon Connect Streams](https://github.com/aws/amazon-connect-streams). Usala per integrare le app esistenti con Amazon Connect. Puoi incorporare i componenti del Pannello di controllo dei contatti (CCP) nell'app. 
+ [SDK per le chat Amazon Connect e implementazioni di esempio](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/) 

# Avvia chat nelle tue applicazioni utilizzando Amazon Connect APIs
<a name="integrate-with-startchatcontact-api"></a>

Usa l' StartChatContact API in Amazon Connect APIs per avviare chat nelle tue applicazioni.

Per avviare una chat, usa l'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API.

Quando esplori l'esperienza di chat per la prima volta, noterai che le chat non vengono conteggiate nella metrica **Contatti in entrata** nel report delle metriche storiche. Questo perché il metodo di avvio della chat nel record di contatto è **API**. 

L'immagine seguente di un record di contatto mostra il *metodo di avvio* impostato su *API*. 

![\[Un record di contatto, il metodo di avvio impostato su API.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/ctr-api.png)


Quando una chat viene trasferita a un agente, il parametro **Contacts Incoming (Contatti in entrata)** viene incrementato. Il record di contatto per il trasferimento non incrementa più l'API, ma incrementa **Contatti in entrata**. 

# Inviare notifiche via browser ai clienti quando arrivano messaggi di chat
<a name="browser-notifications-chat"></a>

Il widget di comunicazione supporta le notifiche del browser per i clienti tramite i loro dispositivi desktop. In particolare, i clienti riceveranno una notifica tramite il loro browser web quando ricevono un nuovo messaggio, ma non sono attivi sulla pagina web che contiene la finestra di chat. Quando i clienti toccano o fanno clic su questa notifica, vengono reindirizzati automaticamente alla pagina web contenente la finestra di chat. I clienti possono attivare o disattivare le notifiche all'inizio di ogni conversazione chat. 

L'immagine seguente mostra un esempio del banner di notifica che i clienti ricevono quando non si trovano nella pagina web che contiene la finestra di chat. Il banner informa i clienti della ricezione di un nuovo messaggio e mostra il nome del sito web. 

![\[Un banner di Google Chrome che indica la ricezione di un nuovo messaggio.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-notification-banner.png)


I clienti ricevono anche un'icona di notifica, un punto rosso, sul widget di comunicazione quando è ridotta a icona. L'immagine seguente mostra un'immagine dell'icona di notifica che i clienti ricevono quando la finestra di chat è ridotta a icona.

![\[Un'icona di notifica.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-browser-notification.png)


Entrambe queste funzionalità vengono incluse automaticamente nel widget di comunicazione. Non è necessario eseguire alcuna procedura per renderle disponibili ai clienti.

I tuoi clienti ricevono una allow/deny notifica pop-up quando avviano una chat e non hanno ancora consentito le notifiche dal tuo sito web o dal tuo dominio. Dopo aver concesso le autorizzazioni di notifica, iniziano a ricevere notifiche dal browser per qualsiasi messaggio o allegato inviato dall'agente quando la pagina web con la finestra di chat non è attiva. Questo comportamento si applica anche se il widget di comunicazione è già stato implementato.

## Come eseguire il test
<a name="test-browser-notifications-chat"></a>

1. Dopo aver consentito le notifiche come cliente test e quando l'agente è connesso alla chat, riduci a icona la finestra di chat e quindi apri una nuova istanza del browser in modo che la pagina web che contiene la finestra di chat non sia attiva.

1. Invia un messaggio dalla finestra dell'agente.

1. Come cliente test, visualizzerai il banner di notifica.

1. Scegli o tocca il banner di notifica. Verrai automaticamente indirizzato alla pagina web che contiene la finestra di chat.

1. Poiché in precedenza la finestra di chat è stata ridotta a icona, verrà visualizzata anche un'icona di notifica, un punto rosso, sul widget di comunicazione.

Se non riesci a visualizzare la notifica del browser, verifica quanto segue: 
+ Stai utilizzando un [browser supportato](add-chat-to-website.md#chat-widget-supported-browsers).
+ L'autorizzazione alla notifica si trova allowed/enabled nel browser per la pagina Web con finestra di chat.
+ L'agente (o tu dalla sessione di chat dell'agente) ne hai inviato una nuova message/attachment mentre sei su una pagina web diversa da quella che contiene la finestra di chat. Per rendere visibile l'icona di notifica, un puntino rosso, sul widget, riduci a icona la finestra di chat.
+ Le notifiche dal browser non vengono posticipate (temporaneamente ignorate).

# Disconnettere a livello di programmazione la sessione di chat di un widget di comunicazione Amazon Connect
<a name="programmatic-chat-disconnect"></a>

È possibile disconnettere la sessione di chat di un widget di comunicazione a livello di codice utilizzando 'JavaScript chiamando il `disconnect` metodo memorizzato nel widget. `iframe` Dal documento host del widget, puoi fare riferimento alla funzione `disconnect` utilizzando il seguente frammento di codice: 

```
document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatSession.disconnect()
```

Puoi aggiungerlo facilmente allo script del widget esistente. Di seguito viene riportato un esempio di frammento di codice:

```
<script type="text/javascript">
  (function(w, d, x, id){
    s=d.createElement('script');
    s.src='https://your-instance-alias.my.connect.aws/connectwidget/static/amazon-connect-chat-interface-client.js';
    s.async=1;
    s.id=id;
    d.getElementsByTagName('head')[0].appendChild(s);
    w[x] =  w[x] || function() { (w[x].ac = w[x].ac || []).push(arguments) };
  })(window, document, 'amazon_connect', '...');
  amazon_connect('styles', { iconType: 'CHAT', openChat: { color: '#ffffff', backgroundColor: '#123456' }, closeChat: { color: '#ffffff', backgroundColor: '#123456'} });
  amazon_connect('snippetId', '...');
  amazon_connect('supportedMessagingContentTypes', [ 'text/plain', 'text/markdown', 'application/vnd.amazonaws.connect.message.interactive', 'application/vnd.amazonaws.connect.message.interactive.response' ]);
 
  // Add disconnect event listener
  window.addEventListener("pagehide", () => {
      document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatSession.disconnect();
  });
</script>
```

## Casi d’uso e di implementazione
<a name="implementation-chat-disconnect"></a>

La chiamata del metodo disconnect a livello di programmazione può essere utile in più casi. Fornisce un maggiore controllo sul momento in cui terminare la conversazione oltre a fare clic manualmente sul pulsante `End Chat`. Di seguito sono elencati alcuni casi d’uso comuni per la chiamata di `disconnect`.

### Chiusura o navigazione
<a name="close-chat-disconnect"></a>

Un caso d’uso comune può essere quello che prevede di collegare la funzionalità di disconnessione a eventi che si attivano quando il contesto del browser o della scheda viene eliminato. `pagehide` e `beforeunload` sono gli eventi comuni che vengono attivati quando si arresta il browser. Questi eventi vengono attivati quando un utente passa a un URL diverso oppure quando aggiorna o chiude la scheda o il browser. Sebbene entrambi gli eventi vengano attivati quando il contesto del browser viene eliminato, non vi è alcuna garanzia che la funzione `disconnect` possa essere eseguita completamente prima che avvenga la pulizia delle risorse del browser.

`pagehide` è un evento del ciclo di vita delle pagine più moderno ed è supportato da tutti i principali browser e sistemi operativi. `beforeunload` è un evento alternativo da provare se l’evento `pagehide` non riesce a chiamare il metodo disconnect in modo coerente. `beforeunload` viene attivato prima di `pagehide`, il che può garantire ulteriore affidabilità se la funzione `disconnect` non viene completata prima della chiusura del browser. Si sono verificati problemi di affidabilità con `beforeunload`, soprattutto sui dispositivi iOS.

Di seguito viene riportato un esempio di frammento di codice:

```
// Call disconnect when `beforeunload` triggers
window.addEventListener("beforeunload", (event) => {
    document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatSession.disconnect();
});

// Call disconnect when `pagehide` triggers
window.addEventListener("pagehide", (event) => {
    document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatSession.disconnect();
});
```

### Cambio di contesto
<a name="context-chat-disconnect"></a>

Un altro caso d'uso potrebbe essere quello di attivare una disconnessione quando l'utente cambia contesto, ad esempio quando cambia o minimizza o blocca lo schermo. tab/app L’evento `visibilitychange` può gestire in modo affidabile questi scenari in cui il contesto non è più visibile.

Di seguito viene riportato un esempio di frammento di codice:

```
window.addEventListener("visibilitychange", () => {
    if (document.visibilityState === "hidden") {
        document.getElementById("amazon-connect-chat-widget-iframe").contentWindow.connect.ChatSession.disconnect();
    } else if (document.visibilityState === "visible") {
        ...
    }
});
```

# Trasferire proprietà personalizzate per la sovrascrittura delle impostazioni predefinite nel widget di comunicazione in Amazon Connect
<a name="pass-custom-styles"></a>

Per personalizzare ulteriormente l’interfaccia utente della chat, puoi sovrascrivere le proprietà predefinite passando i tuoi valori. Ad esempio, puoi impostare la larghezza del widget su 400 pixel e l'altezza su 700 pixel (a differenza della dimensione predefinita di 300 pixel per 540 pixel). Puoi anche usare i colori e le dimensioni dei caratteri che preferisci.

## Come trasferire stili personalizzati per il widget di comunicazione
<a name="chat-widget-pass-custom-styles"></a>

Per passare stili personalizzati, usa il seguente blocco di codice di esempio e incorporalo nel tuo widget. Amazon Connect recupera automaticamente gli stili personalizzati. Tutti i campi mostrati nell'esempio seguente sono facoltativi.

```
amazon_connect('customStyles', {
 global: {
     frameWidth: '400px',
     frameHeight: '700px',
     textColor: '#fe3251',
     fontSize: '20px',
     footerHeight: '120px',
     typeface: "'AmazonEmber-Light', serif",
     customTypefaceStylesheetUrl: "https://ds6yc8t7pnx74.cloudfront.net/etc.clientlibs/developer-portal/clientlibs/main/css/resources/fonts/AmazonEmber_Lt.ttf",
     headerHeight: '120px',
 },
 header: {
     headerTextColor: '#541218',
     headerBackgroundColor: '#fe3',
 },
 transcript: {
     messageFontSize: '13px',
     messageTextColor: '#fe3',
     widgetBackgroundColor: '#964950',
     agentMessageTextColor: '#ef18d3',
     systemMessageTextColor: '#ef18d3',
     customerMessageTextColor: '#ef18d3',
     agentChatBubbleColor: '#111112',
     systemChatBubbleColor: '#111112',
     customerChatBubbleColor: '#0e80f2',
 },
 footer: {
     buttonFontSize: '20px',
     buttonTextColor: '#ef18d3',
     buttonBorderColor: '#964950',
     buttonBackgroundColor: '#964950',
     footerBackgroundColor: '#0e80f2',
     startCallButtonTextColor: '#541218',
     startChatButtonBorderColor: '#fe3',
     startCallButtonBackgroundColor: '#fe3',
 },
 logo: {
     logoMaxHeight: '61px',   
     logoMaxWidth: '99%',
 },
  composer: {
     fontSize: '20px', 
 },
  fullscreenMode: true // Enables fullscreen mode on the widget when a mobile screen size is detected in a web browser.
})
```

## Stili e vincoli supportati
<a name="chat-widget-supported-styles"></a>

La tabella seguente elenca i nomi degli stili personalizzati supportati e i vincoli sui valori consigliati. Alcuni stili esistono sia a livello globale sia a livello di componente. Ad esempio, lo stile `fontSize` esiste a livello globale e nel componente di trascrizione. Gli stili a livello di componente hanno una priorità più alta e verranno rispettati nel widget di chat.


|  Nome dello stile personalizzato  |  Description  |  Vincoli consigliati  | 
| --- | --- | --- | 
|  `global.frameWidth`  |  Larghezza dell'intero frame del widget  |  Minimo: 300 pixel Massimo: larghezza della finestra Si consiglia di regolare tale valore in base alle dimensioni della finestra  | 
|  `global.frameHeight`  |  Altezza dell'intero frame del widget  |  Minimo: 480 pixel Massimo: altezza della finestra Si consiglia di regolare tale valore in base alle dimensioni della finestra  | 
|  `global.textColor`  |  Colore per tutti i testi  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `global.fontSize`  |  Dimensione del carattere per tutti i testi  |  Consigliata da 12 a 20 pixel per diversi casi d'uso  | 
|  `global.footerHeight`  |  Altezza del piè di pagina del widget  |  Minimo: 50 pixel Massimo: altezza del frame Si consiglia di regolarla in base alla dimensione del frame  | 
|  `global.typeface`  |  Il carattere utilizzato nel widget.  |  Qualsiasi carattere di questo elenco: Arial, Times New Roman, Times, Courier New, Courier, Verdana, Georgia, Palatino, Garamond, Book man, Tacoma, Trebuches MS, Arial Black, Impact, Comic Sans MS. Puoi anche aggiungere un carattere o una famiglia di caratteri personalizzati, ma devi ospitare il file dei caratteri con accesso pubblico in lettura. Ad esempio, puoi visualizzare la documentazione per utilizzare la famiglia di caratteri Amazon Ember nella [libreria per sviluppatori Amazon](https://developer.amazon.com/en-US/alexa/branding/echo-guidelines/identity-guidelines/typography).   | 
|  `global.customTypefaceStylesheetUrl`  |  Posizione in cui è ospitato il file dei caratteri personalizzati con accesso pubblico in lettura.  |  Link alla posizione HTTP pubblica in cui è ospitato il file dei caratteri. Ad esempio, la posizione CDN di AmazonEmber Light typeface è `https://ds6yc8t7pnx74.cloudfront.net/etc.clientlibs/developer-portal/clientlibs/main/css/resources/fonts/AmazonEmber_Lt.ttf`  | 
|  `header.headerTextColor`  |  Colore del testo per il messaggio di intestazione  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `header.headerBackgroundColor`  |  Colore del testo per lo sfondo dell’intestazione  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `global.headerHeight`  |  Altezza dell’intestazione del widget  |  È consigliabile regolare questo valore in base all’utilizzo del titolo o del logo dell’immagine oppure di entrambi.  | 
|  `transcript.messageFontSize`  |  Dimensione del carattere per tutti i testi  |  Consigliata da 12 a 20 pixel per diversi casi d'uso  | 
|  `transcript.messageTextColor`  |  Colore del testo per i messaggi di trascrizione  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `transcript.widgetBackgroundColor`  |  Colore del testo per lo sfondo della trascrizione  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `transcript.customerMessageTextColor`  |  Colore del testo per i messaggi del cliente  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `transcript.agentMessageTextColor`  |  Colore del testo per i messaggi dell’agente  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `transcript.systemMessageTextColor`  |  Colore del testo per i messaggi di sistema  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `transcript.agentChatBubbleColor`  |  Colore di sfondo per i fumetti dei messaggi dell’agente  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `transcript.customerChatBubbleColor`  |  Colore di sfondo per i fumetti dei messaggi del cliente  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `transcript.systemChatBubbleColor`  |  Colore di sfondo per i fumetti dei messaggi di sistema  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `footer.buttonFontSize`  |  Dimensione del carattere per il testo del pulsante di azione  |  Si consiglia di regolarla in base all'altezza del piè di pagina  | 
|  `footer.buttonTextColor`  |  Colore per il testo del pulsante di azione  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `footer.buttonBorderColor`  |  Colore per il bordo del pulsante di azione  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `footer.buttonBackgroundColor`  |  Colore per lo sfondo del pulsante di azione  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `footer.BackgroundColor`  |  Colore per lo sfondo del piè di pagina  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `footer.startCallButtonTextColor`  |  Colore per il testo del pulsante di avvio chiamata  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `footer.startCallButtonBorderColor`  |  Colore per il bordo del pulsante di avvio chiamata  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `footer.startCallButtonBackgroundColor`  |  Colore per lo sfondo del pulsante di avvio chiamata  |  Qualsiasi valore di colore legale in CSS. Per ulteriori informazioni, consulta l'articolo relativo ai [valori di colore legale in CSS](https://www.w3schools.com/cssref/css_colors_legal.php).  | 
|  `logo.logoMaxHeight`  |  Altezza massima del logo  |  Minimo: 0 pixel Massimo: altezza dell’intestazione È consigliabile regolare questo valore in base alle dimensioni dell’immagine e all’altezza del frame  | 
|  `logo.logoMaxWidth`  |  Larghezza massima del logo  |  Minimo: 0 pixel Massimo: larghezza dell’intestazione È consigliabile regolare questo valore in base alle dimensioni dell’immagine e alla larghezza del frame  | 
|  `composer.fontSize`  |  Dimensioni del carattere per il testo dello strumento di composizione  |  Consigliata da 12 a 20 pixel per diversi casi d'uso  | 
|  `fullscreenMode`  |  Abilita la modalità a schermo intero nel widget quando vengono rilevate le dimensioni dello schermo di un dispositivo mobile in un browser web.  |  tipo: boolean  | 

Di seguito sono riportati gli elementi che costituiscono il widget di comunicazione.

![\[Elementi che costituiscono il widget di comunicazione.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-elements.png)


## Come passare i logo e i nomi visualizzati System e Bot di override per il widget di comunicazione
<a name="pass-override-system"></a>

Per sostituire le configurazioni del nome System/Bot visualizzato e del logo impostate nel sito Web di Amazon Connect amministrazione, incorpora il seguente blocco di codice nel frammento di codice del widget. Tutti i campi mostrati nell'esempio seguente sono facoltativi.

```
amazon_connect('customDisplayNames', {
 header: {
     headerMessage: "Welcome!",
     logoUrl: "https://example.com/abc.png",
     logoAltText: "Amazon Logo Banner"
 },
 transcript: {
     systemMessageDisplayName: "Amazon System",
     botMessageDisplayName: "Alexa"
 },
 footer: {
     textInputPlaceholder: "Type Here!",     
      endChatButtonText: "End Session",      
      closeChatButtonText: "Close Chat",      
      startCallButtonText: "Start Call"
 },
})
```

### Proprietà supportate e vincoli
<a name="supported-properties-displaynames"></a>


| Nome dello stile personalizzato | Description | Vincoli consigliati | 
| --- | --- | --- | 
|  `header.headerMessage`  | Testo per il messaggio di intestazione | Lunghezza minima: 1 carattere Lunghezza massima: 11 caratteri  È consigliabile regolare questo valore in base alla larghezza dell’intestazione | 
|  `header.logoUrl`  | URL che punta all’immagine del logo |  Lunghezza massima: 2048 caratteri Deve essere un URL valido che punti a un file .png, .jpg o .svg. | 
|  `header.logoAltText`  | Testo per sostituire l’attributo alt per il banner del logo |  Lunghezza massima: 2048 caratteri | 
|  `transcript.systemMessageDisplayName`  | Testo per sostituire il nome visualizzato SYSTEM\$1MESSAGE | Lunghezza minima: 1 carattere Lunghezza massima: 26 caratteri  | 
|  `transcript.botMessageDisplayName`  | Testo per sostituire il nome visualizzato BOT | Lunghezza minima: 1 carattere Lunghezza massima: 26 caratteri  | 
|  `footer.textInputPlaceholder`  | Testo per sostituire il segnaposto nell’input di testo | Lunghezza minima: 1 carattere Lunghezza massima: 256 caratteri  | 
|  `footer.endChatButtonText`  | Testo per sostituire il testo del pulsante di fine chat | Lunghezza minima: 1 carattere Lunghezza massima: 256 caratteri È consigliabile regolare questo valore in base alla larghezza del pulsante  | 
|  `footer.closeChatButtonText`  | Testo per sostituire il testo del pulsante di chiusura della chat | Lunghezza minima: 1 carattere Lunghezza massima: 256 caratteri È consigliabile regolare questo valore in base alla larghezza del pulsante  | 
|  `footer.startCallButtonText`  | Testo per sostituire il testo del pulsante di avvio chiamata | Lunghezza minima: 1 carattere Lunghezza massima: 256 caratteri È consigliabile regolare questo valore in base alla larghezza del pulsante  | 

## Visualizzare l’anteprima del widget di comunicazione con proprietà personalizzate
<a name="chat-widget-preview"></a>

Assicurati di visualizzare l’anteprima del widget di comunicazione con le proprietà personalizzate prima di inserirlo in produzione. I valori personalizzati possono interrompere l'interfaccia utente del widget di comunicazione se non sono impostati correttamente. Si consiglia di testarlo su diversi browser e dispositivi prima di rilasciarlo ai tuoi clienti.

Di seguito sono riportati alcuni esempi di problemi che potrebbero verificarsi quando vengono utilizzati valori non corretti e le soluzioni suggerite.
+ **Problema:** la finestra del widget occupa troppo spazio sullo schermo.

  **Correzione:** usa un `frameWidth` e un `frameHeight` di dimensioni più piccole.
+ **Problema:** la dimensione del carattere è troppo piccola o troppo grande.

  **Correzione:** regola la dimensione del carattere.
+ **Problema:** è presente un'area vuota sotto la fine della chat (piè di pagina).

  **Correzione:** usa un `frameHeight` o un `footerHeight` di dimensioni più piccole.
+ **Problema:** il pulsante Termina chat è troppo piccolo o troppo grande.

  **Correzione:** regola `buttonFontSize`.
+ **Problema:** il pulsante Termina chat esce dall'area a piè di pagina.

  **Correzione:** usane un `footerHeight` di dimensioni più grandi o un `buttonFontSize` di dimensioni più piccole.

# Indirizza il pulsante e il frame del widget Amazon Connect con CSS/ JavaScript
<a name="target-widget-button"></a>

Il widget di comunicazione visualizza il pulsante del open/close widget e il frame del widget direttamente sul sito Web ospitante. Esistono selettori specifici che potete utilizzare per indirizzare questi elementi utilizzando i CSS o per farvi riferimento. JavaScript 

**Suggerimento**  
Per aggiornare i colori del pulsante del widget o gli stili del widget stesso, utilizza il [sito web di amministrazione di Amazon Connect](add-chat-to-website.md#customize-chat-widget). Per stili più personalizzabili, puoi [passare degli stili personalizzati](pass-custom-styles.md) direttamente al widget di comunicazione.

## Elemento IDs ed esempi del widget
<a name="widget-elementid"></a>

Le immagini seguenti mostrano come viene visualizzato il pulsante del widget di chat sullo schermo dell’utente. La prima immagine mostra il pulsante Apri per aprire il widget della chat. La seconda immagine mostra il pulsante Chiudi per chiudere il widget della chat.

![\[Side-by-side immagini del widget di chat per aprire e chiudere la finestra di chat.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/widget-elements.png)


1.  Pulsante di apertura del widget: `#amazon-connect-open-widget-button` 

1. Pulsante di chiusura del widget: `#amazon-connect-close-widget-button`

1. Frame del widget: `#amazon-connect-widget-frame`

   1. Frame quando il widget è aperto: `#amazon-connect-widget-frame.show`

   1. Frame quando il widget è chiuso: `#amazon-connect-widget-frame:not(.show)`

Di seguito è riportato un esempio di foglio di stile CSS che modifica questi elementi:

```
/* Target widget button while widget is minimized */
#amazon-connect-open-widget-button {
  ...
}

/* Target widget button while widget is showing */
#amazon-connect-close-widget-button {
  ...
}

/* Target widget frame */
#amazon-connect-widget-frame {
  ...
}

/* Target widget frame while it is showing */
#amazon-connect-widget-frame.show {
  ...
}

/* Target widget frame while it is minimized */
#amazon-connect-widget-frame:not(.show) {
  ...
}
```

Di seguito è riportato un esempio di riferimento a questi elementi utilizzando JavaScript:

```
const openWidgetButton = document.getElementById("amazon-connect-open-widget-button");
const closeWidgetButton = document.getElementById("amazon-connect-close-widget-button");

const widgetFrame = document.querySelector("#amazon-connect-widget-frame");
const openWidgetFrame = document.querySelector("#amazon-connect-widget-frame.show");
const hiddenWidgetFrame = document.querySelector("#amazon-connect-widget-frame:not(.show)");
```

# Risolvere i problemi relativi al widget di comunicazione Amazon Connect
<a name="ts-cw"></a>

Questo argomento è destinato agli sviluppatori che devono esaminare i problemi che possono verificarsi durante la configurazione di un widget di comunicazione nel sito Web di Amazon Connect amministrazione. 

**Topics**
+ [“Qualcosa non ha funzionato”](#sww)
+ [Clienti che non ricevono messaggi dagli agenti: in rete o disconnessi WebSocket](#mam)
+ [Bypassare CORS all’apertura di link di terze parti](#bcwotpl)

## “Qualcosa non ha funzionato”
<a name="sww"></a>

Se visualizzi il seguente messaggio di errore **Qualcosa non ha funzionato** durante il caricamento del widget di comunicazione, apri gli strumenti del browser per visualizzare i log degli errori. 

![\[Il messaggio di errore "Qualcosa non ha funzionato".\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-error-message.png)


Di seguito sono riportati i problemi comuni che causano questo errore.

### 400 - Richiesta non valida
<a name="400-invalid-request"></a>

Se i log menzionano un codice di stato "400 - Richiesta non valida", esistono alcune possibili cause:
+ Il widget di comunicazione non viene fornito su un dominio consentito. Devi indicare in modo specifico i domini in cui ospiterai il widget.
+ La richiesta all'endpoint non è formattata correttamente. Questo di solito si verifica solo se il contenuto del frammento di incorporamento è stato modificato.

### 401 - Autorizzazione negata
<a name="401-unauthorized"></a>

![\[Il messaggio di errore “Qualcosa non ha funzionato”.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/something-went-wrong.png)


Se i log menzionano un codice di stato "401 - Autorizzazione negata", si tratta di un problema relativo all'autenticazione del token web JSON (JWT). Visualizza la pagina di errore riportata sopra.

Dopo aver installato il JWT, è necessario implementarlo nella funzione di callback `authenticate`. L'esempio seguente mostra come implementarlo se stai cercando di recuperare il tuo token e poi usarlo: 

```
amazon_connect('authenticate', function(callback) {
  window.fetch('/token').then(res => {
    res.json().then(data => {
      callback(data.data);
    });
  });
});
```

Ecco una versione più semplice di ciò che deve essere implementato:

```
amazon_connect('authenticate', function(callback) {
   callback(token);
});
```

Per istruzioni sull'implementazione del JWT, consulta [Passaggio 3: confermare e copiare il codice del widget di comunicazione e le chiavi di sicurezza](add-chat-to-website.md#confirm-and-copy-chat-widget-script).

Se hai già implementato il callback, i seguenti scenari potrebbero comunque causare un codice di stato 401:
+ Firma non valida
+ Token scaduto

### 404 - Non trovato
<a name="404-not-found"></a>

Solitamente viene generato un codice di stato 404 quando la risorsa richiesta non esiste:
+ Nella richiesta API è specificato un widgetId non valido
+ Il widgetId è valido ma il flusso associato è stato eliminato o archiviato
+ Il widget non è stato pubblicato o è stato eliminato

Verifica che lo snippet corrisponda esattamente a come è stato copiato dal sito web di Amazon Connect amministrazione e che nessuno degli identificatori sia cambiato.

Se gli identificatori non sono cambiati e visualizzi un codice di stato 404, contatta AWS . 

### 500 - Errore interno del server
<a name="500-internalservererror-chatwidget"></a>

Ciò può essere causato dal fatto che il ruolo collegato al servizio non dispone delle autorizzazioni necessarie per avviare la chat. Questo accade se la tua istanza Amazon Connect è stata creata prima di ottobre 2018 perché non hai configurato ruoli collegati ai servizi.

**Soluzione**: aggiungi la policy `connect:*` sul ruolo associato alla tua istanza Amazon Connect. Per ulteriori informazioni, consulta [Utilizzo dei ruoli collegati ai servizi e alle autorizzazioni dei ruoli di Amazon Connect](connect-slr.md).

Se il ruolo collegato al servizio dispone delle autorizzazioni corrette, contatta AWS .

## Clienti che non ricevono messaggi dagli agenti: in rete o disconnessi WebSocket
<a name="mam"></a>

Durante una sessione di chat, un cliente che utilizza un'applicazione di chat perde la network/WebSocket connessione. La connessione viene ripristinata rapidamente, ma i messaggi inviati dall’agente in quel lasso di tempo non vengono visualizzati nell’interfaccia di chat del cliente. 

L'immagine seguente mostra un esempio dell'interfaccia di chat del cliente e del pannello di controllo dei contatti dell'agente side-by-side. Un messaggio inviato dall’agente non viene visualizzato nella sessione di chat del cliente. Tuttavia, all’agente sembra che il cliente lo abbia ricevuto.

![\[Un messaggio nel CCP che non viene inviato al contatto.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/tw-cw-001-message-not-sent.png)


Se l'applicazione di chat del cliente perde la network/WebSocket connessione, l'interfaccia utente della chat deve eseguire le seguenti operazioni per recuperare i messaggi futuri e i messaggi che le sono stati inviati mentre era disconnessa: 
+ Ristabilisci la WebSocket connessione per ricevere nuovamente i futuri messaggi in arrivo.
+ Effettua una richiesta [chatSession.getTranscript](https://github.com/amazon-connect/amazon-connect-chatjs?tab=readme-ov-file#chatsessiongettranscript) (API [getTranscripts](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_GetTranscript.html)) per recuperare tutti i messaggi mancanti che sono stati inviati mentre il cliente era disconnesso.

Se l’agente invia un messaggio mentre l’interfaccia utente di chat del cliente è disconnessa, il messaggio viene archiviato correttamente nel backend di Amazon Connect: il CCP funziona come previsto e viene registrata la trascrizione di tutti i messaggi, ma il dispositivo del cliente non è in grado di ricevere messaggi. Quando il client si riconnette a WebSocket, c'è una lacuna nei messaggi. I messaggi in arrivo futuri verranno nuovamente visualizzati da WebSocket, ma i messaggi gap sono ancora mancanti a meno che il codice non effettui una chiamata esplicita all'API. [GetTranscript](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_GetTranscript.html)

### Soluzione
<a name="solution-network-disconnected"></a>

[Usa la ChatSession. onConnectionEstablished](https://github.com/amazon-connect/amazon-connect-chatjs?tab=readme-ov-file#chatsessiononconnectionestablished)gestore di eventi per chiamare l'[GetTranscript](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_GetTranscript.html)API. Il gestore di `chatSession.onConnectionEstablished` eventi viene attivato quando si riconnette. WebSocket ChatJS ha un battito cardiaco integrato e una logica di ripetizione per la connessione. WebSocket Tuttavia, poiché ChatJS non memorizza la trascrizione, devi aggiungere codice personalizzato all’interfaccia utente di chat per recuperare di nuovo manualmente la trascrizione.

Il seguente esempio di codice mostra come implementare `onConnectionEstablished` per chiamare `GetTranscript`.

```
import "amazon-connect-chatjs";

const chatSession = connect.ChatSession.create({
  chatDetails: {
    ContactId: "the ID of the contact",
    ParticipantId: "the ID of the chat participant",
    ParticipantToken: "the participant token",
  },
  type: "CUSTOMER",
  options: { region: "us-west-2" },
});

// Triggered when the websocket reconnects
chatSession.onConnectionEstablished(() => {
  chatSession.getTranscript({
    scanDirection: "BACKWARD",
    sortOrder: "ASCENDING",
    maxResults: 15,
    // nextToken?: nextToken - OPTIONAL, for pagination
  })
    .then((response) => {
      const { initialContactId, nextToken, transcript } = response.data;
      // ...
    })
    .catch(() => {})
});
```

```
function loadLatestTranscript(args) {
    // Documentation: https://github.com/amazon-connect/amazon-connect-chatjs?tab=readme-ov-file#chatsessiongettranscript
    return chatSession.getTranscript({
        scanDirection: "BACKWARD",
        sortOrder: "ASCENDING",
        maxResults: 15,
        // nextToken?: nextToken - OPTIONAL, for pagination
      })
      .then((response) => {
        const { initialContactId, nextToken, transcript } = response.data;
        
        const exampleMessageObj = transcript[0];
        const {
          DisplayName,
          ParticipantId,
          ParticipantRole, // CUSTOMER, AGENT, SUPERVISOR, SYSTEM
          Content,
          ContentType,
          Id,
          Type,
          AbsoluteTime, // sentTime = new Date(item.AbsoluteTime).getTime() / 1000
          MessageMetadata, // { Receipts: [{ RecipientParticipantId: "asdf" }] }
          Attachments,
          RelatedContactid,
        } = exampleMessageObj;

        return transcript // TODO - store the new transcript somewhere
      })
      .catch((err) => {
        console.log("CustomerUI", "ChatSession", "transcript fetch error: ", err);
      });
}
```

Per un altro esempio, vedi questa implementazione [open source](https://github.com/amazon-connect/amazon-connect-chat-interface/blob/c88f854073fe6dd45546585c3bfa363d3659d73f/src/components/Chat/ChatSession.js#L408) su. GitHub 

## Bypassare CORS all’apertura di link di terze parti
<a name="bcwotpl"></a>

Per migliorare la sicurezza, il widget di comunicazione funziona all’interno di un ambiente sandbox. Di conseguenza, i link di terze parti condivisi nel widget non possono essere aperti.

**Soluzione**

Esistono due opzioni per bypassare CORS e consentire l’apertura dei link di terze parti.
+ **(Consigliato)**

  Aggiorna l’attributo sandbox per consentire l’apertura dei link in una nuova scheda; questa operazione può essere eseguita aggiungendo il seguente attributo al frammento di codice:

  ```
  amazon_connect('updateSandboxAttributes', 'allow-scripts allow-same-origin allow-popups allow-downloads allow-top-navigation-by-user-activation allow-popups-to-escape-sandbox')
  ```
**Nota**  
Il valore dell’attributo può essere aggiornato secondo necessità per consentire azioni specifiche. Questo è un esempio di come consentire l’apertura di link in una nuova scheda.
+ Rimuovi l’attributo sandbox; questa operazione può essere eseguita aggiungendo il seguente attributo al frammento di codice:

  ```
  amazon_connect('removeSandboxAttribute', true)
  ```

# Aggiungere un modulo di pre-contatto o pre-chat
<a name="add-precontact-form"></a>

Puoi acquisire informazioni sui clienti prima di iniziare un contatto:
+ **Modulo di pre-contatto**: può essere aggiunto per acquisire informazioni dal cliente prima di iniziare un’attività o un contatto via e-mail.
+ **Modulo di pre-chat**: può essere aggiunto per acquisire informazioni dal cliente prima di iniziare un contatto via chat.

Una volta acquisite le informazioni, puoi far sì che vengano mostrate all’agente tramite il Contact Control Panel (CCP) oppure utilizzate in un altro punto del flusso.

Per generare il modulo, devi creare una vista personalizzata e utilizzare il componente del pulsante Azione di connessione. Per ulteriori informazioni sulle viste, consulta [Usa il generatore di interfacce utente in Amazon Connect per le risorse nelle guide step-by-step](no-code-ui-builder.md).

Il pulsante di connessione consente di ricevere l'input dell'utente dal modulo e di selezionare l'azione da intraprendere quando il modulo viene inviato: avviare un modulo task/email o chattare.

# Abilita il sondaggio post-chat
<a name="enable-post-chat-survey"></a>

Il sondaggio post-chat consente di raccogliere il feedback dei clienti finali subito dopo la fine di una conversazione in chat. Con il **`DisconnectOnCustomerExit`**parametro dell'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API, puoi configurare la disconnessione automatica dell'agente quando il cliente finale si disconnette, assicurando che il flusso di disconnessione venga attivato in modo coerente indipendentemente dal partecipante che si disconnette per primo.

## Opzioni di implementazione
<a name="post-chat-survey-implementation"></a>

Esistono due modi per abilitare il sondaggio post-chat:

### Per il widget di chat personalizzato
<a name="post-chat-survey-custom-builder"></a>

Se utilizzi un'implementazione di chat personalizzata:

1. Esegui l'aggiornamento alla versione più recente di [amazon-connect-chatjs](https://github.com/amazon-connect/amazon-connect-chatjs).

1. Aggiungi il `DisconnectOnCustomerExit` parametro alla tua richiesta [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API:

   ```
   {
       "DisconnectOnCustomerExit": ["AGENT"],
       // ... other StartChatContact parameters
   }
   ```

### Per il widget di comunicazione Amazon Connect
<a name="post-chat-survey-communication-widget"></a>

Se utilizzi il widget di comunicazione Amazon Connect:

1. Apri la console Amazon Connect e accedi ai **widget di comunicazione**.

1. Abilita l'impostazione del sondaggio post-chat tramite la pagina Communication Widgets.  
![\[La pagina delle impostazioni del Communication Widget che mostra l'opzione del sondaggio post-chat.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/post-chat-survey-communication-widget.png)

## Aggiorna il flusso di contatti per aggiungere il sondaggio post-chat come flusso di disconnessione
<a name="post-chat-survey-disconnect-flow"></a>

Per abilitare il sondaggio post-chat, devi aggiornare il flusso di disconnessione collegato alla tua soluzione di chat. Una volta configurato, il sondaggio si attiverà automaticamente quando i clienti terminano le sessioni di chat.

Per informazioni sulla creazione di un flusso di disconnessione, consulta[Scenario di chat di esempio](web-and-mobile-chat.md#example-chat-scenario).

Esistono due modi per implementare un sondaggio nel flusso di disconnessione:
+ **Opzione \$11: Utilizzo del ShowView blocco**: utilizza [Blocco di flusso in Amazon Connect: Mostra vista](show-view-block.md) per visualizzare un'interfaccia di sondaggio personalizzata.
+ **Opzione \$12: utilizzo di Lex** - Integrazione con Amazon Lex per la raccolta di sondaggi basata su testo. Per ulteriori informazioni, consulta [Aggiunta di un bot Amazon Lex ad Amazon Connect](amazon-lex.md).

**Nota**  
**Per gli scenari di accesso diretto da parte di un supervisore, assicurati di aggiungere un [Blocco di flusso in Amazon Connect: Imposta coda di lavoro](set-working-queue.md) blocco prima di Transfer to Queue.** La sua omissione causerà la chiusura dei contatti della chat anziché il trasferimento per questa funzione.  

![\[Un diagramma di flusso che mostra il blocco Set Working Queue prima di Transfer to Queue per gli scenari di intrusione del supervisore.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/post-chat-survey-set-working-queue-block.png)


**Contatta Trace Records**  
Quando un cliente termina una sessione di chat, Amazon Connect imposta `disconnectReason` `CUSTOMER_DISCONNECT` in[ContactTraceRecord](ctr-data-model.md#ctr-ContactTraceRecord). Una volta `DisconnectOnCustomerExit` configurato, il sistema genera un nuovo ID di contatto (`nextContactId`) e avvia il flusso di disconnessione configurato.  
Esempio:  

```
{
    "contactId": "104c05e3-abscdfre",
    "nextContactId": "4cbae06d-ca5b-1234567",
    "channel": "CHAT",
    "initiationMethod": "DISCONNECT",
    "disconnectReason": "CUSTOMER_DISCONNECT"
}
```
[Come funzionano gli attributi di contatto in Amazon Connect](what-is-a-contact-attribute.md)verrà aggiornato in Ricerca contatti e Dettagli di contatto.  

![\[Dettagli di contatto che mostrano gli attributi di contatto per un sondaggio post-chat.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/post-chat-survey-contact-attributes.png)


## Risorse aggiuntive
<a name="post-chat-survey-additional-resources"></a>
+ [StartChatContact API](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)
+ [Flusso in entrata di esempio in Amazon Connect per l’esperienza di primo contatto](sample-inbound-flow.md)
+ [Scenario di chat di esempio](web-and-mobile-chat.md#example-chat-scenario)
+ [Blocco di flusso in Amazon Connect: Imposta coda di lavoro](set-working-queue.md)
+ [Blocco di flusso in Amazon Connect: Trasferisci alla coda](transfer-to-queue.md)
+ [Amazon Connect ShowView](https://docs.aws.amazon.com/connect/latest/adminguide/show-view-block.html)
+ [Amazon Connect con Lex](https://docs.aws.amazon.com/connect/latest/adminguide/amazon-lex.html)
+ [Come funzionano gli attributi di contatto in Amazon Connect](what-is-a-contact-attribute.md)

# Integra la Amazon Connect chat in un'applicazione mobile
<a name="integrate-chat-with-mobile"></a>

In questo argomento viene descritto come integrare la chat di Amazon Connect in un’applicazione mobile. Puoi utilizzare una delle seguenti opzioni: 
+ [WebView integration](#webview)
+ La [Amazon Connect chat SDKs per iOS e Android](#integrate-chat-with-mobile-sdks-for-mobile)
+ [Integrazione di React Native](#react-native-integration)

Usa l' Amazon Connect [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API per avviare un contatto. 

**Topics**
+ [Quale opzione di integrazione utilizzare](#integrate-options)
+ [Amazon Connect flusso di lavoro di integrazione della chat](#integrate-chat-with-mobile-workflow)
+ [Inizia a utilizzare l'integrazione con la chat Amazon Connect](#integrate-chat-with-mobile-getting-started)

## Quale opzione di integrazione utilizzare
<a name="integrate-options"></a>

Questa sezione fornisce una descrizione di ciascuna opzione di integrazione per aiutarti a decidere quale utilizzare per la tua soluzione. 

### WebView integrazione
<a name="webview"></a>

L' WebView integrazione con Amazon Connect Chat ti consente di incorporare l'esperienza di chat completa nelle tue applicazioni mobili con uno sforzo di sviluppo minimo. Questo metodo utilizza `WebView` su Android e `WKWebView` su iOS per fornire un’interfaccia di chat semplice e completa. È ideale per i team che cercano una out-of-the-box soluzione rapida per integrare le funzionalità di chat senza personalizzazioni estese.

Questo approccio garantisce comunicazioni sicure e utilizza l’interfaccia di chat di Amazon Connect basata sul web. Tuttavia, dovrai configurare l'app per gestire i cookie e JavaScript correttamente.

Per ulteriori informazioni sull'implementazione dell' WebView integrazione, consulta il GitHub repository di [esempi di interfaccia utente](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/tree/master/mobileChatExamples) di chat di Amazon Connect.

**Raccomandazione**: l'integrazione WebView basata su base è ideale per uno sviluppo rapido e una manutenzione minima, garantendo al contempo funzionalità di chat complete.

### Amazon Connect Chat SDKs per dispositivi mobili
<a name="integrate-chat-with-mobile-sdks-for-mobile"></a>

La Amazon Connect chat SDKs per iOS e Android semplifica l'integrazione della Amazon Connect chat per le applicazioni mobili native. L' SDKs aiuto gestisce la logica della chat lato client e le comunicazioni di back-end in modo simile alla libreria Amazon Connect ChatJS.

La Amazon Connect Chat SDKs integra il servizio Amazon Connect Participant APIs e riassume la gestione della sessione di chat e. WebSocket In questo modo puoi concentrarti sull'interfaccia utente e sull'esperienza utente affidandoti al Amazon Connect Chat SDK per interagire con tutti i servizi di back-end. Questo approccio richiede comunque l'utilizzo del proprio back-end di chat per chiamare l' Amazon Connect `StartChatContact`API e avviare un contatto.
+ Per ulteriori informazioni sull'SDK iOS basato su Swift, consulta [Amazon Connect la pagina Chat SDK per iOS](https://github.com/amazon-connect/amazon-connect-chat-ios). GitHub 
+ Per ulteriori informazioni sull'SDK Android basato su Kotlin, consulta la pagina Chat SDK [Amazon Connect per Android](https://github.com/amazon-connect/amazon-connect-chat-android). GitHub 

**Vantaggi: i** Native offrono SDKs funzionalità robuste e prestazioni elevate, il che li rende ideali per applicazioni che richiedono una personalizzazione profonda e un'esperienza utente senza interruzioni.

### Integrazione di React Native
<a name="react-native-integration"></a>

L’integrazione di React Native per la chat di Amazon Connect offre una soluzione multipiattaforma. Consente ai team di creare funzionalità di chat per Android e iOS con una codebase condivisa. Questo metodo bilancia la personalizzazione e l’efficienza dello sviluppo sfruttando al contempo le funzionalità di React Native per la creazione di solide applicazioni mobili.

Questa integrazione utilizza bridge nativi per accedere a funzionalità avanzate e garantisce prestazioni coerenti e un’esperienza utente uniforme su tutte le piattaforme. È più facile implementare funzionalità chiave come la WebSocket comunicazione utilizzando librerie come `react-native-websocket` e chiamate API con. `axios`

**Ideale per**: team che vogliono massimizzare il riutilizzo del codice mantenendo la flessibilità funzionale.

## Amazon Connect flusso di lavoro di integrazione della chat
<a name="integrate-chat-with-mobile-workflow"></a>

Il diagramma seguente mostra il flusso di programmazione tra un cliente che utilizza un’app mobile e un agente. Il testo numerato nel diagramma corrisponde al testo numerato sotto l’immagine.

![\[Diagramma che mostra il flusso del programma di Amazon Connect chat.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/integrate-chat-mobile-diagram.png)


**Nel diagramma**

1. Quando un cliente avvia una chat nell'app mobile, l'app deve inviare una richiesta di Amazon Connect utilizzo dell'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API. Ciò richiede parametri specifici, come l'endpoint dell'API e IDs l'[istanza](amazon-connect-instances.md) e il flusso di [contatti](connect-contact-flows.md), per autenticare e avviare la chat.

1. L’API `StartChatContact` interagisce con il sistema di back-end per ottenere un token partecipante e un ID contatto che fungono da identificatori univoci per la sessione di chat.

1. L’interfaccia utente dell’app passa la risposta `StartChatContact` all’SDK per dispositivi mobili per consentirgli di comunicare correttamente con [Amazon Connect Participant Service](https://docs.aws.amazon.com/connect/latest/APIReference/API_Operations_Amazon_Connect_Participant_Service.html) e configurare la sessione di chat del cliente.

1. L’SDK espone un oggetto [chatSession](https://github.com/amazon-connect/amazon-connect-chat-ios?tab=readme-ov-file#chatsession-apis) all’interfaccia utente, che contiene metodi facilmente utilizzabili per interagire con la sessione di chat.

1. L’SDK interagisce con [Amazon Connect Participant Service](https://docs.aws.amazon.com/connect/latest/APIReference/API_Operations_Amazon_Connect_Participant_Service.html) utilizzando l’[AWS SDK](https://aws.amazon.com/developer/tools/). La comunicazione con Amazon Connect Participant Service è responsabile di tutte le interazioni del cliente con la sessione di chat. Ciò include azioni come `CreateParticipantConnection`, `SendMessage`, `GetTranscript` o `DisconnectParticipant`.

1. L'SDK gestisce anche la WebSocket connessione necessaria per ricevere messaggi, eventi e allegati dall'agente. Tutto questo verrà gestito e analizzato dall’SDK e visualizzato nell’interfaccia utente in una struttura di facile utilizzo.

## Inizia a utilizzare l'integrazione con la chat Amazon Connect
<a name="integrate-chat-with-mobile-getting-started"></a>

I passaggi e le risorse seguenti ti aiuteranno a iniziare a integrare Amazon Connect Chat nelle tue applicazioni mobili native:

1. [Puoi configurare rapidamente uno [CloudFormation](https://docs.aws.amazon.com/AWSCloudFormation/latest/UserGuide/Welcome.html)stack per fornire il back-end necessario per effettuare chiamate StartChatContact guardando il nostro startChatContact esempio di API su.](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/tree/master/cloudformationTemplates/startChatContactAPI) GitHub

1. Per esempi che mostrano come creare un'interfaccia utente di chat mobile basata su Amazon Connect Chat SDKs, consulta il nostro GitHub progetto [UI Examples](https://github.com/amazon-connect/amazon-connect-chat-ui-examples).

   Fai riferimento ai nostri esempi di chat per [iOS](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/tree/master/mobileChatExamples/iOSChatExample) e [Android](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/tree/master/mobileChatExamples/androidChatExample) che mostrano come potenziare un'applicazione di chat utilizzando Amazon Connect Chat SDK per iOS/Android.

1. Consulta le [Amazon Connect pagine Chat SDK per](https://github.com/amazon-connect/amazon-connect-chat-ios) iOS [Amazon Connect e Chat SDK](https://github.com/amazon-connect/amazon-connect-chat-android) per Android. GitHub La GitHub pagina contiene la documentazione sulle API e una guida all'implementazione che spiega i prerequisiti e le fasi di installazione.

1. Configura l’integrazione di React Native: segui l’esempio [React Native](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/tree/master/mobileChatExamples/connectReactNativeChat) per indicazioni sull’implementazione di una soluzione basata su React Native.

1. Per qualsiasi domanda o problema riguardante la configurazione o l’utilizzo dell’SDK Chat di Amazon Connect nelle sulle tue applicazioni mobili, puoi segnalare un problema nella pagina [Amazon Connect Chat SDK for iOS Issues](https://github.com/amazon-connect/amazon-connect-chat-ios/issues) o [Amazon Connect Chat SDK for Android Issues](https://github.com/amazon-connect/amazon-connect-chat-android/issues). Se si verifica un problema con gli esempi di interfaccia utente di chat per dispositivi mobili, puoi segnalarlo nella pagina [Amazon Connect Chat UI Examples Issues](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/issues).

# Abilitare la formattazione del testo in Amazon Connect per l’esperienza di chat del cliente
<a name="enable-text-formatting-chat"></a>

Utilizzando la formattazione dei messaggi di Amazon Connect, puoi consentire rapidamente ai tuoi clienti e agenti di rendere i loro messaggi di chat più chiari e meglio organizzati. 

**Topics**
+ [Tipi di formattazione supportati](#supported-format-types)
+ [Abilitazione della formattazione dei messaggi](#how-to-enable-message-formatting)
+ [Come aggiungere link e-mail e telefonici](#add-email-phone-links)
+ [Come aggiungere messaggi del chatbot](#add-bot-messages)

## Tipi di formattazione supportati
<a name="supported-format-types"></a>

Puoi fornire i seguenti tipi di formattazione sia per l'interfaccia utente della chat che per l'applicazione dell'agente utilizzando markdown:
+ Grassetto
+ Corsivo
+ Elenco puntato
+ Elenco numerato
+ Collegamenti ipertestuali
+ Emoji
+ Allegati. Per abilitare gli allegati, segui le indicazioni riportate in [Abilitare gli allegati in un CCP in modo che clienti e agenti possano condividere e caricare file](enable-attachments.md).

## Come abilitare la formattazione dei messaggi
<a name="how-to-enable-message-formatting"></a>

1. Quando crei una nuova [interfaccia utente di chat](add-chat-to-website.md), la formattazione RTF è già abilitata e non sono necessarie ulteriori configurazioni.

1. Per aggiungere funzionalità di formattazione del testo a un'[interfaccia utente di chat](add-chat-to-website.md) esistente, aggiorna il [codice del widget di comunicazione](add-chat-to-website.md) utilizzando il codice seguente evidenziato in grassetto: 

   ```
       (function(w, d, x, id){
           s=d.createElement('script');
           s.src='https://your-instance-alias.my.connect.aws/connectwidget/static/amazon-connect-chat-interface-client.js';
           s.async=1;
           s.id=id;
           d.getElementsByTagName('head')[0].appendChild(s);
           w[x] =  w[x] || function() { (w[x].ac = w[x].ac || []).push(arguments) };
       })(window, document, 'amazon_connect', 'widget-id');
       amazon_connect('styles', { openChat: { color: 'white', backgroundColor: '#123456'}, closeChat: { color: 'white', backgroundColor: '#123456'} });
       amazon_connect('snippetId', 'snippet-id');
       amazon_connect('supportedMessagingContentTypes', [ 'text/plain', 'text/markdown' ]);
   ```

   Il codice evidenziato in rosso viene impostato sui valori corretti quando ricevi il frammento dalla console Amazon Connect. L'unico contenuto che devi aggiungere o rimuovere è l'ultima riga in grassetto per `supportedMessagingContentTypes`. 

1. Per aggiungere funzionalità di formattazione del testo a un'interfaccia utente di chat personalizzata (ad esempio, l'[interfaccia di chat di Amazon Connect](https://github.com/amazon-connect/amazon-connect-chat-interface) o la tua soluzione di interfaccia utente personalizzata in aggiunta a [ChatJS](https://github.com/amazon-connect/amazon-connect-chatjs)), segui questa procedura: 

   1. Chiamata dell'API [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html). Mentre chiami `StartChatContact`, aggiungi il parametro `SupportedMessagingContentTypes`, come mostrato in grassetto nell'esempio seguente:

      ```
      // Amazon Connect StartChatContact API
      {
          "Attributes": { 
              "string" : "string" 
          },
          "ClientToken": "string",
          "ContactFlowId": "your flow ID",
          "InitialMessage": { 
              "Content": "string",
              "ContentType": "string"
          },
          "InstanceId": "your instance ID",
          "ParticipantDetails": { 
              "DisplayName": "string"
          }
          
          // optional
         "SupportedMessagingContentTypes": [ "text/plain", "text/markdown" ]
      }
      ```

   1. Importa `chatjs` come oggetto, come illustrato nell'esempio seguente:

      ```
      import "amazon-connect-chatjs";
      
      this.session = connect.ChatSession.create({
            ...
          });
      
      this.session.sendMessage({
            message: "message-in-markdown-format",
            contentType: "text/markdown"
      });
      ```

      Se non lo utilizzi ChatJs, consulta questi argomenti per informazioni sull'invio di testo markdown tramite Amazon Connect APIs: [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)e [SendMessage](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_SendMessage.html).

   1. Invia messaggi con markdown. Per un esempio, fai riferimento al precedente frammento di codice per l'importazione di `chatjs` come oggetto. Puoi utilizzare markdown semplice per formattare il testo nelle chat. Se [oggi utilizzi già chatjs per inviare messaggi in testo semplice](https://github.com/amazon-connect/amazon-connect-chatjs/blob/master/src/core/chatController.js#L66), puoi modificare la logica esistente per chiamare [SendMessage](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_SendMessage.html)con `text/markdown` as `contentType` anziché `text/plain` inviare messaggi markdown. Assicurati di aggiornare il parametro `sendMessage` in modo che includa il formato markdown dei tuoi messaggi. Per ulteriori informazioni, consulta la sezione relativa alla [sintassi di base di Markdown Guide](https://www.markdownguide.org/basic-syntax/).

   1. Implementa la tua logica nel pacchetto UI per visualizzare i messaggi con markdown nell'area di input e nella trascrizione della chat. Se utilizzi React, puoi usare [react-markdown](https://github.com/remarkjs/react-markdown) come riferimento.

**Nota**  
Le funzionalità di formattazione del testo vengono mostrate al tuo agente solo se sono state abilitate per il cliente nell'interfaccia utente della chat. Se la formattazione del testo non è supportata o abilitata nell'interfaccia utente della chat del cliente, l'agente non sarà in grado di comporre e inviare messaggi con formattazione del testo.
Tutte le funzionalità di formattazione del testo ad eccezione degli allegati sono disponibili per [risposte rapide](create-quick-responses.md).

## Come aggiungere link e-mail e telefonici
<a name="add-email-phone-links"></a>

Il seguente esempio mostra come aggiungere link cliccabili e chiamabili alle applicazioni web e mobili.

```
Call us today: [+1 (123) 456-7890](tel:+11234567890)
[Call Us](tel:+11234567890)
[Skype Us](callto:+91123-456-7890)
[Fax Us](fax:+91123-456-7890)
[Text Us](SMS:+91123-456-7890)
[Email Us](mailto:name@email.com)
```

## Come aggiungere messaggi del chatbot
<a name="add-bot-messages"></a>

Quando abiliti il markdown per i messaggi di chat, puoi utilizzare la formattazione RTF per i seguenti tipi di messaggi del chatbot:
+ Flussi [Riproduci prompt](play.md)
+ Flussi [Recupera input cliente](get-customer-input.md)
+ `SYSTEM_MESSAGE`
+ `Lex BOT`
+ `Third Party BOT`
+ `Lex BOT Lambda`

L’immagine seguente mostra come abilitare manualmente un prompt in un blocco di flusso [Riproduci prompt](play.md):

![\[Immagine di un blocco di flusso e di un prompt con 2 link, uno per le domande frequenti e l’altro per un numero di telefono.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chat-rtf-play-prompt-flow-1.png)


L’immagine seguente mostra come abilitare manualmente un prompt nel blocco di flusso [Recupera input cliente](get-customer-input.md), quindi associare il blocco di flusso a un bot di Amazon Lex:

![\[Immagine di un blocco di flusso e di un prompt con 2 link, uno per le domande frequenti e l’altro per un numero di telefono.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chat-rtf-get-customer-flow.png)


L’immagine seguente mostra l’aspetto del prompt nel SYSTEM\$1MESSAGE e in vari tipi di messaggi BOT:

![\[Immagine che mostra i link “Review our FAQ” e “give us a call” nei messaggi SYSTEM e BOT.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chat-rtf-sys-bot-messages.png)


L’immagine seguente mostra come configurare un prompt nell’intento di un bot di Amazon Lex:

![\[Immagine di un intendo di Amazon Lex che contiene un prompt con 2 link, uno per le domande frequenti e l’altro per un numero di telefono.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chat-rtf-lex-flow.png)


Per ulteriori informazioni sugli endpoint, consulta [Aggiunta di endpoint](https://docs.aws.amazon.com/lexv2/latest/dg/add-intents.html) nella *Guida per gli sviluppatori di Amazon Lex V2*. Per ulteriori informazioni sui messaggi Lambda, consulta [Enabling custom logic with AWS Lambda functions](https://docs.aws.amazon.com/lexv2/latest/dg/lambda.html), sempre nella Amazon Lex V2 Developer *Guide*.

# Abilitare le notifiche per i clienti di chat in Amazon Connect
<a name="message-receipts"></a>

Puoi abilitare le conferme di *consegna* e *lettura* nell'[interfaccia utente della chat](add-chat-to-website.md) per consentire ai clienti di conoscere lo stato dei messaggi che inviano. Ciò offre loro trasparenza e migliora l'esperienza complessiva della chat. 

Indipendentemente dal fatto che le conferme dei messaggi siano abilitate o meno, i dati e gli eventi di ricezione dei messaggi vengono sempre inviati e possono essere visualizzati nel log di rete. L’abilitazione e la disabilitazione delle conferme dei messaggi nell’interfaccia utente della chat influisce solo sulla visualizzazione delle conferme nella trascrizione del widget di comunicazione.

**Suggerimento**  
Per impostazione predefinita, le conferme dei messaggi sono già abilitate nell'esperienza di [Test della chat](chat-testing.md#test-chat), nel Pannello di controllo dei contatti (CCP) e nell'[esempio open source scaricabile](download-chat-example.md) del widget di chat.

**Procedura per abilitare le conferme dei messaggi nell'interfaccia utente della chat**

1. Accedi al sito web dell'amministratore di Amazon Connect all'indirizzo https://*instance name*.my.connect.aws/. Scegli **Personalizza widget di comunicazione**.  
![\[Pagina della guida alla configurazione, opzione Personalizza widget di comunicazione.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-customize-chat-window-button.png)

1. Scegli **Modifica**.  
![\[Pagina di personalizzazione del widget di comunicazione, pulsante Modifica.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-edit-messagereceipt.png)

1. Per impostazione predefinita, l'opzione **Conferme di ricezione dei messaggi** non è abilitata. Impostala su **Abilitata**.  
![\[Conferme dei messaggi abilitate.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chatwidget-enable-messagereceipt.png)

Le conferme dei messaggi sono ora abilitate. I clienti che utilizzano il widget di comunicazione inizieranno a ricevere immediatamente le conferme di *consegna* e *lettura* dei messaggi. 

# Impostazione di timeout per i partecipanti alla chat
<a name="setup-chat-timeouts"></a>

Quando una conversazione in chat tra un agente e un cliente rimane inattiva (non vengono inviati messaggi) per un certo periodo di tempo, potresti voler considerare inattivo un partecipante alla chat e persino disconnettere automaticamente un agente dalla chat.

Per fare ciò, puoi configurare sia i timeout di inattività che i timeout di chiusura automatica utilizzando l'azione. [UpdateParticipantRoleConfig](https://docs.aws.amazon.com/connect/latest/APIReference/API_UpdateParticipantRoleConfig.html)

**Suggerimento**  
Questo argomento riguarda la configurazione dei timeout di chat per le conversazioni cliente-agente. Se stai cercando informazioni sulla configurazione dei timeout di chat per i casi in cui i clienti interagiscono con Lex, consulta la sezione [Timeout configurabili per l'input in chat durante un'interazione Lex](get-customer-input.md#get-customer-input-configurable-timeouts-chat) del blocco [Blocco di flusso in Amazon Connect: Recupera input cliente](get-customer-input.md). 

**Puoi impostare quattro diversi tipi di timer.**
+ Specifica il periodo di tempo che deve trascorrere prima che venga intrapresa un'azione.
+ È possibile utilizzare qualsiasi combinazione di timer.     
[\[See the AWS documentation website for more details\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/setup-chat-timeouts.html)

**Indica tutti i timer in minuti.**
+ Minimo: 2 minuti
+ Massimo: 480 minuti (8 ore)

**I timer si applicano ai ruoli dei partecipanti e restano validi per tutta la durata della chat.**
+ I timer vengono configurati per i ruoli dei partecipanti, ad esempio agente e cliente, anziché per i singoli partecipanti.
+  Una volta impostati, i timer restano validi per tutta la durata della chat. Se una chat viene trasferita, i timer si applicano alla nuova interazione. agent/customer 

## Come funzionano i timer delle chat
<a name="how-chat-timer-work"></a>

Il comportamento dei timer è il seguente:
+ I timer vengono eseguiti quando un agente e un cliente sono entrambi connessi alla chat o quando un cliente e un partecipante personalizzato (ad esempio un bot personalizzato) sono connessi. 
+ I timer iniziano per la prima volta quando un agent/custom partecipante si unisce alla chat e si interrompono quando il agent/custom partecipante esce dalla chat.
+ Se per un ruolo sono configurati sia i timer di inattività che quelli di disconnessione automatica, quelli di inattività vengono eseguiti per primi. Ad esempio, nel caso in cui entrambi i timer siano configurati, quello di disconnessione automatica si avvia solo dopo che un partecipante è considerato inattivo.
+ Se per un ruolo è configurato un solo tipo di timer, questo si avvia immediatamente.
+ Se in qualsiasi momento un partecipante invia un messaggio, i suoi timer vengono reimpostati e il partecipante viene considerato attivo, se in precedenza era considerato inattivo.
+ Quando viene aggiunto un allegato a un messaggio, il timer della chat viene reimpostato.
+  La configurazione impostata al momento dell'iscrizione del agent/custom partecipante si applica finché il agent/custom partecipante rimane nella chat. Se aggiorni la configurazione del timer mentre un agent/custom partecipante e un cliente sono già connessi tra loro, la nuova configurazione viene memorizzata ma non applicata finché e a meno che un nuovo agent/custom partecipante non si connetta alla chat.
+ Quando si verifica un evento di disconnessione automatica, tutti i partecipanti diversi dal cliente (ad esempio l’agente, un supervisore addetto al monitoraggio o i partecipanti personalizzati) vengono disconnessi. Se viene disconnesso l’agente e se è stato configurato un blocco [Set Disconnect Flow (Imposta flusso di disconnessione)](set-disconnect-flow.md), la chat viene instradata ad esso.

### scadenza del timer di inattività
<a name="idle-timer-expiry"></a>

Di seguito è indicato cosa succede quando scade un timer di inattività durante un’interazione cliente-partecipante personalizzato: 

1. Un evento inattivo viene inviato a tutti gli endpoint. websockets/streaming 

1. Se è configurato un timer di disconnessione automatica, viene avviato. 

1. Se il timer di inattività scade mentre il contatto di chat si trova in un blocco **Attesa**, il contatto NON viene instradato nel ramo **Tempo scaduto**. Se si verifica questo scenario non viene intrapresa alcuna azione. 

### Disconnessione automatica dei partecipanti personalizzati
<a name="auto-disconnecting"></a>

Quando scade il timer di disconnessione automatica, il partecipante personalizzato viene disconnesso dalla chat. 

Amazon Connect esegue una delle seguenti operazioni allo scadere dei timer di disconnessione automatica:

1. La chat attualmente risiede in un blocco [Attendi](wait.md) configurato per un partecipante personalizzato. 
   + Il partecipante personalizzato viene disconnesso dalla chat e la chat riprende il flusso prendendo il ramo **Partecipante bot disconnesso**.

1. La chat attualmente si trova in un blocco [Attendi](wait.md) configurato per il cliente OPPURE la chat non si trova in un blocco **Attesa**.
   + Il partecipante personalizzato viene disconnesso dalla chat e non vengono intraprese altre azioni. 

## Messaggi mostrati ai partecipanti
<a name="chat-timeouts-events"></a>

I messaggi vengono mostrati a tutti i partecipanti quando si verifica uno dei seguenti eventi:
+ Un partecipante diventa inattivo.
+ Un partecipante inattivo invia un messaggio e torna attivo.
+ Si verifica la disconnessione automatica. Dal momento che l'agente è disconnesso, non potrà visualizzare il messaggio.

Questi eventi non permangono nelle trascrizioni e non vengono fatturati.

I messaggi predefiniti (in tutte le lingue supportate) per ciascuno di questi eventi vengono mostrati agli agenti nel Contact Control Panel (CCP). 

L'immagine seguente mostra esempi di messaggi predefiniti che l'agente vedrebbe nel CCP in caso di inattività. Uno di questi è *L'agente è inattivo*.

![\[Ccp, messaggi predefiniti in caso di inattività.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/chat-timeout-message.png)


## Utilizzo consigliato
<a name="chat-timeouts-usage"></a>

Per utilizzare la funzionalità di timeout della chat, è consigliabile procedere come segue:

1. Incorpora una chiamata all'[UpdateParticipantRoleConfig](https://docs.aws.amazon.com/connect/latest/APIReference/API_UpdateParticipantRoleConfig.html)azione in una Lambda in un flusso di contatti.

1. A seconda del caso d'uso, includi la funzione Lambda immediatamente dopo l'avvio della chat (all'inizio del flusso) o subito prima di instradare il contatto a una coda.

## Personalizzazione dell'interfaccia utente di chat del cliente per un evento di disconnessione
<a name="chat-timeouts-ui"></a>

Per personalizzare l'interfaccia utente di chat del cliente per un evento di disconnessione sono disponibili i seguenti metodi in [ChatJS](https://github.com/amazon-connect/amazon-connect-chatjs):
+ `onParticipantIdle(callback)`
+ `onParticipantReturned(callback)`
+ `onAutoDisconnection(callback)`

Utilizzali per registrare i gestori di callback che vengono attivati al verificarsi dei nuovi eventi.

# Abilitazione delle notifiche push per la chat mobile
<a name="enable-push-notifications-for-mobile-chat"></a>

Le notifiche push per la chat mobile sono configurate tramite [AWS End User Messaging](https://docs.aws.amazon.com/sms-voice/latest/userguide/what-is-service.html). Puoi abilitare le notifiche push per la chat mobile su dispositivi iOS o Android, in modo da avvisare i clienti di nuovi messaggi anche quando non utilizzano attivamente l’applicazione mobile. Puoi abilitare questa funzionalità nella tua app esistente integrata con il [Amazon Connect dispositivo mobile SDKs](https://docs.aws.amazon.com/connect/latest/adminguide/integrate-chat-with-mobile.html), in una [soluzione di visualizzazione web](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/tree/master/mobileChatExamples) o in una soluzione nativa personalizzata. 

 I passaggi e le risorse seguenti ti aiuteranno a iniziare a integrare le notifiche Amazon Connect push nelle tue applicazioni mobili native: 

## Passaggio 1: ottieni le credenziali dalla console FCM di Apple APNs e Google
<a name="step-1-enable-push-notifications-for-mobile-chat"></a>

Per effettuare la configurazione in Amazon Connect modo da poter inviare notifiche push alle tue app, devi prima ottenere le credenziali dalla console FCM di Apple APNs e Google che consentiranno a [AWS End User Messaging](https://docs.aws.amazon.com/sms-voice/latest/userguide/what-is-service.html) di inviare notifiche alle tue applicazioni mobili. Le credenziali fornite dipendono dal sistema di notifiche push che utilizzi: 
+  Per le credenziali del servizio Apple Push Notification (APNs), consulta [Ottenere una chiave di crittografia e un ID di chiave da Apple](https://developer.apple.com/documentation/usernotifications/establishing-a-token-based-connection-to-apns#Obtain-an-encryption-key-and-key-ID-from-Apple) e [Ottenere un certificato di provider da Apple nella documentazione Apple](https://developer.apple.com/documentation/usernotifications/establishing-a-certificate-based-connection-to-apns#Obtain-a-provider-certificate-from-Apple) per sviluppatori. 
+  Per le credenziali Firebase Cloud Messaging (FCM) di Google, che possono essere ottenute tramite la console Firebase, consulta [Firebase Cloud Messaging.](https://firebase.google.com/docs/cloud-messaging) 

## Fase 2: Creare un'applicazione di servizio di messaggistica per l'utente AWS finale utilizzando la AWS console e abilitare il canale di notifica push per FCM o APNs
<a name="step-2-enable-push-notifications-for-mobile-chat"></a>

 Prima di poter abilitare Amazon Connect per l’invio di notifiche push, è necessario [creare un’applicazione AWS End User Messaging e abilitare il canale delle notifiche push](https://docs.aws.amazon.com/push-notifications/latest/userguide/procedure-enable-push.html) nella [Console AWS](https://console.aws.amazon.com/push-notifications/).

 Segui queste istruzioni per creare un’applicazione e abilitare uno qualsiasi dei canali push. Per completare questa procedura è necessario solo inserire il nome di un’applicazione. Puoi abilitare o disabilitare qualsiasi canale push in un secondo momento: 

1.  Aprire la console AWS End User Messaging Push all'indirizzo [https://console.aws.amazon.com/push-notifications/](https://console.aws.amazon.com/push-notifications/) 

1.  Scegli **Crea applicazione**. 

1.  Inserisci il nome dell’applicazione nel campo **Nome applicazione**. 

1.  (Facoltativo) Segui questo passaggio facoltativo per abilitare il **servizio Apple Push Notification (APNs)**. 

   1.  Per il **servizio Apple Push Notification (APNs)**, seleziona **Abilita**. 

   1.  Per **Tipo di autenticazione predefinita** scegli: 

      1.  Se scegli **Credenziali chiave**, fornisci le seguenti informazioni dal tuo account sviluppatore Apple. AWS End User Messaging Push richiede queste informazioni per creare token di autenticazione. 

         1.  **ID chiave**: ID assegnato alla chiave di firma. 

         1.  **Identificatore del bundle**: ID assegnato all'app iOS. 

         1.  **Identificatore del team**: ID assegnato al team dell'account sviluppatore Apple. 

         1.  **Chiave di autenticazione**: file .p8 scaricato dall'account sviluppatore Apple quando crei una chiave di autenticazione. 

      1.  Se si sceglie **Certificate credentials (Credenziali certificato)**, è necessario fornire le seguenti informazioni: 

         1.  **SSL certificate (Certificato SSL)**: il file .p12 per il certificato TLS. 

         1.  **Password certificato**: se hai assegnato una password al certificato, immettila qui. 

         1.  **Tipo di certificato**: seleziona il tipo di certificato da utilizzare. 

1.  (Facoltativo) Segui questo passaggio facoltativo per abilitare **Firebase Cloud Messaging (FCM)**. 

   1.  Per **Firebase Cloud Messaging (FCM)** seleziona **Abilita**. 

   1.  Scegli **Credenziali token** per **Tipo di autenticazione predefinita**, quindi scegli il file JSON di servizio. 

1.  Scegli **Crea applicazione**. 

## Fase 3: Associare l'applicazione AWS End User Messaging a un'istanza Amazon Connect
<a name="step-3-enable-push-notifications-for-mobile-chat"></a>

 Per abilitare le notifiche push su un'[Amazon Connect istanza](https://docs.aws.amazon.com/connect/latest/adminguide/find-instance-arn.html), è necessario associare un'applicazione di messaggistica per l'utente AWS finale a un'[Amazon Connect istanza](https://docs.aws.amazon.com/connect/latest/adminguide/find-instance-arn.html) chiamando l'[CreateIntegrationAssociation](https://docs.aws.amazon.com/connect/latest/APIReference/API_CreateIntegrationAssociation.html)API con `PINPOINT_APP` [IntegrationType](https://docs.aws.amazon.com/connect/latest/APIReference/API_CreateIntegrationAssociation.html#API_CreateIntegrationAssociation_RequestSyntax). Puoi chiamare questa API con l’interfaccia [AWS CLI](https://docs.aws.amazon.com/cli/latest/reference/connect/create-integration-association.html) o l’[SDK Amazon Connect](https://aws.amazon.com/developer/tools/) per qualsiasi lingua supportata. Si tratta di una fase di onboarding una tantum necessaria per ogni integrazione tra un'applicazione di messaggistica con l'utente AWS finale e un'istanza. Amazon Connect 

## Passaggio 4: ottieni il token del dispositivo con FCM o APNs SDK e registralo con Amazon Connect
<a name="step-4-enable-push-notifications-for-mobile-chat"></a>

Dovrai recuperare il token del dispositivo e utilizzarlo per registrare un dispositivo mobile dell'utente finale con un contatto di Amazon Connect chat per inviare notifiche push per i nuovi messaggi nella chat. Leggi la seguente documentazione per FCM/APNs sviluppatori su come viene generato e ottenuto il token del dispositivo dall'applicazione mobile.
+  Per il servizio Apple Push Notification (APN), consulta [Registrazione dell'app APNs](https://developer.apple.com/documentation/usernotifications/registering-your-app-with-apns) nella documentazione per sviluppatori Apple.
+  Per Firebase Cloud Messaging (FCM), consulta [Best practices for FCM registration token management](https://firebase.google.com/docs/cloud-messaging/manage-tokens).

 Per registrare il dispositivo con un contatto della chat, consigliamo di procedere come segue: 

1.  Quando l'applicazione mobile chiama l'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API, passa gli attributi `deviceToken` e `deviceType` come [contatto](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html#connect-StartChatContact-request-Attributes). Per gli utenti del widget WebView e Hosted Communication, consulta [Come trasferire gli attributi del contatto nel widget di comunicazione](https://docs.aws.amazon.com/connect/latest/adminguide/pass-contact-attributes-chat.html#how-to-contact-attributes-chatwidget) per maggiori dettagli.

1.  Incorpora una chiamata all'[CreatePushNotificationRegistration](https://docs.aws.amazon.com/connect/latest/APIReference/API_CreateIntegrationAssociation.html)azione in una funzione Lambda in un flusso di contatti. Il blocco di flusso deve leggere `deviceToken` e `deviceType` dagli attributi di contatto definiti dall’utente, poi `initialContactId` dagli attributi di sistema, quindi trasferire questi valori alla funzione Lambda.

   1.  A seconda del caso d’uso, includi la funzione Lambda immediatamente dopo l’avvio della chat (all’inizio del flusso) se desideri che l’utente finale riceva subito le notifiche push oppure subito prima di instradare il contatto a una coda in modo che riceva il contatto solo quando l’agente sta per unirsi. Una volta effettuata la chiamata API, il dispositivo inizierà a ricevere notifiche push quando arriva un nuovo messaggio dall’agente o dal sistema. Per impostazione predefinita, le notifiche push verranno inviate per tutti i messaggi del sistema e dell’agente.  
![\[Invoca il blocco di flusso della funzione lambda nel designer di flusso del sito web di amministrazione di Amazon Connect .\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/step-4-set-up-push-notifications-for-mobile-chat-1.png)

1.  (opzionale) Incorpora una chiamata all'[DeletePushNotificationRegistration](https://docs.aws.amazon.com/connect/latest/APIReference/API_CreateIntegrationAssociation.html)azione in una funzione Lambda in un flusso. Una volta effettuata la chiamata API, il dispositivo smetterà di ricevere notifiche push quando arriva un nuovo messaggio dall’agente o dal sistema.

## Fase 5: ricevere notifiche push sulle applicazioni mobili
<a name="step-5-enable-push-notifications-for-mobile-chat"></a>

 Dai un'occhiata al nostro progetto [Amazon Connect Chat UI Examples](https://github.com/amazon-connect/amazon-connect-chat-ui-examples) e fai riferimento ai nostri esempi di visualizzazione web di chat per [iOS](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/tree/master/mobileChatExamples/iOS-WKWebView-sample) e [Android](https://github.com/amazon-connect/amazon-connect-chat-ui-examples/tree/master/mobileChatExamples/android-webview-sample) che mostrano come Amazon Connect APIs integrare e ricevere notifiche push.

## Monitoraggio dell’utilizzo delle notifiche push
<a name="monitor-your-usage-for-push-notification"></a>

 Per garantire l’affidabilità, la disponibilità e le prestazioni delle notifiche push, è fondamentale monitorarne l’utilizzo. Puoi tenere traccia di queste informazioni attraverso diversi canali: 

1.  AWS fornisce strumenti di monitoraggio completi per le notifiche push. Per ulteriori informazioni, consulta [Monitoraggio della messaggistica push per l'utente AWS finale](https://docs.aws.amazon.com/push-notifications/latest/userguide/monitoring-overview.html). 

1.  A seconda del servizio di notifica push che utilizzi, puoi accedere a dati di utilizzo aggiuntivi tramite le rispettive console. 

   1.  Firebase Cloud Messaging (FCM): consulta la documentazione FCM su [Informazioni sulla consegna dei messaggi](https://firebase.google.com/docs/cloud-messaging/understand-delivery?platform=android) per informazioni dettagliate sull’utilizzo di FCM. 

   1.  Servizio Apple Push Notification (APNs): APNs consulta la sezione della documentazione sulla [visualizzazione dello stato delle notifiche push tramite Metrics e APNs](https://developer.apple.com/documentation/usernotifications/viewing-the-status-of-push-notifications-using-metrics-and-apns) sul monitoraggio dello stato delle notifiche. 

# Consentire ai clienti di riprendere le conversazioni in chat in Amazon Connect
<a name="chat-persistence"></a>

Spesso i clienti avviano una chat, l'abbandonano e vi fanno ritorno in un secondo momento. Ciò può verificarsi diverse volte nel corso di più giorni, mesi o addirittura anni. L'abilitazione della chat persistente consente di supportare queste conversazioni che continuano nel tempo. 

La chat persistente consente ai clienti di riprendere conversazioni precedenti mantenendone il contesto, i metadati e le trascrizioni. Non devono ripetere quanto detto in precedenza, poiché gli agenti hanno accesso all'intera cronologia delle conversazioni. 

## Reidratazione della chat
<a name="rehydration"></a>

La chat persistente si ottiene attraverso un processo chiamato reidratazione della chat. Questo processo consente di recuperare e visualizzare le trascrizioni delle chat dai precedenti contatti di chat. Consente a clienti e agenti di continuare facilmente le conversazioni dal punto in cui erano state interrotte.

**Importante**  
La reidratazione in una nuova conversazione è possibile solo per le sessioni di chat terminate, poiché la generazione delle trascrizioni avviene in modo asincrono.   
Gli utenti devono attendere 30-60 secondi prima di tentare la reidratazione da una chat terminata in precedenza.

Amazon Connect supporta due tipi di reidratazione:
+ `ENTIRE_PAST_SESSION`: avvia una nuova sessione di chat ed esegue la reidratazione di tutti i segmenti di chat delle sessioni precedenti.
+ `FROM_SEGMENT`: avvia una nuova sessione ed esegue la reidratazione dal segmento della chat precedente specificato.

Per esempi di casi d'uso relativi a queste diverse modalità di reidratazione, consulta [Casi d'uso di esempio](#persistentchatscenario).

## RelatedContactId
<a name="relatedcontactid"></a>

Un nuovo contatto può essere associato a uno esistente mediante `RelatedContactId`. In questo caso, includerà una copia delle [proprietà del contatto](connect-attrib-list.md) correlato.

Per ulteriori informazioni su come `RelatedContactId` viene modellato nei record dei contatti, consulta [Modello di dati per i record di contatto di Amazon Connect](ctr-data-model.md).

Per le chat persistenti, `RelatedContactId` indica il `contactId` utilizzato per la reidratazione della chat.

## Come abilitare la chat persistente
<a name="enable-persistent-chat"></a>

Esistono due modi per abilitare la chat persistente:
+ Specificare un ID contatto precedente durante la creazione di una nuova chat. Per istruzioni, consulta [Abilitare la chat persistente quando si crea un nuovo contatto di chat](#enable-persistent-chat-creating-new-chat-contact).
+ Aggiungere il blocco [Crea un’associazione di contatti persistente](create-persistent-contact-association-block.md) a un flusso. Per istruzioni, consulta [Abilitare la chat persistente in un flusso](#enable-persistent-chat-within-contact-flow).

**Nota**  
Non è possibile scegliere entrambi questi metodi. Ovvero, puoi abilitare la persistenza di un `SourceContactID` in una nuova chat solo una volta.

Per offrire esperienze di chat persistenti, occorre fornire un ID contatto precedente quando si avvia una nuova chat o quando si utilizza il blocco di flusso [Crea un’associazione di contatti persistente](create-persistent-contact-association-block.md). Questa operazione non viene eseguita automaticamente. È consigliabile creare un repository per l’archiviazione dei dati dei record di contatto. Il repository consente il recupero di questi dati per ciascuno dei clienti. 

 Esistono due modi per creare voci in un repository: 
+ Utilizzare lo [streaming dei messaggi di chat](https://docs.aws.amazon.com/connect/latest/adminguide/chat-message-streaming.html) per creare un messaggio quando una chat è terminata.
+ Ispezionare gli [eventi di contatto](https://docs.aws.amazon.com/connect/latest/adminguide/contact-events.html#contact-events-data-model) e utilizzare la [funzione AWS Lambda](https://docs.aws.amazon.com/connect/latest/adminguide/connect-lambda-functions.html) per creare voci nel repository. 

Dopo aver configurato un repository, puoi recuperare l’ID contatto precedente del cliente e fornirlo all’avvio di una nuova chat o all’interno del blocco di flusso [Crea un’associazione di contatti persistente](create-persistent-contact-association-block.md).

Inoltre, assicurati che le trascrizioni chat passate possano essere recuperate dal bucket Amazon S3 dell’istanza. Amazon Connect non è in grado di recuperare le trascrizioni e non è consentita la persistenza delle chat nei seguenti due casi:
+ Vengono utilizzati più bucket di trascrizione delle chat.
+ Viene modificato il nome del file della trascrizione della chat generato da Amazon Connect.

### Abilitare la chat persistente quando si crea un nuovo contatto di chat
<a name="enable-persistent-chat-creating-new-chat-contact"></a>

Per configurare esperienze di chat persistenti durante la creazione di un nuovo contatto di chat, inserisci il precedente `contactId` nel `SourceContactId` parametro dell'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API. Questo consente la reidratazione delle trascrizioni delle chat dei contatti precedenti. Le trascrizioni vengono mostrate nella chat sia al cliente che all’agente. Per vedere un esempio, consulta [Casi d'uso di esempio](#persistentchatscenario).

### Abilitare la chat persistente in un flusso
<a name="enable-persistent-chat-within-contact-flow"></a>

Per configurare esperienze di chat persistente in un flusso:

1. Dopo aver creato un contatto di chat, aggiungi il blocco [Crea un’associazione di contatti persistente](create-persistent-contact-association-block.md) al flusso.

1. Utilizza un attributo definito dall’utente per specificare un ID contatto di origine.

In alternativa, puoi utilizzare l'[CreatePersistentContactAssociation](https://docs.aws.amazon.com/connect/latest/APIReference/API_CreatePersistentContactAssociation.html)API per fornire un ID di contatto di origine per rendere persistente la chat corrente.

La reidratazione viene avviata dopo l’avvio della chat, quando si utilizza il blocco di flusso o l’API. Viene emesso un evento di reidratazione per avvisarti quando la reidratazione è completata.

## Casi d'uso di esempio
<a name="persistentchatscenario"></a>

Un cliente avvia una sessione di chat:

1. L'agente a1 accetta la chat e ha inizio la conversazione con il cliente. Questo è il primo contatto creato nella sessione di chat in corso. In questo esempio viene utilizzato come `contactId` **C1** 11111111-aaaa-bbbb-1111-1111111111111. 

1. L'agente a1 trasferisce la chat all'agente a2 e, in seguito a questa operazione, viene creato un altro contatto. In questo esempio viene utilizzato come `contactId` **C2** 2222222-aaaa-bbbb-2222-222222222222222. 

1. L'agente a2 termina la chat.

1. Il cliente viene reindirizzato al flusso di disconnessione per rispondere a un sondaggio post-chat e, anche in questo caso, viene creato un altro contatto. In questo esempio viene utilizzato come `contactId` **C3** 33333333-aaaa-bbbb-3333-3333333333333.

1. Viene mostrato il sondaggio post-chat e la sessione di chat termina. 

1. In un secondo momento il cliente desidera riprendere la sessione di chat precedente.

A questo punto, possono presentarsi due casi d'uso per il cliente. Entrambi sono riportati di seguito, insieme alla configurazione di Amazon Connect da utilizzare per fornire al cliente le relative esperienze di chat persistente.

### Caso d'uso 1
<a name="persistentchatscenario-usecase1"></a>

Il cliente desidera continuare la sessione di chat precedente e nascondere il sondaggio post-chat. Per fornire questa esperienza è necessario utilizzare la seguente configurazione. 

**Richiesta:**

```
PUT /contact/chat HTTP/1.1
Content-type: application/json
{
   "Attributes": { 
      "string" : "string" 
   },
   "ContactFlowId": "string",
   "InitialMessage": { 
      "Content": "string",
      "ContentType": "string"
   },
   "InstanceId": "string",
   ... // other chat fields
     
   // NEW Attribute for persistent chat 
   "PersistentChat" : {
       "SourceContactId":"2222222-aaaa-bbbb-2222-222222222222222" 
       "RehydrationType":"FROM_SEGMENT"
   }
}
```

#### Configurazione
<a name="usecase1-configuration"></a>
+ SourceContactId = 2222222-aaaa-bbbb-2222-222222222222222 (il ContactID per C2)
+ RehydrationType = "`FROM_SEGMENT`"

#### Comportamento previsto
<a name="usecase1-behavior"></a>
+ Se si utilizza questa configurazione, viene avviata una sessione di chat persistente dal precedente contatto C2 terminato (ad esempio, 2222222-aaaa-bbbb-2222-222222222222222). 

  È possibile accedere alle trascrizioni delle precedenti interazioni C2 (2222222-aaaa-bbbb-2222-222222222222222) e C1 (11111111-aaaa-bbbb-1111-1111111111111) nella sessione di chat persistente in corso. Il segmento di chat C3 (33333333-aaaa-bbbb-3333-3333333333333) non viene incluso nella sessione di chat persistente.
+ In questo caso, la risposta restituisce C2 (2222222-aaaa-bbbb-222222222222222) come "». [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)ContinuedFromContactId
+ Il `RelatedContactId` per questa sessione di chat persistente è 2222222-aaaa-bbbb-2222-222222222222222 (C2).

### Caso d'uso 2
<a name="persistentchatscenario-usecase2"></a>

Il cliente desidera continuare la sessione di chat precedente e visualizzare la trascrizione delle interazioni passate; inoltre, non desidera nascondere il sondaggio post-chat. Per fornire questa esperienza è necessario utilizzare la seguente configurazione. 

**Nota**  
 Per il tipo di reidratazione `ENTIRE_PAST_SESSION`, specifica come attributo `SourceContactId` il primo contatto (`contactId` iniziale) della sessione di chat precedente.

**Richiesta:**

```
PUT /contact/chat HTTP/1.1
Content-type: application/json
{
   "Attributes": { 
      "string" : "string" 
   },
   "ContactFlowId": "string",
   "InitialMessage": { 
      "Content": "string",
      "ContentType": "string"
   },
   "InstanceId": "string",
   ... // other chat fields
     
   // NEW Attribute for persistent chat 
   "PersistentChat":{
        "SourceContactId":"11111111-aaaa-bbbb-1111-1111111111111" // (first contactId C1)
        "RehydrationType":"ENTIRE_PAST_SESSION"
   }
}
```

#### Configurazione
<a name="usecase2-configuration"></a>
+ SourceContactId = (C1) `11111111-aaaa-bbbb-1111-1111111111111`
+ RehydrationType = «E`NTIRE_PAST_SESSION`»

#### Comportamento previsto
<a name="usecase2-behavior"></a>
+ Se si sceglie questa configurazione, viene avviata una sessione di chat persistente dall'ultimo contatto di chat terminato (C3). È possibile accedere alle trascrizioni delle precedenti interazioni C3, C2 e C1 nella sessione di chat persistente in corso.
+ In questo caso, la [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)risposta restituisce -aaaa-bbbb-3333-33333 (C3) come "». ContinuedFromContactId
+ Il `RelatedContactId` per questa sessione di chat persistente è 33333333-aaaa-bbbb-3333-3333333333333 (C3).

**Nota**  
I collegamenti delle chat sono cumulativi, ossia vengono trasferiti alle sessioni di chat collegate.  
Ad esempio, se un contatto (`contactId` C2) appartenente a una sessione di chat precedente è collegato a un contatto (`contactId` C1) di un'altra interazione precedente, dalla nuova sessione di chat persistente creata dal collegamento di C2 deriverà anche il collegamento implicito di C1. Il collegamento della nuova sessione di chat persistente sarà il seguente: C3 → C2 → C1.  
Il ContactID precedente, da cui continua la sessione di chat persistente, viene esposto nel campo nella [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)risposta `ContinuedFromContactId` dell'API. È inoltre presente nel campo RelatedContactId nel [record di contatto](ctr-data-model.md#ctr-ContactTraceRecord) relativo al contatto.

## Come accedere alle trascrizioni dei contatti di chat precedenti per una chat persistente
<a name="access-past-chat-transcript"></a>

Per l'accesso alle trascrizioni delle interazioni precedenti per una chat persistente viene utilizzato il modello di impaginazione `NextToken` esistente. La chiamata iniziale [GetTranscript](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_GetTranscript.html)a una sessione di chat persistente appena avviata contiene un `NextToken` nella risposta, se esistono messaggi di chat precedenti. `NextToken`deve essere utilizzata per accedere alla trascrizione della chat precedente e per impostare l'opzione `ScanDirection` per `BACKWARD` la [GetTranscript](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_GetTranscript.html)chiamata successiva per recuperare i messaggi di chat precedenti. 

Se ci sono più messaggi di chat precedenti, ne [GetTranscript](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_GetTranscript.html)restituisce uno nuovo `NextToken` e lo stesso processo può essere ripetuto per recuperare altre trascrizioni di chat precedenti.

## Utilizzo dei filtri `StartPosition` e `contactId` per la chat persistente
<a name="startposition"></a>

Amazon Connect non supporta l'utilizzo `StartPosition` e `contactId` i filtri della [GetTranscript](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_GetTranscript.html)chiamata per gli attributi degli elementi di trascrizione che provengono dalla chat precedente. 

# Abilitare lo streaming di messaggi di chat in tempo reale in Amazon Connect
<a name="chat-message-streaming"></a>

Amazon Connect Chat consente [APIs](https://docs.aws.amazon.com/connect/latest/APIReference/Welcome.html)di abbonarsi a un flusso di messaggi di chat in tempo reale. Usando questi APIs, puoi: 
+ Eseguire lo streaming di messaggi in tempo reale quando viene creato un nuovo contatto di chat.
+ Estendere l’attuale funzionalità di chat di Amazon Connect in modo che supporti casi d’uso come la creazione di integrazioni con soluzioni SMS e applicazioni di messaggistica di terze parti, l’abilitazione di notifiche push per dispositivi mobili e la creazione di dashboard analitiche per monitorare e tracciare l’attività dei messaggi di chat. 

**Nota**  
Questa pagina descrive come abbonarsi a un endpoint SNS per lo streaming in tempo reale di messaggi di chat in Amazon Connect. Se stai cercando di abilitare lo streaming di messaggi per le interazioni conversazionali di intelligenza artificiale in Amazon Connect, consulta. [Abilita lo streaming di messaggi per la chat basata sull'intelligenza artificiale](message-streaming-ai-chat.md)

## Come funziona lo streaming dei messaggi APIs
<a name="how-chat-message-streaming-apis-work"></a>

Lo [streaming APIs dei messaggi di Amazon Connect](https://docs.aws.amazon.com/connect/latest/APIReference/Welcome.html) viene attivato quando si verificano determinati eventi all'interno di un contatto Amazon Connect Chat. Ad esempio, quando un cliente invia un nuovo messaggio di chat, l'evento trasmette un [payload](sns-payload.md) a un endpoint specifico contenente dati sul messaggio appena inviato. I messaggi vengono pubblicati su un endpoint specifico utilizzando [Amazon Simple Notification Service](https://docs.aws.amazon.com/sns/latest/dg/welcome.html) (Amazon SNS). 

In questo argomento viene descritto come configurare lo streaming di messaggi in tempo reale utilizzando Amazon Connect e Amazon SNS. La procedura è la seguente: 

1. Utilizza la console Amazon SNS per creare un nuovo argomento SNS standard e configurare i messaggi.

1. Chiama l'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API per avviare il contatto in chat.

1. Chiama l'[StartContactStreaming](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartContactStreaming.html)API per avviare lo streaming dei messaggi. 

1. Chiama l'[CreateParticipantConnection](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_CreateParticipantConnection.html)API per creare la connessione del partecipante.

## Passaggio 1: creare un argomento Amazon SNS standard.
<a name="step1-chat-streaming"></a>

1. Accedi alla console Amazon SNS. 

1. [Crea un argomento SNS](https://docs.aws.amazon.com/sns/latest/dg/sns-create-topic.html) nel tuo AWS account. Nella sezione **Dettagli**, per **Tipo** scegli **Standard**, inserisci un nome per l'argomento e seleziona **Crea argomento**.
**Nota**  
Attualmente, lo streaming dei messaggi supporta APIs solo lo standard SNS per lo streaming di messaggi in tempo reale. mentre quelli [Amazon SNS FIFO (First-In, First-Out)](https://docs.aws.amazon.com/sns/latest/dg/sns-fifo-topics.html) non sono supportati. 

1. Una volta creato l'argomento, il relativo nome della risorsa Amazon (ARN) viene mostrato nella sezione **Dettagli**. Copia l'ARN dell'argomento negli appunti. Lo utilizzerai nel passaggio successivo e in [Passaggio 3: abilitare lo streaming dei messaggi sul contatto](#step3-chat-streaming). 

   L'argomento ARN è simile al seguente esempio: 

   ```
   arn:aws:sns:us-east-1:123456789012:MyTopic                                
   ```

1. Apri la scheda **Policy di accesso**, scegli **Modifica**, quindi aggiungi una policy basata su risorse per l'argomento SNS che fornisca ad Amazon Connect l'autorizzazione a pubblicare su di esso. Di seguito è riportato un esempio di policy SNS che puoi copiare e incollare nell'editor JSON e personalizzare con i tuoi valori: 

------
#### [ JSON ]

****  

   ```
   {
      "Version":"2012-10-17",		 	 	 
      "Statement":[
         {
            "Effect":"Allow",
            "Principal":{
               "Service":"connect.amazonaws.com"
            },
            "Action":"sns:Publish",
            "Resource":"arn:aws:sns:us-east-1:111122223333:TopicName",
            "Condition":{
               "StringEquals":{
                   "aws:SourceAccount":"111122223333"
               },
               "ArnEquals":{
               "aws:SourceArn":"arn:aws:connect:us-east-1:111122223333:instance/InstanceId"
               }
            }
         }
      ]
   }
   ```

------
**Nota**  
La **policy di accesso** predefinita prevede l'applicazione a `sourceOwner` di condizioni quali:   

   ```
   "Condition": {
           "StringEquals": {
             "AWS:SourceOwner": "921772911154"
           }
         }
   ```
Assicurati di rimuoverla e di sostituirla con `SourceAccount`, ad esempio:  

   ```
   "Condition":{
               "StringEquals":{
                  "aws:SourceAccount":"YOUR_AWS_ACCOUNT_ID"
               },
               "ArnEquals":{
                  "aws:SourceArn":"YOUR_CONNECT_INSTANCE_ARN"
               }
            }
   ```
Ciò eviterà che si verifichi un problema di [“confused deputy” tra i servizi](cross-service-confused-deputy-prevention.md). 

1. Se utilizzi la crittografia lato server su SNS, verifica di avere abilitata l'autorizzazione `connect.amazonaws.com` su KMS key. Di seguito è riportata una policy di esempio:

------
#### [ JSON ]

****  

   ```
   {
       "Version":"2012-10-17",		 	 	 
       "Id": "key-consolepolicy-3",
       "Statement": [
           {
               "Sid": "Enable IAM User Permissions",
               "Effect": "Allow",
               "Principal": {
                   "AWS": "arn:aws:iam::111122223333:root",
                   "Service": "connect.amazonaws.com"
               },
               "Action": "kms:*",
               "Resource": "*"
           },
           {
               "Sid": "Allow access for Key Administrators",
               "Effect": "Allow",
               "Principal": {
                   "AWS": "arn:aws:iam::111122223333:root",
                   "Service": "connect.amazonaws.com"
               },
               "Action": [
                   "kms:Create*",
                   "kms:Describe*",
                   "kms:Enable*",
                   "kms:List*",
                   "kms:Put*",
                   "kms:Update*",
                   "kms:Revoke*",
                   "kms:Disable*",
                   "kms:Get*",
                   "kms:Delete*",
                   "kms:TagResource",
                   "kms:UntagResource",
                   "kms:ScheduleKeyDeletion",
                   "kms:CancelKeyDeletion"
               ],
               "Resource": "*"
           }
       ]
   }
   ```

------

## Passaggio 2: avviare il contatto di chat
<a name="step2-chat-streaming"></a>

1. Chiama l'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API Amazon Connect per avviare il contatto di chat. 

   Per informazioni su come creare il client SDK per chiamare Amazon Connect APIs, consulta i seguenti argomenti:
   + [Classe AmazonConnectClientBuilder](https://docs.aws.amazon.com/AWSJavaSDK/latest/javadoc/com/amazonaws/services/connect/AmazonConnectClientBuilder.html) 
   + [Creazione di client del servizio](https://docs.aws.amazon.com/sdk-for-java/v1/developer-guide/creating-clients.html) 

1. Tieni traccia della risposta `ContactId` e `ParticipantToken` della [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)risposta poiché questi attributi di risposta vengono utilizzati per chiamare altre chat APIs necessarie per abilitare lo streaming. Ciò viene descritto nei passaggi successivi.

## Passaggio 3: abilitare lo streaming dei messaggi sul contatto
<a name="step3-chat-streaming"></a>
+ Chiama [StartContactStreaming](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartContactStreaming.html)per abilitare lo streaming di messaggi in tempo reale sul tuo argomento SNS.
  + **Limiti**: puoi iscriverti a un massimo di due argomenti SNS per contatto.
  + Quando chiami [StartContactStreaming](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartContactStreaming.html), devi fornire l'Amazon Resource Name (ARN) dell'argomento SNS (vedi). [Passaggio 1: creare un argomento Amazon SNS standard.](#step1-chat-streaming)

    L'ARN di un singolo argomento SNS può essere utilizzato su Account AWS più argomenti, ma deve trovarsi nella stessa regione dell'istanza Amazon Connect. **Ad esempio, se l'argomento ARN è in us-east-1**, l'istanza Amazon Connect deve essere in us-east-1**.**
  + Per i messaggi di chat iniziali che non vengono ricevuti sull'endpoint di streaming, puoi chiamare l'[GetTranscript](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_GetTranscript.html)API per ricevere i messaggi iniziali.

## Passaggio 4: creare la connessione del partecipante
<a name="step4-chat-streaming"></a>
+ Chiamata [CreateParticipantConnection](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_CreateParticipantConnection.html)con l'`ConnectParticipant`attributo passato come vero. 
  + È necessario chiamare [CreateParticipantConnection](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_CreateParticipantConnection.html)entro cinque minuti dalla creazione della chat.
  + Le chiamate [CreateParticipantConnection](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_CreateParticipantConnection.html)con `ConnectParticipant` set to true funzionano solo se hai abilitato lo streaming [Passaggio 2: avviare il contatto di chat](#step2-chat-streaming) e il partecipante chiamante lo è. `Customer`
  + Questo passaggio (creazione della connessione del partecipante) è facoltativo se hai già stabilito con successo la connessione al contatto della chat utilizzando `WEBSOCKET`.

## Fasi successive
<a name="nextsteps-chat-streaming"></a>

Sei pronto per lavorare con lo streaming dei messaggi. APIs

1. Per assicurarti che funzioni correttamente, verifica che i messaggi vengano pubblicati sull'argomento SNS che hai creato. Puoi farlo utilizzando i CloudWatch parametri di Amazon. Per istruzioni, consulta gli [argomenti relativi al monitoraggio dell'utilizzo di Amazon SNS](https://docs.aws.amazon.com/sns/latest/dg/sns-monitoring-using-cloudwatch.html). CloudWatch 

1. Poiché SNS offre [opzioni di conservazione limitate](https://aws.amazon.com/blogs//aws/sns-ttl-control/), è consigliabile configurare [Amazon Simple Queue Service (Amazon SQS)](https://aws.amazon.com/sqs/), [Amazon Kinesis](https://aws.amazon.com/kinesis/) o un altro servizio per la conservazione dei messaggi. 

1. L'utilizzo [StopContactStreaming](https://docs.aws.amazon.com/connect/latest/APIReference/API_StopContactStreaming.html)è facoltativo e non richiesto se le chat vengono [disconnesse](disconnect-hang-up.md) tramite un flusso di contatti o se il cliente disconnette la chat. Tuttavia, `StopContactStreaming` offre la possibilità di interrompere lo streaming dei messaggi sull'argomento SNS anche se la chat è attiva e in corso.

# Utilizza il payload Amazon SNS dopo aver abilitato lo streaming di messaggi in Amazon Connect
<a name="sns-payload"></a>

Dopo aver abilitato correttamente lo streaming dei messaggi, potrebbe essere necessario filtrare un messaggio in modo che venga inviato al partecipante previsto: l'agente, il cliente o tutti.

Per filtrare in base al partecipante, leggi l'attributo specifico delle intestazioni SNS, `MessageVisibility`, per stabilire se il messaggio è destinato solo al cliente, solo all'agente o a tutti. 
+ Invio solo al cliente: per tutto il codice rivolto al cliente, i client devono filtrare i messaggi destinati a quest'ultimo e creare la seguente logica per inoltrarglieli.

  ```
  if ( ( MessageVisibility == CUSTOMER || MessageVisibility == ALL)  && ParticipantRole != CUSTOMER )
  ```
+ Invio solo all'agente:

  ```
  if ( ( MessageVisibility == AGENT || MessageVisibility == ALL)  && ParticipantRole != AGENT )
  ```

È anche possibile sfruttare la funzionalità di filtro di Amazon SNS creando [policy di filtro personalizzate basate sull'abbonamento](https://docs.aws.amazon.com/sns/latest/dg/sns-subscription-filter-policies.html). In questo modo, la logica di filtro dei messaggi viene trasferita dall'abbonato dell'argomento SNS al servizio SNS stesso.

## Attributi dei messaggi nel payload
<a name="sns-message-attributes"></a>

Di seguito è riportata una descrizione di ogni attributo dei messaggi nel payload di Amazon SNS:
+ `InitialContactId`: l'ID del contatto iniziale della chat.
+ `ContactId`: l'ID del contatto attuale della chat. L'`InitialContactId`e `ContactId` può variare se è presente un nuovo agente nella chat o nel flusso di contatti. queue-to-queue
+ `ParticipantRole`: il partecipante che ha inviato il messaggio.
+ `InstanceId`: l'ID dell'istanza Amazon Connect.
+ `AccountId`: L'ID AWS dell'account.
+ `Type`: valori possibili: `EVENT`, `MESSAGE`.
+ `ContentType`: valori possibili: `application/vnd.amazonaws.connect.event.typing`, `application/vnd.amazonaws.connect.event.participant.joined`, `application/vnd.amazonaws.connect.event.participant.left`, `application/vnd.amazonaws.connect.event.transfer.succeeded`, `application/vnd.amazonaws.connect.event.transfer.failed`, `application/vnd.amazonaws.connect.message.interactive`, `application/vnd.amazonaws.connect.event.chat.ended` e altri. 
+ `MessageVisibility`: valori possibili: `AGENT`, `CUSTOMER`, `ALL`.

## Esempio di payload di SNS
<a name="sns-message-payload"></a>

```
{
  "Type" : "Notification",
  "MessageId" : "ccccccccc-cccc-cccc-cccc-ccccccccccccc",
  "TopicArn" : "arn:aws:sns:us-west-2:009969138378:connector-svc-test",
  "Message" :  "{\"AbsoluteTime\":\"2021-09-08T13:28:24.656Z\",\"Content\":\"help\",\"ContentType\":\"text/plain\",\"Id\":\"333333333-be0d-4a44-889d-d2a86fc06f0c\",\"Type\":\"MESSAGE\",\"ParticipantId\":\"bbbbbbbb-c562-4d95-b76c-dcbca8b4b5f7\",\"DisplayName\":\"Jane\",\"ParticipantRole\":\"CUSTOMER\",\"InitialContactId\":\"33333333-abc5-46db-9ad5-d772559ab556\",\"ContactId\":\"33333333-abc5-46db-9ad5-d772559ab556\"}",
  "Timestamp" : "2021-09-08T13:28:24.860Z",
  "SignatureVersion" : "1",
  "Signature" : "examplegggggg/1tEBYdiVDgJgBoJUniUFcArLFGfg5JCvpOr/v6LPCHiD7A0BWy8+ZOnGTmOjBMn80U9jSzYhKbHDbQHaNYTo9sRyQA31JtHHiIseQeMfTDpcaAXqfs8hdIXq4XZaJYqDFqosfbvh56VPh5QgmeHTltTc7eOZBUwnt/177eOTLTt2yB0ItMV3NAYuE1Tdxya1lLYZQUIMxETTVcRAZkDIu8TbRZC9a00q2RQVjXhDaU3k+tL+kk85syW/2ryjjkDYoUb+dyRGkqMy4aKA22UpfidOtdAZ/GGtXaXSKBqazZTEUuSEzt0duLtFntQiYJanU05gtDig==",
  "SigningCertURL" : "https://sns.us-west-2.amazonaws.com/SimpleNotificationService-11111111111111111111111111111111.pem",
  "UnsubscribeURL" : "https://sns.us-west-2.amazonaws.com/?Action=Unsubscribe&SubscriptionArn=arn:aws:sns:us-west-2:000000000000:connector-svc-test:22222222-aaaa-bbbb-cccc-333333333333",
  "MessageAttributes" : {
    "InitialContactId" : {"Type":"String","Value":"33333333-abc5-46db-9ad5-d772559ab556"},
    "MessageVisibility" : {"Type":"String","Value":"ALL"},
    "Type" : {"Type":"String","Value":"MESSAGE"},
    "AccountId" : {"Type":"String","Value":"999999999999"},
    "ContentType" : {"Type":"String","Value":"text/plain"},
    "InstanceId" : {"Type":"String","Value":"dddddddd-b64e-40c5-921b-109fd92499ae"},
    "ContactId" : {"Type":"String","Value":"33333333-abc5-46db-9ad5-d772559ab556"},
    "ParticipantRole" : {"Type":"String","Value":"CUSTOMER"}
  }
}
```

# Risoluzione dei problemi relativi allo streaming dei messaggi in Amazon Connect
<a name="troubleshoot-message-streaming"></a>

## I messaggi non vengono pubblicati su SNS
<a name="message-not-published-to-sns"></a>

Se ciò si verifica, è consigliabile leggere le informazioni incluse nella sezione [Passaggio 1: creare un argomento Amazon SNS standard.](chat-message-streaming.md#step1-chat-streaming):
+ Assicurati di utilizzare un servizio SNS standard e non [Amazon SNS FIFO (First-In, First-Out)](https://docs.aws.amazon.com/sns/latest/dg/sns-fifo-topics.html). Attualmente, lo streaming dei messaggi APIs supporta solo SNS standard per lo streaming di messaggi in tempo reale.
+ Assicurati che nel tuo account sia applicata correttamente un'autorizzazione per SNS basata su risorse.
  + Se la crittografia lato server è abilitata, devi concedere allo stesso servizio Amazon Connect l'autorizzazione principale per le operazioni di crittografia e decrittografia.

## Il flusso non si avvia
<a name="contact-flow-not-starting"></a>

Se utilizzi lo streaming APIs di messaggi al posto dei websocket, invia un evento di conferma della connessione; vedi. [Passaggio 4: creare la connessione del partecipante](chat-message-streaming.md#step4-chat-streaming) L'operazione è paragonabile alla connessione al WebSocket. Il flusso inizia solo dopo l'evento di conferma della connessione.

Chiama [CreateParticipantConnection](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_CreateParticipantConnection.html)dopo [StartContactStreaming](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartContactStreaming.html)per contrassegnarla `Customer` come connessa; vedi. [Passaggio 3: abilitare lo streaming dei messaggi sul contatto](chat-message-streaming.md#step3-chat-streaming) Ciò garantisce che i messaggi vengano inviati dopo che hai confermato che il cliente è pronto a riceverli.

## Il problema non è stato risolto?
<a name="other-issues-message-streaming"></a>

Se dopo aver provato le soluzioni precedenti hai ancora problemi con lo streaming dei messaggi, contatta Supporto per ricevere assistenza. 

Gli amministratori di Amazon Connect possono scegliere una delle seguenti opzioni per contattare il supporto:
+ Se disponi di un account di AWS supporto, vai al [Centro assistenza](https://console.aws.amazon.com/support/home) e invia un ticket.
+ In caso contrario, apri la [Console di gestione AWS](https://console.aws.amazon.com/) e seleziona **Amazon Connect**, **Supporto**, **Crea caso**.

È consigliabile fornire le informazioni riportate di seguito:
+ ID/ARN dell'istanza del centro di contatto. Per trovare l'istanza ARN, consulta [Trovare l’ID o l’ARN dell’istanza Amazon Connect](find-instance-arn.md). 
+ La tua regione. 
+ Una descrizione dettagliata del problema.

# Personalizzare le esperienze del flusso di chat in Amazon Connect integrando partecipanti personalizzati
<a name="chat-customize-flow"></a>

Puoi integrare nella chat di Amazon Connect altre soluzioni, come i bot, per creare esperienze del flusso di chat personalizzate.

Di seguito è riportata la procedura per personalizzare l'esperienza del flusso di chat. Una volta iniziata la chat, implementa questi passaggi per ogni segmento. Ti consigliamo di aggiungere un [Funzione AWS Lambda ](invoke-lambda-function-block.md) blocco per chiamarlo APIs nel tuo flusso di chat. 

**Importante**  
Aggiungi un blocco [Riproduci comando](play.md) prima di un blocco [Funzione AWS Lambda ](invoke-lambda-function-block.md). Questo è necessario solo quando un blocco **Invoke AWS Lambda** è il primo blocco nel flusso di chat in entrata.

1.  [Abilita lo streaming in tempo reale dei messaggi di chat](chat-message-streaming.md). 

1. Chiama l'[CreateParticipant](https://docs.aws.amazon.com/connect/latest/APIReference/API_CreateParticipant.html)API Amazon Connect per aggiungere un partecipante personalizzato (`ParticipantRole`=`CUSTOM_BOT`) al contatto di chat.

   1. Per informazioni su come creare il client SDK per chiamare Amazon Connect APIs, consulta i seguenti argomenti:
      + [Classe AmazonConnectClientBuilder](https://docs.aws.amazon.com/AWSJavaSDK/latest/javadoc/com/amazonaws/services/connect/AmazonConnectClientBuilder.html)
      + [Creazione di client del servizio](https://docs.aws.amazon.com/sdk-for-java/v1/developer-guide/creating-clients.html)

   1. Conserva `ParticipantToken` il codice ottenuto da [CreateParticipant](https://docs.aws.amazon.com/connect/latest/APIReference/API_CreateParticipant.html)cui effettuare la chiamata [CreateParticipantConnection](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_CreateParticipantConnection.html). `CreateParticipantConnection`restituisce un`ConnectionToken`, che puoi usare per chiamare altri partecipanti APIs ad Amazon Connect. 

      Quando si chiama [CreateParticipantConnection](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_CreateParticipantConnection.html)per creare una connessione per un partecipante personalizzato:
      + Imposta `ConnectParticipant` su `True` per indicare che il partecipante personalizzato è connesso e può scambiare messaggi.
      + Passa `Type` `CONNECTION_CREDENTIALS` a chiamare il successivo Amazon Connect Participant Service APIs.
      + È necessario chiamare `CreateParticipantConnection` entro 15 secondi da `CreateParticipant`.

1. Dopo che il partecipante è stato aggiunto al contatto, può scambiare messaggi con il cliente utilizzando Amazon Connect Participant Service. APIs

1. Per disconnettere il partecipante, chiama l'API. [ DisconnectParticipant](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_DisconnectParticipant.html) 

**Nota**  
Un partecipante personalizzato non può essere aggiunto a una chat quando un agente o un bot Amazon Lex è già presente nel contatto. 
Un partecipante personalizzato verrà disconnesso quando un agente o un bot Amazon Lex si unisce a un contatto.
Un solo partecipante personalizzato può essere presente in un contatto.
Un partecipante personalizzato non è autorizzato ad accedere agli allegati caricati da un cliente.

È consigliabile configurare il tempo per il quale un partecipante personalizzato può interagire in chat con un contatto:
+ Imposta la proprietà **Timeout** sul blocco [Attendi](wait.md) per `ParticipantRole` = `CUSTOM_BOT`.
+ Se un bot attivo come partecipante personalizzato non viene disconnesso prima del timeout, il contatto viene instradato alla ramificazione **Tempo scaduto**. Ciò consente di decidere qual è il prossimo blocco da eseguire in base alla richiesta del cliente.

**Nota**  
Un contatto che viene instradato alla ramificazione **Tempo scaduto** non viene disconnesso. È necessario chiamare l'[ DisconnectParticipant](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_DisconnectParticipant.html)API per disconnettere il partecipante.

## Attivare timer per i clienti aggiunti a un partecipante personalizzato
<a name="integrate-bot-extension-client"></a>

Puoi attivare timer sui clienti aggiunti a partecipanti personalizzati, ad esempio i bot personalizzati. In questo modo puoi rilevare quando un cliente smette di rispondere, in modo da poter terminare la conversazione con il bot ed eseguire la fase successiva del flusso. Terminando i partecipanti inattivi, puoi ridurre il numero di chat aperte in cui un cliente che non risponde interagiva con un partecipante personalizzato.

Esegui le fasi seguenti per integrare un’estensione del bot personalizzato per partecipanti inattivi e, facoltativamente, impostare valori personalizzati per il timer. Queste fasi presuppongono che tu utilizzi già la funzionalità partecipante personalizzato per la chat. 

1. Prima che il partecipante personalizzato si unisca alla chat, richiama l'API per il [UpdateParticipantRoleConfig](https://docs.aws.amazon.com/connect/latest/APIReference/API_UpdateParticipantRoleConfig.html)cliente.

   1. I timer si attivano solo per il cliente. I partecipanti personalizzati non hanno timer per i partecipanti inattivi o di disconnessione automatica. 

   1. Puoi scegliere il metodo per invocare l’API. 

   1. I valori del timer configurati in questa fase restano validi per tutta la durata della chat. Se desideri impostare valori timer diversi per l’**interazione tra cliente e agente**, consulta la Fase 2. 

   1. Se il cliente è già configurato in questo modo, non è necessario intraprendere altre azioni per integrare il partecipante personalizzato. 

1. (Facoltativo) Per configurare timer e valori del timer diversi durante l’**interazione tra cliente e agente** e durante l’**interazione tra cliente e partecipante personalizzato**:
   + Prima che l'agente si unisca alla chat, richiama nuovamente l'[UpdateParticipantRoleConfig](https://docs.aws.amazon.com/connect/latest/APIReference/API_UpdateParticipantRoleConfig.html)API con le configurazioni desiderate.

Per ulteriori informazioni sui timer della chat, consulta [Impostazione di timeout per i partecipanti alla chat](setup-chat-timeouts.md).

### Avvio dei timer
<a name="starting-timers"></a>

Un timer inizia per il cliente dopo che il partecipante personalizzato ha stabilito una connessione con lui utilizzando l'API. [CreateParticipantConnection](https://docs.aws.amazon.com/connect/latest/APIReference/API_connect-participant_CreateParticipantConnection.html)

### Cosa succede quando partecipanti non compatibili entrano in chat con un partecipante personalizzato
<a name="non-compatible-participants"></a>

Di seguito è indicato cosa succede quando un agente o un partecipante bot Lex si unisce a una chat con un partecipante personalizzato e tali partecipanti non sono compatibili: 

1. Il partecipante personalizzato viene automaticamente disconnesso dalla chat. 

1. Tutti i timer precedentemente attivi vengono terminati e vengono creati nuovi timer per i partecipanti connessi (se i timer sono configurati).

1. Ogni nuovo timer viene inoltre aggiornato con la configurazione più recente (se necessario). In questo modo viene stabilita di fatto una nuova “sessione inattiva” per il nuovo set di partecipanti attivi nella chat.

### Interazione con il timer del blocco Attendi
<a name="interaction-wait-block-timer"></a>

Il timer di inattività non influisce sul funzionamento del blocco [Attendi](wait.md). 

Il timer del blocco **Attendi** che si avvia quando il contatto di chat entra in un blocco **Attendi** continua a funzionare. Se il timer del blocco **Attendi** scade, il contatto riprende il flusso e viene instradato lungo il ramo **Tempo scaduto**, indipendentemente dal fatto che siano attivi o meno i timer dei partecipanti inattivi.

## Suggerimenti per la risoluzione dei problemi
<a name="ts-chat-custom-bot"></a>
+ `ResourceNotFoundException`: 

  Se viene restituito `ResourceNotFoundException` per il partecipante personalizzato quando chiami l'API `CreateParticipantConnection`, controlla se `CreateParticipantConnection` è stata chiamata entro 15 secondi dall'API `CreateParticipant`.
+ `AccessDeniedException`: 

  Se ricevi un errore `AccessDeniedException` e il ruolo del partecipante è CUSTOM\$1BOT, significa che il bot sta tentando di accedere agli allegati. Il ruolo di partecipante CUSTOM\$1BOT non è autorizzato ad accedere agli allegati caricati dai clienti.

# Configurare l’autenticazione del cliente in Amazon Connect per i contatti di chat
<a name="customer-auth"></a>

Puoi richiedere ai tuoi clienti di accedere e autenticarsi durante una chat. Ad esempio, ai clienti non autenticati che interagiscono con un chat bot può essere richiesto di accedere prima di essere instradati a un agente. 

Questa funzionalità integrata utilizza Amazon Connect Customer Profiles e [Amazon Cognito](https://aws.amazon.com/cognito/). Non sono previsti costi aggiuntivi per l’utilizzo di Customer Profiles, che è già [abilitato](enable-customer-profiles.md) nella tua istanza Amazon Connect se hai scelto le impostazioni predefinite durante la configurazione. Per informazioni sui prezzi di Amazon Cognito, consulta la pagina [Prezzi di Amazon Cognito](https://aws.amazon.com/cognito/pricing/).

Per configurare l’autenticazione del cliente per la chat:

1. [Abilita l’autenticazione del cliente](enable-connect-managed-auth.md#enable-customer-auth) per la tua istanza Amazon Connect.

1. [Abilitare il messaggio di autenticazione](enable-connect-managed-auth.md#enable-auth-message).

1. Aggiungi un blocco [Autentica il cliente](authenticate-customer.md) al tuo flusso.

Se il tuo contact center utilizza una soluzione di autenticazione esistente esterna ad Amazon Connect, consulta [Autenticazione pre-chat](pre-chat-auth.md).

# Abilitare l’autenticazione del cliente per i widget di comunicazione ospitati
<a name="enable-connect-managed-auth"></a>

Questo argomento spiega come configurare l’autenticazione se utilizzi il widget di comunicazione ospitato da Amazon Connect per la chat. Abilita l’autenticazione del cliente per la tua istanza Amazon Connect, quindi abilita un messaggio di autenticazione che mostra un link che apre un popup all’interfaccia utente ospitata da Amazon Cognito. 

## Policy IAM richieste
<a name="auth-page-iam-policies"></a>

Se utilizzi policy IAM personalizzate per gestire l’accesso alla console Amazon Connect, consulta [Autorizzazioni richieste per l'utilizzo di policy IAM personalizzate](security-iam-amazon-connect-permissions.md) per un elenco delle autorizzazioni necessarie per accedere alla pagina **Autenticazione del cliente**.

## Abilitare l’autenticazione del cliente nell’istanza Amazon Connect
<a name="enable-customer-auth"></a>

1. Apri la console Amazon Connect all'indirizzo [https://console.aws.amazon.com/connect/](https://console.aws.amazon.com/connect/).

1. Nella pagina delle istanze, seleziona l'alias dell'istanza. L'alias dell'istanza è anche il **nome dell'istanza** che appare nell'URL Amazon Connect. L'immagine seguente mostra la pagina **Istanze di contact center virtuali di Amazon Connect**, con un riquadro attorno all'alias dell'istanza.  
![\[La pagina delle istanze del contact center virtuale di Amazon Connect, l’alias dell’istanza.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/instance.png)

1. Nel menu di navigazione a sinistra, scegli **Applicazioni**, **Autenticazione del cliente**. Se non vedi questa opzione, potrebbe non essere disponibile nella tua AWS regione. Per ulteriori informazioni sui luoghi in cui è disponibile l’autenticazione del cliente, consulta [Disponibilità dell’autenticazione dei clienti per Regione](regions.md#customerauthentication_region). 

1. Nella pagina **Autenticazione del cliente**, scegli **Crea pool di utenti in Amazon Cognito**. Viene aperta la console Amazon Cognito.

1. Crea un nuovo pool di utenti con il tuo provider di identità. Per istruzioni, consulta [Nozioni di base sui pool di utenti](https://docs.aws.amazon.com/cognito/latest/developerguide/getting-started-user-pools.html) nella *Guida per gli sviluppatori di Amazon Cognito*. 
**Nota**  
Devi selezionare **Non generare segreto del client** quando configuri il client dell’app Amazon Cognito. Sono supportati solo i client dell’app Amazon Cognito senza segreti del client. Per ulteriori informazioni, consulta [Impostazioni specifiche dell’applicazione con i client dell’app](https://docs.aws.amazon.com/cognito/latest/developerguide/user-pool-settings-client-apps.html) nella *Guida per gli sviluppatori di Amazon Cognito*.

1. Dopo aver creato un pool di utenti Amazon Cognito, torna alla pagina **Autenticazione del cliente** e scegli **Associa pool di utenti**.

1. Nella sezione **Pool di utenti**, scegli il pool di utenti che hai creato dal menu a discesa, quindi scegli **Conferma**.

   In questo modo, il pool di utenti viene associato all’istanza Amazon Connect. Consente al blocco di flusso [Autentica il cliente](authenticate-customer.md) di accedere al pool di utenti.

1. Continua con il passaggio successivo:[Abilitare il messaggio di autenticazione](#enable-auth-message).

## Abilitare il messaggio di autenticazione
<a name="enable-auth-message"></a>

Per abilitare il messaggio di autenticazione, aggiungi la variabile snippet dei parametri di autenticazione alla fine dello snippet. Per informazioni sull’aggiunta di variabili snippet, consulta [Campi snippet del widget supportati in Amazon Connect che sono personalizzabili](supported-snippet-fields.md). Il codice seguente è un esempio di snippet dei parametri di autenticazione da aggiungere.

```
amazon_connect('authenticationParameters', { 
    redirectUri: 'your_redirect_url', // https://example.com 
    identityProvider: 'your_identity_provider_name' //optional
 });
```

Dove:
+ `redirectUri` è l’URI di reindirizzamento che hai configurato nel tuo gestore dell’identità digitale e in Amazon Cognito. È qui che il cliente viene indirizzato automaticamente dopo l’accesso. In questa pagina puoi controllare i parametri URL e se sono presenti un codice e uno stato, puoi chiamare l'[UpdateParticipantAuthentication](https://docs.aws.amazon.com/connect/latest/APIReference/API_UpdateParticipantAuthentication.html)API con quei valori. Al termine della chiamata API, chiudi il popup; il cliente torna all’esperienza di chat.
+ `identityProvider` è il gestore dell’identità digitale che hai configurato in Amazon Cognito. Questo campo è facoltativo. Se si specifica un valore, il link di accesso indirizza automaticamente il cliente alla pagina di accesso del gestore dell’identità digitale anziché alla pagina di accesso gestita da Amazon Cognito, in cui deve selezionare un gestore dell’identità digitale da utilizzare per l’accesso.

 Quando il flusso raggiunge il blocco [Autentica il cliente](authenticate-customer.md), puoi registrare un callback e archiviare localmente lo stato da convalidare nell’URI di reindirizzamento, come mostrato nel seguente frammento di codice di esempio:

```
amazon_connect('registerCallback', {
       'AUTHENTICATION_INITIATED' : (eventName, data) => {
            console.log(data.state)
        },
      });
```

Dopo aver abilitato l’autenticazione del cliente, aggiungi un blocco [Autentica il cliente](authenticate-customer.md) al flusso. Questo blocco autentica i contatti di chat durante il flusso e li instrada verso percorsi specifici in base al risultato dell’autenticazione.

# Autenticazione pre-chat tramite l'API Amazon Connect StartChatContact
<a name="pre-chat-auth"></a>

I clienti che si autenticano nel sito web o nell’applicazione mobile prima di iniziare una chat possono essere riconosciuti come autenticati quando viene avviata una chat. È possibile farlo utilizzando l'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API.

Dopo che un cliente autenticato avvia una chat, imposta il suo stato utilizzando i parametri dell'[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API, come mostrato nel seguente frammento di codice:

```
"SegmentAttributes": {
    "connect:CustomerAuthentication" : { 
        "ValueMap": {
            "Status": {
                "ValueString": "AUTHENTICATED"
            }
        }
    },
    "CustomerId": "12345"
```

`CustomerId` è un campo facoltativo per identificare il cliente. Può trattarsi di un ID di Amazon Connect Customer Profiles o di un identificatore personalizzato di un sistema esterno, come un CRM.

# Abilita lo streaming di messaggi per la chat basata sull'intelligenza artificiale
<a name="message-streaming-ai-chat"></a>

Amazon Connect supporta lo streaming di messaggi per interazioni di chat basate sull'intelligenza artificiale. Le risposte degli agenti di intelligenza artificiale appaiono progressivamente man mano che vengono generate, migliorando l'esperienza del cliente durante le conversazioni.

Di seguito sono elencate le opzioni di integrazione, insieme alle caratteristiche di ciascuna opzione:
+ Agenti di Amazon Connect
  + Elimina i limiti di timeout di Amazon Lex
  + Fornisce messaggi di evasione durante l'elaborazione (ad esempio «Un momento mentre esamino il tuo account»)
  + Visualizza le risposte parziali con testo progressivo (bolla di testo in crescita)
+ Bot di terze parti tramite Amazon Lex o Lambda
  + Elimina i limiti di timeout di Amazon Lex
  + Comportamento standard di risposta ai bot

Le istanze create a partire da dicembre 2025 vengono automaticamente attivate per questa funzionalità. Per le istanze esistenti, è necessario abilitare lo streaming dei messaggi manualmente utilizzando l'API o tramite la console.

## Abilita lo streaming dei messaggi utilizzando l'API
<a name="message-streaming-enable-api"></a>

Utilizza l'[UpdateInstanceAttribute](https://docs.aws.amazon.com/connect/latest/APIReference/API_UpdateInstanceAttribute.html)API per abilitare lo streaming dei messaggi. Impostare l'attributo `MESSAGE_STREAMING` su `true`.

```
aws connect update-instance-attribute \
  --instance-id your-instance-id \
  --attribute-type MESSAGE_STREAMING \
  --value true
```

Per disattivarlo, imposta l'attributo su`false`.

## Abilita lo streaming dei messaggi tramite la console
<a name="message-streaming-enable-console"></a>

Per le istanze appena create, lo streaming dei messaggi è abilitato per impostazione predefinita.

Per le istanze esistenti:

1. Apri la console Amazon Connect e scegli la tua istanza.

1. Nel pannello di navigazione, scegli **Flows** > **Amazon Lex bots.**

1. Nella **configurazione dei bot Lex**, seleziona **Abilita lo streaming dei messaggi in Amazon Connect**.

**Nota**  
Quando abiliti lo streaming di messaggi utilizzando la console, l'`lex:RecognizeMessageAsync`autorizzazione richiesta viene aggiunta automaticamente alla politica basata sulle risorse degli alias del bot. Quando si utilizza l'API, è necessario aggiungere questa autorizzazione manualmente.

![\[Abilita l'opzione di streaming dei messaggi nella console Amazon Connect.\]](http://docs.aws.amazon.com/it_it/connect/latest/adminguide/images/message-streaming-ai-chat-enablement.png)


## Aggiorna le autorizzazioni del bot Lex
<a name="message-streaming-lex-permissions"></a>

Dopo aver abilitato lo streaming dei messaggi, Amazon Connect necessita dell'autorizzazione per chiamare l'API Amazon Lex:

```
lex:RecognizeMessageAsync
```

È necessario aggiornare la policy basata sulle risorse per ogni alias bot di Amazon Lex utilizzato dall'istanza Amazon Connect.

### Quando aggiornare la politica basata sulle risorse del bot
<a name="message-streaming-when-to-update"></a>
+ **Nuove istanze**: per impostazione predefinita, qualsiasi alias bot di Amazon Lex appena associato avrà `lex:RecognizeMessageAsync` la sua politica sugli alias.
+ **Istanze esistenti con bot esistenti**: se l'istanza utilizzava in precedenza Amazon Lex e ora abiliti lo streaming di messaggi, devi aggiornare la policy basata sulle risorse su tutti gli alias bot di Amazon Lex associati per includere la nuova autorizzazione.

### Frammento di esempio per la politica basata sulle risorse degli alias del bot Lex
<a name="message-streaming-rbp-example"></a>

```
{
  "Version": "2012-10-17",		 	 	 
  "Statement": [
    {
      "Sid": "connect-us-west-2-MYINSTANCEID",
      "Effect": "Allow",
      "Principal": {
        "Service": "connect.amazonaws.com"
      },
      "Action": [
        "lex:RecognizeMessageAsync",
        "lex:RecognizeText",
        "lex:StartConversation
      ],
      "Resource": "arn:aws:lex:us-west-2:123456789012:bot-alias/MYBOT/MYBOTALIAS",
      "Condition": {
        "StringEquals": {
          "AWS:SourceAccount": "123456789012"
        },
        "ArnEquals": {
          "AWS:SourceArn": "arn:aws:connect:us-west-2:123456789012:instance/MYINSTANCEID"
        }
      }
    }
  ]
}
```

Puoi aggiungere questa autorizzazione chiamando l'[UpdateResourcePolicy](https://docs.aws.amazon.com/lexv2/latest/APIReference/API_UpdateResourcePolicy.html)API Amazon Lex per aggiornare la policy basata sulle risorse degli alias bot di Amazon Lex in modo da includere l'`lex:RecognizeMessageAsync`azione per la risorsa ARN dell'istanza Amazon Connect.

**Importante**  
Al momento questa funzionalità non supporta la ramificazione verso lo stesso blocco di [Blocco di flusso in Amazon Connect: Recupera input cliente](get-customer-input.md) flusso o il riutilizzo di un bot Amazon Lex con lo stesso alias in un altro blocco di input **Get customer**. Crea invece un nuovo blocco di **input Get customer** utilizzando un alias bot Amazon Lex diverso.

## Limiti di timeout
<a name="message-streaming-timeout-limits"></a>

I seguenti limiti di timeout si applicano alle esperienze di chat:
+ **Esperienza di chat standard: timeout** di 10 secondi
+ **Streaming di chat**: timeout di 60 secondi

# Abilita la redazione dei dati sensibili e l'elaborazione dei messaggi durante il volo
<a name="redaction-message-processing"></a>

Amazon Connect supporta l'elaborazione dei messaggi che intercetta e modifica i messaggi di chat prima che raggiungano qualsiasi partecipante. Questa funzionalità consente l'oscuramento automatico dei dati sensibili e l'elaborazione personalizzata dei messaggi, aiutando le aziende a mantenere gli standard di conformità e sicurezza.

Di seguito sono elencate le opzioni di elaborazione, insieme alle caratteristiche di ciascuna opzione:
+ Redazione integrata dei dati sensibili
  + Rileva e rimuove automaticamente i numeri di carta di credito, i numeri di previdenza sociale e altre informazioni personali
  + Supporta più lingue, tra cui varianti in inglese, francese, portoghese, tedesco, italiano e spagnolo. Per un elenco delle lingue supportate dall'oscuramento di Contact Lens, consulta [Lingue supportate dalle funzionalità di Amazon Connect](supported-languages.md).
  + Scegli di oscurare alcune o tutte le entità di dati sensibili
  + Sostituiscili con segnaposti generici ([PII]) o segnaposto specifici per entità ([NOME], [CREDIT\$1CARD])
+ Processori di messaggi personalizzati (tramite Lambda). Per ulteriori informazioni, consulta [Cos'è Lambda](https://docs.aws.amazon.com/lambda/latest/dg/welcome.html)? nella AWS *Lambda Developer's Guide.*
  + Integra servizi di terze parti per la traduzione linguistica
  + Applica il filtro contro le parolacce
  + Trasforma i messaggi utilizzando i servizi AI/LLM 
  + Implementa modifiche ai messaggi specifiche per l'azienda

Per configurare l'elaborazione dei messaggi, definisci le regole di redazione nel blocco **Set recording and analytics behavior**. Per ulteriori informazioni, consulta [Abilitazione dell'oscuramento dei dati sensibili](enable-analytics.md#enable-redaction). Puoi anche specificare una funzione Lambda per l'elaborazione personalizzata.

Il tuo processore personalizzato Lambda accetterà un JSON di input nel seguente formato:

```
{
  "version": "1.0",
  "instanceId": "string",
  "associatedResourceArn": "string",
  "chatContent": {
    "absoluteTime": "string",
    "content": "string",
    "contentType": "string",
    "id": "string",
    "participantId": "string",
    "displayName": "string",
    "participantRole": "string",
    "initialContactId": "string",
    "contactId": "string"
  }
}
```

E genera un JSON nel seguente formato:

```
{
  "status": "string", // "PROCESSED"|"APPROVED"|"FAILED"|"REJECTED"
  "result": {
    "processedChatContent": {
      "content": "string",
      "contentType": "string" // "text/plain"|"text/markdown"|"application/json"
    }
  }
}
```

Il contenuto della chat elaborato sostituirà il messaggio originale una volta pubblicato ai partecipanti alla chat.