Esercitazione: Aggiungere la rete per la distribuzione di contenuti di Azure a una web app dell'App Service di Azure

Questa esercitazione illustra come aggiungere la Rete per la distribuzione di contenuti di Azure a un'app Web nel Servizio app di Azure. Le app Web sono servizi per l'hosting di applicazioni Web, API REST e back-end mobili.

Di seguito è riportata la home page del sito HTML statico di esempio che viene usato:

Cosa impari:

Prerequisiti

Per completare questa esercitazione:

• Installare Git
• Installare l'interfaccia della riga di comando di Azure

Se non si ha un account Azure, creare un account gratuito prima di iniziare.

Creare l'app Web

Per creare l'app Web con la quale si lavora, seguire la guida introduttiva per HTML statico fino al passaggio Accedere all'app.

Accedere al portale di Azure

Aprire un browser e accedere al portale di Azure.

Ottimizzazione dell'accelerazione di un sito dinamico

Se si vuole ottimizzare l'endpoint della Rete per la distribuzione di contenuti per l'accelerazione del sito dinamico (DSA), è consigliabile usare il portale di Rete per la distribuzione di contenuti per creare il profilo e l'endpoint. L'ottimizzazione DSA migliora in modo misurabile le prestazioni delle pagine Web con contenuto dinamico. Per istruzioni su come ottimizzare un enpoint della Rete per la distribuzione di contenuti per DSA dal portale di rete per la distribuzione di contenuti, vedere Configurazione dell'enpoint della Rete per la distribuzione di contenuti per accelerare la distribuzione di file dinamici. In caso contrario, se non si vuole ottimizzare il nuovo endpoint, è possibile usare il portale dell'app Web per crearlo seguendo i passaggi descritti nella sezione successiva.

Creare un profilo e un endpoint della Rete per la distribuzione di contenuti

1. Nel riquadro di spostamento a sinistra selezionare Servizi app e quindi l'app creata nella guida introduttiva per siti HTML statici.

2. Nella pagina Servizio app all'interno della sezione Impostazioni, selezionare Networking> Rete CDN di Azure.

   

3. Nella pagina Rete per la distribuzione di contenuti di Azure specificare le impostazioni in Nuovo endpoint come indicato nella tabella.

   Impostazione	Valore suggerito	Descrizione
   Profilo della Rete per la distribuzione dei contenuti	myCDNProfile	Un profilo di rete per la distribuzione di contenuti è una raccolta di endpoint della rete per la distribuzione di contenuti con lo stesso piano tariffario.
   Piano tariffario	Rete per la distribuzione di contenuti Microsoft (versione classica)	Il piano tariffario specifica il provider e le funzionalità disponibili.
   Nome dell'endpoint della rete per la distribuzione di contenuti	Qualsiasi nome univoco nel dominio azureedge.net	Si accede alle risorse memorizzate nella cache nel dominio <nomeendpoint>.azureedge.net.

4. Selezionare Crea per creare un profilo di Rete per la distribuzione di contenuti. Azure crea il profilo e l'endpoint. Il nuovo endpoint viene visualizzato nell'elenco Endpoint e quando è stato messo in provisioning, lo stato è In esecuzione.

   

Testare l'endpoint della Rete per la distribuzione di contenuti

Dato che la propagazione della registrazione richiede tempo, l'endpoint non è disponibile immediatamente per l'uso. Per i profili Rete CDN di Azure Standard from Microsoft (classic), la propagazione viene generalmente completata entro 10 minuti.

L'app di esempio include un file index.html e le cartelle css, img e js che contengono altri asset statici. I percorsi di contenuto per tutti questi file sono gli stessi nell'endpoint della Rete per la distribuzione di contenuti. Entrambi gli URL seguenti, ad esempio, accedono al file bootstrap.css nella cartella css:

http://<appname>.azurewebsites.net/css/bootstrap.css

http://<endpointname>.azureedge.net/css/bootstrap.css

Usare un browser per passare all'URL seguente:

http://<endpointname>.azureedge.net/index.html

Viene visualizzata la stessa pagina eseguita in precedenza in un'app Web di Azure. La Rete per la distribuzione di contenuti di Azure ha recuperato gli asset dell'app Web di origine e li sta servendo dall'endpoint della Rete per la distribuzione di contenuti

Per assicurarsi che questa pagina sia memorizzata nella cache nella Rete per la distribuzione di contenuti, aggiornare la pagina. Affinché la Rete per la distribuzione di contenuti memorizzi nella cache il contenuto richiesto sono talvolta necessarie due richieste dello stesso asset.

Per altre informazioni sulla creazione di profili e endpoint della Rete per la distribuzione di contenuti di Azure, vedere Introduzione alla rete per la distribuzione di contenuti di Azure.

Ripulire la Rete per la distribuzione di contenuti

La Content Delivery Network (CDN) ricarica periodicamente le proprie risorse dall'app web di origine, basandosi sulla configurazione del time to live (TTL). La durata predefinita è di sette giorni.

Potrebbe essere talvolta necessario aggiornare la Rete per la distribuzione dei contenuti prima della scadenza del valore TTL, ad esempio quando si distribuisce contenuto aggiornato nell'app Web. Per attivare un aggiornamento, rimuovere manualmente le risorse della Rete per la distribuzione di contenuti.

In questa sezione dell'esercitazione, si distribuisce una modifica all'app Web e si svuota la rete di distribuzione dei contenuti per aggiornarne la cache.

