Nota:

l'interfaccia utente di Dreamweaver CC e versioni successive è stata semplificata. Di conseguenza, potreste non trovare alcune delle opzioni descritte in questo articolo in Dreamweaver CC e versioni successive. Per ulteriori informazioni, consultate questo articolo.

Utilizzare XML e XSL con le pagine web

XML è l'acronimo di Extensible Markup Language, un linguaggio che permette di strutturare le informazioni. Analogamente al linguaggio HTML, XML consente di strutturare i dati mediante i tag, ma i tag XML non sono predefiniti come nel caso di HTML. Al contrario, nel linguaggio XML potete creare tag personalizzati in base alla struttura specifica che desiderate applicare ai dati (schema). I tag vengono nidificati all'interno di altri tag, creando uno schema gerarchico. Come la maggior parte dei tag HTML, tutti i tag di uno schema XML prevedono un tag di apertura e uno di chiusura.

L'esempio seguente illustra la struttura di base di un file XML:

<?xml version=“1.0”> 
<mybooks> 
    <book bookid=“1”> 
        <pubdate>03/01/2004</pubdate> 
        <title>Displaying XML Data with Adobe Dreamweaver</title> 
        <author>Charles Brown</author> 
    </book> 
    <book bookid=“2”> 
        <pubdate>04/08/2004</pubdate> 
        <title>Understanding XML</title> 
        <author>John Thompson</author> 
    </book> 
</mybooks>

In questo esempio, ogni tag <book> di livello superiore contiene tre tag di livello inferiore: <pubdate>, <title> e <author>. Ciascun tag <book> è tuttavia di livello inferiore rispetto al tag <mybooks>, che si trova a un livello più alto nello schema gerarchico. Potete denominare e strutturare i tag XML nel modo desiderato, a condizione che siano nidificati correttamente e che per ogni tag di apertura sia presente il tag di chiusura corrispondente.

I documenti XML non contengono alcuna formattazione, bensì unicamente dati strutturati. Una volta definito uno schema XML, potete utilizzare il linguaggio XSL (Extensible Stylesheet Language) per visualizzare le informazioni. Così come i fogli di stile CSS consentono di formattare i file HTML, il linguaggio XSL permette di formattare i dati XML. Potete definire stili, elementi di pagina, layout e così via all'interno di un file XSL e collegarlo a un file XML in modo che, quando un utente visualizza i dati XML in un browser, questi vengano formattati secondo le definizioni presenti nel file XSL. Il contenuto (i dati XML) e la presentazione (definita nel file XSL) sono completamente separati, consentendo all'utente un maggiore controllo sul modo in cui le informazioni sono visualizzate in una pagina Web. In sintesi, l'XSL è una tecnologia di presentazione per i file XML, in cui l'output primario è una pagina HTML.

XSLT (Extensible Stylesheet Language Transformations) è un sottoinsieme del linguaggio XSL che consente di visualizzare effettivamente i dati XML su una pagina web e di trasformarli, tramite gli stili XSL, in informazioni leggibili in formato HTML. Potete utilizzare Dreamweaver per creare pagine XSLT che permettono di eseguire trasformazioni XSL utilizzando un server applicazioni o un browser. Quando si esegue una trasformazione XSL server-side, è il server che si occupa di trasformare i dati XML e XSL e di visualizzarli sulla pagina. Nel caso di una trasformazione client-side, invece, questa attività viene eseguita da un browser, ad esempio Internet Explorer.

L'approccio che si decide di adottare (trasformazioni server-side piuttosto che client-side) dipende dal risultato che si intende ottenere, dalle tecnologie a disposizione, dal livello di accesso ai file XML di origine e da altri fattori. Entrambi gli approcci hanno vantaggi e svantaggi. Ad esempio, le trasformazioni server-side funzionano con qualsiasi browser mentre le trasformazioni client-side sono utilizzabili solo con i browser più recenti (Internet Explorer 6, Netscape 8, Mozilla 1.8 e Firefox 1.0.2). Le trasformazioni server-side consentono la visualizzazione dinamica di dati XML dal proprio server o da qualsiasi altra posizione sul Web, mentre i dati XML utilizzati dalle trasformazioni client-side devono essere presenti in locale sul proprio server Web. Infine, le trasformazioni server-side richiedono che le pagine vengano gestite da un server applicazioni, mentre per le trasformazioni client-side è sufficiente un server Web.

Per un'esercitazione sull'uso di XML, vedete www.adobe.com/go/vid0165_it.

Trasformazioni XSL server-side

Dreamweaver fornisce dei metodi per la creazione di pagine XSLT che consentono di eseguire trasformazioni XSL server-side. Quando un server applicazioni esegue una trasformazione XSL, il file contenente i dati XML può trovarsi sul server o dovunque sul Web. Inoltre, i dati trasformati possono essere visualizzati da qualsiasi browser. La distribuzione di pagine per le trasformazioni server-side, però, è piuttosto complessa e richiede che si abbia accesso a un server applicazioni.

Quando si utilizzano le trasformazioni XSL server-side, Dreamweaver consente di creare pagine XSLT che generano documenti HTML completi (pagine XSLT intere) oppure frammenti XSLT che generano solo una parte di un documento HTML. Una pagina XSLT intera è simile a una pagina HTML standard: contiene un tag <body> e un tag <head> e consente di visualizzare una combinazione di dati HTML e XML nella pagina. Un frammento XSLT è una sequenza di codice, contenuta in un documento distinto, nella quale sono visualizzati dati XML. A differenza di una pagina XSLT intera, è un file indipendente che non contiene i tag <body> o <head>. Se desiderate visualizzare dati XML in una pagina indipendente, è necessario creare una pagina XSLT intera e associarle i dati XML. Per visualizzare invece i dati XML in una particolare sezione di una pagina dinamica esistente, ad esempio la pagina principale di un negozio di articoli sportivi, con i risultati delle partite provenienti da un feed RSS visualizzati su un lato, è necessario creare un frammento XSLT e inserirne i riferimenti nella pagina dinamica. La creazione di frammenti XSLT e il loro utilizzo insieme ad altre pagine dinamiche per consentire la visualizzazione di dati XML costituiscono lo scenario più comune.

Il primo passaggio nella creazione di questo tipo di pagine è la creazione di un frammento XSLT. si tratta di un file separato che contiene il layout, la formattazione e le altre informazioni per i dati XML da visualizzare nella pagina dinamica. Una volta creato un frammento XSLT, potete inserire un riferimento ad esso nella pagina dinamica (ad esempio una pagina PHP o ColdFusion). Tale riferimento funziona in modo analogo a una SSI (Server Side Include): i dati XML formattati (il frammento) sono contenuti in un file separato e nella vista Progettazione, sulla pagina dinamica vera e propria appare un segnaposto per dati XML. Quando un browser richiede la pagina dinamica che contiene il riferimento al frammento, il server elabora l'istruzione inclusa e crea un nuovo documento in cui viene visualizzato il contenuto formattato del frammento invece del segnaposto per dati XML.

Trasformazioni XSL server-side
A. Il browser richiede una pagina dinamica. B. Il server web individua la pagina e la trasmette al server applicazioni. C. Il server applicazioni analizza la pagina alla ricerca di istruzioni e ottiene il frammento XSLT. D. Il server applicazioni esegue la trasformazione (legge il frammento XSLT, ottiene e formatta i dati xml). E. Il server applicazioni inserisce il frammento trasformato nella pagina e lo restituisce al server Web. F. Il server web invia al browser la pagina terminata. 

Potete utilizzare il comportamento server Trasformazione XSL per inserire un riferimento a un frammento XSLT in una pagina dinamica. Quando si inserisce il riferimento, Dreamweaver crea nella cartella principale del sito una cartella denominata includes/MM_XSL Transform/ che contiene un file di libreria runtime. Al momento di trasferire i dati XML specificati, il server applicazioni utilizza le funzioni definite in questo file. Grazie a questo file potete reperire i dati XML e i frammenti XSLT, effettuare la trasformazione XSL e visualizzare i risultati sulla pagina Web.

Il file contenente il frammento XSLT, il file dei dati XML e la libreria runtime generata da Dreamweaver devono trovarsi tutti sullo stesso server per consentire una corretta visualizzazione della pagina. Se selezionate un file XML remoto come origine dei dati, ad esempio proveniente da un feed RSS, tale file deve ovviamente trovarsi in un'altra posizione su Internet.

Potete anche utilizzare Dreamweaver per creare pagine XSLT intere da utilizzare per trasformazioni server-side. Una pagina XSLT intera funziona esattamente nello stesso modo di un frammento XSLT, tranne per il fatto che quando si inserisce il riferimento alla pagina intera XSLT per mezzo del comportamento server Trasformazione XSL, si inserisce l'intero contenuto di una pagina HTML. Quindi, prima di inserire il riferimento dovete rimuovere tutto il codice HTML dalla pagina dinamica (la pagina .cfm, .php o .asp che funge da pagina contenitore).

Dreamweaver supporta le trasformazioni XSL per le pagine ColdFusion, ASP e PHP.

Nota:

è necessario che il server sia correttamente configurato per effettuare trasformazioni server-side. Per altre informazioni, consultate l'amministratore del server.

Trasformazioni XSL client-side

Potete eseguire trasformazioni XSL client-side senza ricorrere a un server applicazioni. Dreamweaver consente di creare una pagina XSLT intera che svolge questa operazione, ma per le trasformazioni client-side è richiesta la modifica del file XML contenente i dati da visualizzare. Inoltre, le trasformazioni client-side funzionano solo con i browser più recenti (Internet Explorer 6, Netscape 8, Mozilla 1.8 e Firefox 1.0.2). Per ulteriori informazioni sui browser che supportano o non supportano le trasformazioni XSL, vedete www.w3schools.com/xsl/xsl_intro.asp.

In primo luogo, create una pagina XSLT intera e associatela a un'origine dati XML. (Dreamweaver richiede che l'origine dati venga collegata nel momento in cui si crea la nuova pagina.) Potete creare una pagina XSLT da zero oppure convertire una pagina HTML in una pagina XSLT. Quando si converte una pagina HTML in una pagina XSLT è necessario collegare un'origine dati XML per mezzo del pannello Associazioni (Finestra > Associazioni).

Una volta creata la pagina XSLT, dovete collegarla al file XML contenente i dati XML inserendo un riferimento alla pagina XSLT nel file XML stesso (nello stesso modo in cui si inserisce un riferimento a un foglio di stile CSS esterno nella sezione <head> di una pagina HTML). I visitatori del sito devono visualizzare in un browser il file XML non la pagina XSLT. Quando la pagina viene aperta dai visitatori, il browser effettua la trasformazione XSL e visualizza i dati XML, formattati mediante la pagina XSLT collegata.

