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à.

# Come funziona la protezione dall'inclinazione
<a name="skew-protection-headers"></a>

Nella maggior parte dei casi, il comportamento predefinito del cookie \_dpl soddisferà le tue esigenze di protezione dagli skew. Tuttavia, nei seguenti scenari avanzati, la protezione dall'inclinazione è abilitata meglio utilizzando i parametri `X-Amplify-Dpl` header e query. `dpl`
+ Caricamento del sito Web in più schede del browser contemporaneamente
+ Utilizzo di addetti all'assistenza

Amplify valuta la richiesta in arrivo nel seguente ordine quando determina il contenuto da fornire al client:

1. **`X-Amplify-Dpl`intestazione**: le applicazioni possono utilizzare questa intestazione per indirizzare le richieste a una specifica distribuzione Amplify. Questa intestazione della richiesta può essere impostata utilizzando il valore di. `process.env.AWS_AMPLIFY_DEPLOYMENT_ID`

1. **`dpl`parametro di query**: le applicazioni Next.js imposteranno automaticamente il parametro di query \_dpl per le richieste agli asset con impronte digitali (file con estensione js e css).

1. **\_dpl cookie**: è l'impostazione predefinita per tutte le applicazioni protette da skew. Per un browser specifico, lo stesso cookie viene inviato per ogni scheda o istanza del browser che interagisce con un dominio.

   Tieni presente che se in diverse schede del browser sono caricate versioni diverse di un sito Web, il cookie \_dpl viene condiviso da tutte le schede. In questo scenario, non è possibile ottenere una protezione totale dall'inclinazione con il cookie \_dpl e dovresti prendere in considerazione l'utilizzo dell'intestazione per la protezione dall'inclinazione. `X-Amplify-Dpl`

## X-Amplify-Dpl esempio di intestazione
<a name="skew-protection-header-example"></a>

L'esempio seguente mostra il codice per una pagina SSR Next.js che accede alla protezione dall'inclinazione tramite l'intestazione. `X-Amplify-Dpl` La pagina esegue il rendering del contenuto in base a uno dei suoi percorsi api. La distribuzione da servire al percorso api viene specificata utilizzando l'`X-Amplify-Dpl`intestazione, che è impostata sul valore di. `process.env.AWS_AMPLIFY_DEPLOYMENT_ID`

```
import { useEffect, useState } from 'react';

export default function MyPage({deploymentId}) {
    const [data, setData] = useState(null);

    useEffect(() => {
        fetch('/api/hello', {
            headers: {
                'X-Amplify-Dpl': process.env.AWS_AMPLIFY_DEPLOYMENT_ID
            },
        })
        .then(res => res.json())
        .then(data => setData(data))
        .catch(error => console.error("error", error)) 
    }, []);

    return <div>
        {data ? JSON.stringify(data) : "Loading ... " }
    </div>
}
```