Estensione del client Web

È possibile aggiornare, modificare e personalizzare l'aspetto del client Web utilizzando il proprio codice HTML, CSS o JavaScript dall'interno del browser.

È possibile usufruire delle estensioni per apportare modifiche visive al client Web e personalizzare l'applicazione. Il client Web ospita il codice HTML o CSS personalizzato, rendendo più semplice modificarlo e supportarlo.

È possibile ottenere ulteriori informazioni su:

• Aggiunta di un'estensione

• Esempio di estensione

Aggiunta di un'estensione

Prima di procedere, tenere presente che sebbene Host Access for the Cloud offra la possibilità di pianificare e utilizzare codice personalizzato, il supporto per tale codice deve essere fornito dal team che lo ha prodotto.

Quando si aggiungono le estensioni al client Web, le modifiche apportate sono visibili a tutti gli utenti e vengono applicate a tutte le sessioni.

Per aggiungere un'estensione

1. Aprire <directory-installazione>/sessionserver/microservices/sessionserver/service.yml.

2. Aggiungere extensions_enabled al valore esistente della proprietà SPRING_PROFILES_ACTIVE. Utilizzare una virgola per separare i valori.

   Ad esempio:

   env:
     - name: SPRING_PROFILES_ACTIVE
       value: tls,extensions_enabled
   

3. Riavviare il server di sessione.

4. Creare <directory-installazione>/sessionserver/microservices/sessionserver/extensions/client/index.html come punto di entrata. Questo è il momento in cui deve essere aggiunto eventuale codice HTML, CSS o JavaScript (inclusi i riferimenti agli script esterni).

Come rendere le estensioni disponibili senza l'autenticazione client

I file all'interno della directory /client sono protetti con il livello di autenticazione selezionato in MSS.

Per condividere i file, senza necessità dell'autenticazione:

Creare <directory-installazione>/sessionserver/microservices/sessionserver/extensions/public/ Inserire il codice in tale directory, chiamandolo utilizzando l'URL /public/*

Esempio di estensione

In questo esempio, una volta che le estensioni sono state abilitate (vedere il passaggio 2 riportato sopra), è possibile aggiungere codice JavaScript e CSS personalizzato per modificare il colore dei caratteri del titolo dei menu e stampare il testo nella console JavaScript.

Verranno creati tre file: custom.css, custom.js e index.html

Passaggio 1

Individuare il file index.html creato nel passaggio 4. Nella stessa posizione andranno inseriti i file delle estensioni, creando in tal modo un punto di entrata:

<!-- Define the link to the external style sheet -->
<link href="client/custom.css" rel="stylesheet">
<!-- Define the external JavaScript file -->
<script src="client/custom.js"></script>

Passaggio 2

Modificare il colore delle etichette di menu da nero (default) ad arancione:

Creare custom.css per modificare il colore in arancione:

/* Change link text to Orange */
a span {
    color: #ff5d28;
}

Passaggio 3

Creare il file custom.js per inviare il testo alla console JavaScript:

//Print message to the JavaScript console
console.log('Hello World!');

Passaggio 4

Quando i file sono a posto, <directory-installazione>/sessionserver/microservices/sessionserver/extensions/client/index.html, i risultati dovrebbero avere il seguente aspetto:

E nella console di JavaScript sarà visibile il testo "Hello World":

Maggiori informazioni:

Documentazione dell'API HACloud