Anche se vi sono alcune differenze, la relazione tra le pagine XSLT e XML collegate tra loro è concettualmente simile al modello CSS/HTML. All'interno di una pagina HTML, si utilizza un foglio di stile esterno per la formattazione di contenuti come il testo. La pagina HTML determina il contenuto e il codice CSS esterno, che non viene mai visualizzato dall'utente, ne definisce la presentazione. Con XSLT e XML, la situazione è invertita. Il file XML (che l'utente non vede mai nella sua forma grezza) determina il contenuto, mentre la pagina XSLT determina la presentazione. La pagina XSLT contiene le tabelle, il layout, la grafica e gli altri elementi normalmente inclusi nelle pagine HTML standard. Quando un utente visualizza il file XML in un browser, la pagina XSLT determina la formattazione del contenuto.

Trasformazioni XSL client-side
A. Il browser richiede il file XML. B. Il server risponde inviando il file XML al browser. C. Il browser legge la direttiva XML e chiama il file XSLT. D. Il server invia il file XSLT al browser. E. Il browser trasforma i dati XML e li visualizza nel browser. 

Quando si utilizza Dreamweaver per collegare una pagina XSLT a una pagina XML, il codice necessario viene inserito da Dreamweaver nella parte superiore della pagina XML. Se siete proprietari della pagina XML da collegare (vale a dire se il file risiede esclusivamente sul vostro server web), tutto ciò che dovete fare è utilizzare Dreamweaver per inserire il codice che collega tra loro le due pagine. Quando si è proprietari del file XML, le trasformazioni XSL eseguite dal client sono totalmente dinamiche. Quindi, ogni volta che aggiornate i dati nel file XML, l'output HTML creato mediante la pagina XSLT collegata viene automaticamente aggiornato con le nuove informazioni.

Nota:

i file XML e XSL utilizzati per le trasformazioni client-side devono trovarsi nella stessa directory. In caso contrario, il file XML viene letto dal browser e in esso viene trovata la pagina XSLT per la trasformazione, ma non è possibile individuare le risorse (fogli di stile, immagini e così via) definite dai collegamenti relativi nella pagina XSLT.

Se non siete titolari della pagina XML che state collegando (ad esempio, se desiderate utilizzare i dati XML di un feed RSS sul Web), il flusso di lavoro sarà leggermente più complesso. Per eseguire le trasformazioni client-side per mezzo dei dati XML di un'origine esterna, è necessario innanzitutto scaricare il file di origine XML per la stessa directory in cui risiede la pagina XSLT. Una volta che la pagina XML si trova nel proprio sito locale, potete utilizzare Dreamweaver per aggiungere il codice appropriato che la collega alla pagina XSLT, e pubblicare entrambe le pagine (il file XML scaricato e la pagina XSLT collegata) sul server web. Quando l'utente visualizza la pagina XML in un browser, la pagina XSLT ne formatta il contenuto, proprio come nell'esempio precedente.

Lo svantaggio di eseguire le trasformazioni XSL client-side su dati XML che derivano da un'origine esterna sta nel fatto che i dati XML sono solo parzialmente “dinamici”. Il file XML scaricato e modificato è semplicemente un'istantanea del file presente sul Web. Se il file XML originale sul Web viene modificato, è necessario scaricarlo di nuovo, collegarlo alla pagina XSLT e ripubblicarlo sul server Web. Il browser riproduce soltanto i dati ricevuti dal file XML sul server Web, non i dati inclusi nel file di origine XML originale.

Dati XML ed elementi ripetuti

L'oggetto XSLT Area ripetuta consente di visualizzare gli elementi ripetuti di un file XML all'interno di una pagina. Qualsiasi area contenente un segnaposto per dati XML può essere convertita in un'area ripetuta. Tuttavia, gli esempi più comuni sono una tabella, una riga o una serie di righe di tabella.

L'esempio seguente mostra la modalità di applicazione dell'oggetto XSLT Area ripetuta a una tabella contenente il menu di un ristorante. La tabella iniziale mostra tre elementi diversi per lo schema XML: piatto, descrizione e prezzo. Quando si applica l'oggetto XSLT Area ripetuta alla riga della tabella e la pagina viene elaborata dal server applicazioni o da un browser, la tabella viene ripetuta con dati univoci inseriti in ogni nuova riga della tabella.

Viene applicato l'oggetto XSLT Area ripetuta

Quando applicate un oggetto XSLT Area ripetuta a un elemento nella finestra del documento, viene visualizzato un contorno sottile, tratteggiato e di colore grigio sull'area ripetuta. Quando visualizzate l'anteprima del lavoro in un browser (File > Anteprima nel browser), il contorno grigio scompare e la selezione si espande per visualizzare nel file XML gli elementi ripetuti specificati.

Quando aggiungete un oggetto XSLT Area ripetuta alla pagina, la lunghezza del segnaposto dati XML viene troncata nella finestra del documento. Questo perché Dreamweaver aggiorna l'XPath (linguaggio XML Path) per il segnaposto dati XML, in modo che sia relativo al percorso dell'elemento ripetuto.

Ad esempio, il codice che segue serve per creare una tabella contenente due segnaposto dinamici, senza che venga applicato alla tabella un oggetto XSLT Area ripetuta:

<table width="500" border="1"> 
    <tr> 
        <td><xsl:value-of select="rss/channel/item/title"/></td> 
    </tr> 
    <tr> 
        <td><xsl:value-of select="rss/channel/item/description"/></td> 
    </tr> 
</table>

Il codice che segue è per la stessa tabella ma con l'applicazione dell'oggetto XSLT Area ripetuta:

<xsl:for-each select="rss/channel/item"> 
    <table width="500" border="1"> 
        <tr> 
            <td><xsl:value-of select="title"/></td> 
        </tr> 
        <tr> 
            <td><xsl:value-of select="description"/></td> 
        </tr> 
    </table> 
</xsl:for-each>

Nel precedente esempio, Dreamweaver ha aggiornato automaticamente l'XPath degli elementi compresi nell'Area ripetuta, ovvero titolo e descrizione, in modo da renderli relativi all'XPath solo nei tag di chiusura <xsl:for-each> anziché in tutto il documento.

Dreamweaver genera espressioni XPath relative al contesto anche in altri casi. Ad esempio, se trascinate un segnaposto dati XML su una tabella sulla quale è già stato applicato un oggetto XSLT Area ripetuta, Dreamweaver visualizza automaticamente l'XPath relativo all'XPath esistente nei tag di chiusura <xsl:for-each>.

Anteprima dati XML

Quando utilizzate la funzione Anteprima nel browser (File > Anteprima nel browser) per visualizzare un'anteprima dei dati XML inseriti in un frammento XSLT o in una pagina XSLT intera, il motore che effettua la trasformazione XSL cambia in base alla situazione. Per pagine dinamiche contenenti frammenti XSLT, la trasformazione viene sempre eseguita dal server applicazioni. In altri casi, la trasformazione può essere eseguita da Dreamweaver o dal browser.

La tabella che segue riassume le possibili situazioni e i motori che effettuano le rispettive trasformazioni quando si utilizza Anteprima nel browser:

Tipo di pagina visualizzata nel browser Trasformazione dati eseguita da
Pagina dinamica contenente il frammento XSLT Server applicazioni
Frammento XSLT o pagina XSLT intera Dreamweaver
File XML con collegamento a una pagina XSLT intera Browser

Gli argomenti seguenti forniscono indicazioni utili per determinare i metodi corretti di anteprima, a seconda delle proprie necessità:

Anteprima di pagine per trasformazioni server-side

In caso di trasformazioni server-side, i contenuti che vengono mostrati al visitatore sono trasformati dal proprio server applicazioni. Quando si compongono XSLT e pagine dinamiche da utilizzare con trasformazioni server-side, è sempre preferibile effettuare l'anteprima della pagina dinamica che contiene il frammento XSLT piuttosto che del frammento XSLT stesso. Nello scenario iniziale si fa uso del server applicazioni, che garantisce che l'anteprima sia coerente con ciò che i visitatori del sito vedranno una volta che la pagina sarà pubblicata. Nel secondo scenario, la trasformazione viene eseguita da Dreamweaver e potrebbe dare risultati leggermente incongruenti. Potete utilizzare Dreamweaver per effettuare l'anteprima di un frammento XSLT mentre lo state generando, ma per avere un'idea più precisa della visualizzazione dei dati dovete usare il server applicazioni per visualizzare la pagina dinamica dopo aver inserito il frammento XSLT.

Anteprima di pagine per trasformazioni client-side

In caso di trasformazioni client-side, i contenuti che vengono mostrati al visitatore sono trasformati da un browser. A tale scopo, occorre aggiungere un collegamento dal file XML alla pagina XSLT. Aprendo il file XML in Dreamweaver e visualizzandone l'anteprima in un browser, si forza il browser a caricare il file XML e a eseguire la trasformazione. Questo consente di ottenere gli stessi risultati di un visitatore del sito.

Se utilizzate questo approccio, tuttavia, è più difficile eseguire il debug della pagina, perché il browser trasforma il codice XML e genera il codice HTML internamente. Se selezionate l'opzione Visualizza sorgente del browser per effettuare il debug del codice HTML generato, sarà possibile visualizzare soltanto il codice XML ricevuto dal browser, non tutto il codice HTML da cui è stata generata la pagina. Per vedere il codice HTML completo quando si visualizza il codice di origine, dovete visualizzare l'anteprima della pagina XSLT in un browser.

Anteprima di pagine XSLT intere e di frammenti XSLT

Quando si creano pagine XSLT intere e frammenti XSLT, può essere necessario effettuare anteprime per verificare che i dati vengano visualizzati correttamente. Se utilizzate la funzione Anteprima nel browser per la visualizzazione di una pagina XSLT intera o di un frammento XSLT, Dreamweaver effettua la trasformazione per mezzo di un motore di trasformazione interno. Questo metodo consente di ottenere risultati rapidi e rende più facile la costruzione e il debug della pagina. Consente anche di visualizzare il codice HTML completo selezionando l'opzione Visualizza sorgente nel browser.

Nota:

questo metodo di anteprima viene utilizzato soprattutto quando si inizia a costruire pagine XSLT, indipendentemente dal fatto che si utilizzi il client o il server per effettuare le trasformazioni dei dati.

Questo prodotto è concesso in licenza in base alla licenza di Attribuzione-Non commerciale-Condividi allo stesso modo 3.0 Unported di Creative Commons.  I post su Twitter™ e Facebook non sono coperti dai termini di Creative Commons.

Note legali   |   Informativa sulla privacy online