Distribuire una modifica nell'app Web

Aprire il file index.html e aggiungere - V2 all'intestazione H1 come illustrato nell'esempio seguente:

<h1>Azure App Service - Sample Static HTML Site - V2</h1>

Eseguire il commit della modifica e distribuirla nell'applicazione web.

git commit -am "version 2"
git push azure main

Al termine della distribuzione, passare all'URL dell'app Web per visualizzare la modifica.

http://<appname>.azurewebsites.net/index.html

Se si passa all'URL dell'endpoint della Rete per la distribuzione di contenuti per la home page, non vengono visualizzate le modifiche perché la versione memorizzata nella cache nella Rete per la distribuzione di contenuti non è ancora scaduta.

http://<endpointname>.azureedge.net/index.html

Rimuovere la Rete per la distribuzione di contenuti nel portale

Per attivare la Rete per la distribuzione di contenuti per aggiornare la versione memorizzata nella cache, rimuovere la Rete per la distribuzione di contenuti.

1. Nel riquadro di spostamento a sinistra nel portale selezionare Gruppi di risorse e quindi il gruppo di risorse creato per l'app Web (myResourceGroup).

2. Nell'elenco delle risorse selezionare l'endpoint della Rete per la distribuzione di contenuti.

3. Nella parte superiore della pagina Endpoint selezionare Ripulisci.

   

4. Immettere i percorsi del contenuto che si vuole ripulire. È possibile passare un percorso file completo per ripulire un singolo file oppure un segmento di percorso per ripulire e aggiornare tutto il contenuto in una cartella. Poiché hai modificato index.html, assicurati che si trovi in uno dei percorsi. Nella parte inferiore della pagina selezionare Ripulisci.

   

Verificare che la Rete per la distribuzione di contenuti sia aggiornata

Attendere il completamento dell'elaborazione della richiesta di ripulitura, che in genere richiede qualche minuto. Per visualizzare lo stato corrente, selezionare l'icona a forma di campana nella parte superiore della pagina.

Quando si accede all'URL dell'endpoint della rete di distribuzione dei contenuti per index.html, viene visualizzato V2 aggiunto al titolo della home page, il che indica che la cache della rete di distribuzione è stata aggiornata.

http://<endpointname>.azureedge.net/index.html

Per altre informazioni, vedere Rimuovere un endpoint della Rete per la distribuzione di contenuti di Azure.

Usare le stringhe di query per il versionamento del contenuto

La Rete per la distribuzione di contenuti di Azure offre le opzioni di comportamento di memorizzazione nella cache seguenti:

• Ignora stringhe di query
• Disabilita la memorizzazione nella cache per le stringhe di query
• Memorizza nella cache tutti gli URL univoci

La prima è l'opzione predefinita, ovvero esiste una sola versione di un asset memorizzata nella cache indipendentemente dalla stringa di query nell'URL.

In questa sezione dell'esercitazione si modificherà il comportamento per memorizzare nella cache tutti gli URL univoci.

Modificare il comportamento della cache

1. Nella pagina Endpoint rete CDN del portale di Azure selezionare Cache.

2. Selezionare Memorizza nella cache tutti gli URL univoci nell'elenco a discesa Comportamento di memorizzazione nella cache della stringa di query.

3. Seleziona Salva.

   

Verificare che gli URL univoci vengano memorizzati nella cache separatamente

In un browser, passare alla home page nell'endpoint della rete per la distribuzione dei contenuti e includere una stringa di query:

http://<endpointname>.azureedge.net/index.html?q=1

La rete per la distribuzione di contenuti di Azure restituisce il contenuto corrente dell'app Web, che include V2 nell'intestazione.

Per assicurarsi che questa pagina sia memorizzata nella cache nella Rete per la distribuzione di contenuti, aggiornare la pagina.

Aprire index.html, modificare V2 in V3 e quindi distribuire la modifica.

git commit -am "version 3"
git push azure main

In un browser, vai all'URL dell'endpoint della rete per la distribuzione di contenuti con una nuova stringa di query, ad esempio q=2. La Rete per la distribuzione di contenuti di Azure ottiene il file index.html corrente e visualizza V3. Tuttavia, se si accede all'endpoint della rete per la distribuzione di contenuti con la stringa di query q=1, viene visualizzato V2.

http://<endpointname>.azureedge.net/index.html?q=2

http://<endpointname>.azureedge.net/index.html?q=1

Questo output mostra che ogni stringa di query viene trattata in modo diverso:

• Poiché q=1 è stata usata in precedenza, vengono restituiti i contenuti memorizzati nella cache (V2).
• q=2 è nuovo, quindi vengono recuperati e restituiti i contenuti più recenti dell'app Web (V3).

Per altre informazioni, vedere Controllare il comportamento di memorizzazione nella cache della Rete per la distribuzione di contenuti di Azure con stringhe di query.

Pulire le risorse

Nei passaggi precedenti sono state create risorse di Azure in un gruppo di risorse. Se si ritiene che queste risorse non saranno necessarie in futuro, eliminare il gruppo di risorse eseguendo questo comando in Cloud Shell:

az group delete --name myResourceGroup

L'esecuzione del comando può richiedere un minuto.

Passaggi successivi

Cosa hai imparato:

Informazioni su come ottimizzare le prestazioni della Rete per la distribuzione di contenuti negli articoli seguenti: