Pubblicato il 10/05/17 - aggiornato il  | 4 commenti :

Firebase come hosting gratuito di file CSS e javascript.

Come caricare file CSS, Javascript e XML su Firebase con l'account Google e ottenerne il link diretto di download da usare nei Temi e Widget.
Gli utenti di Blogger hanno da sempre la necessità di caricare su server esterni dei file da usare nel Tema o nei widget del loro sito. Chi ha a disposizione uno spazio personale come un dominio acquistato può usare quello per caricarvi i file. Ho anche illustrato come procedere con un nome a dominio acquistato su Tophost ma a parte la grafica il procedimento è lo stesso per tutti i provider.

Chi abbia un blog gratuito del tipo nomeblog.blogspot.com può usare Google Sites nella modalità Schedario. Tale link di download non funziona se si ha un blog di Blogger che punta a un dominio personalizzato. Tra le alternative ci sono i link di download di Dropbox e sempre i link di download di Google Drive.

In passato c'era l'opzione Google Code che però è stata ritirata così c0me è stato ritirato il supporto di hosting a Google Drive. Qualche tempo fa lo stesso Google acquistò Firebase che nelle intenzioni della casa si Mountain View dovrebbe sostituire proprio Google Code.






Firebase è essenzialmente una soluzione standalone per il caricamento di contenuti generati dagli utenti come file javascript, immagini e video. Ci si può loggare con il nostro account Google e i file possono essere caricati da PC Windows, iOS e dispositivi mobili Android.






CREARE FILE CSS E JAVASCRIPT


Per creare un file CSS si può usare Notepad++. I file CSS presenti in una pagina web o in un Modello o Tema hanno solitamente questa struttura di codice

<style>
Regole CSS
</style>

mentre i file javascript sono inseriti con questa sintassi

<script type='text/javascript'>
//<![CDATA[
Codice Javascript
//]]>
</script>

Per salvare i CSS e i javascript come file si incolla in File -> Nuovo di Notepad++ tutto il codice presente nelle parti evidenziata di giallo per i CSS e i Javascript quindi si va su File -> Salva con nome per poi dare un nome al file e sceglierne il formato 






CREARE UN PROGETTO SU FIREBASE


Si accede a Firebase aprendo la sua pagina iniziale loggati con l'account Gmail. Si clicca su + Aggiungi progetto per poi dare il nome al progetto e selezionare il paese di provenienza.

firebase

Ogni progetto ha un suo ID identificativo del tipo gs://nomeprogetto-xxxx.appspot.com. Nella pagina successiva si va nella colonna di sinistra su Storage. Poi sulla destra si va su Carica File.

caricare-file-firebase

I file possono essere organizzati in cartelle. Si seleziona il file da caricare e si aspetta la fine dell'upload.

file-firebase

Per ottenere il link diretto al file caricato ci si clicca sopra quindi si va in basso su Posizione File.

link-download-firebase

Subito sotto si clicca su URL di download per copiarlo negli appunti. Il link di download potrà essere revocato cliccando nell'apposito link e si possono creare anche più link di download per lo stesso file. Si possono creare link di download anche per file in formato .XML oltre che .CSS e .JS.
Se si incolla questo URL nella barra degli indirizzi del browser visualizzeremo il codice del file che abbiamo caricato. L'URL di download sarà simile al seguente

https://firebasestorage.googleapis.com/v0/b/progetto-1-79f16.appspot.com/o/post-etichetta.xml?alt=media&token=82883600-9727-411c-ab2b-c2c5f5fc5532

dove la parte in blu è la posizione del file e quella in rosso è la chiave per poterlo usare. Questo file sarà visibile e funzionerà anche nelle schede In Incognito. Firebase è quindi uno strumento utile per caricarvi i file che usiamo nei nostri Temi. Non ho consultato nel dettaglio i termini e le condizioni del servizio. So però che c'è un account gratuito denominato Spark e due a pagamento chiamati rispettivamente Flame (25€ al mese) e  Blaze con pagamento a consumo. Il piano Spark offre Database, Storage, Hosting, Test Lab, Functions. Analytics, Notifications, Crash Reporting, Assistenza, ecc. Maggiori informazioni si possono trovare nella pagina dei prezzi. Il piano gratuito consente 100 connessioni simultanee, 5GB di storage e 10GB al mese di download. Quindi quando si creano dei link di download è bene usarli solo per il nostro blog visto che difficilmente avremo nel blog più di 100 lettori in tempo reale ma potrebbe accadere se lo stesso script fosse usato da decine di altri siti.


COME USARE I LINK DI DOWNLOAD DI FIREBASE


Per usare Firebase come Hosting di file si devono creare i file CSS, JS o XML come abbiamo visto sopra. Invece di incollare tutto il codice nel Modello o Tema o Widget si usano questi codici

FILE CSS

<link rel='stylesheet' href='URL_DOWNLOAD_FIREBASE' />

FILE JAVASCRIPT

<script src='URL_DOWNLOAD_FIREBASE' type='text/javascript'/>


4 commenti :

  1. Su Firebase ho caricato la pagina dell'informativa della privacy.

    RispondiElimina
  2. Ciao Ernesto, ho caricato un CSS di Nivo Slider in Firebase, ma il link riportato nel blog non funziona: mi dà errore e non mi chiude il codice. Cosa sbaglio?

    RispondiElimina
    Risposte
    1. Non lo so cosa sbagli. Il tutorial è piuttosto chiaro. Adesso su due piedi non ti so dire se sia stata modificata qualche funzionalità
      @#

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy