Migrare il sito da HTTP a HTTPS a costo zero con un occhio alla SEO



sslcostozero

Ottenere un certificato TLS/SSL valido senza spendere un soldo è molto semplice e basta richiederne uno sul sito www.startssl.com (solo se il sito non ha scopi commerciali) oppure a meno di 10 dollari su NameCheap.

Prima di fare questo mostrerò però come installare tutto il necessario in quanto il solo fatto di ottenere un certificato valido non rende il nostro sito più sicuro e dunque si rendono necessari una serie di passi. Per questo tutorial mi baserò su una delle possibili configurazione per ambiente Apache e mostrerò cosa fare con un sito WordPress a livello applicativo.

La prima parte sarà comunque utile anche per applicativi diversi da WordPress. Oltre a mostrare come installare un certificato spiegherò come migrare ponendo un occhio alla SEO evitando spiacevoli inconvenienti di duplicazione interna e di errori che rendano il sito inusabile.

Installare mod_ssl, openSSL e mod_spdy

I requisiti per installare mod_ssl, openSSL e mod_spdy sono Apache >= 2.2.4 e tutta una serie di librerie GCC superiori alla 6+ (solo per spdy).

Su ubuntu/debian installare tutto il necessario non è difficile anche perché di solito il modulo mod_ssl è già preinstallato con l’installazione di Apache quindi basterà abilitarlo.

Di seguito il comando per abilitarlo:

a2enmod ssl

Poi il comando per abilitare il sito di default da far girare in SSL

a2ensite default-ssl

E poi il riavvio di apache

/etc/init.d/apache2 restart

Dopo questi 3 semplici passaggi troverete già tutto funzionante semplicemente digitando nel browser https://vostrosito.com

Ora verificate la versione del vostro sistema operativo, se a 32 o 64 bit con uname -m

Dopo aver fatto questa installazione abilitare anche mod_spdy è davvero semplice e tutto quello che dovrete fare è prelevare il pacchetto di mod_spdy compatibile con il vostro OS da qui.

wget https://dl-ssl.google.com/dl/linux/direct/mod-spdy-beta_current_x86_64.rpm

Poi

dpkg -i mod-spdy-*.deb
apt-get -f install

Al seguente percorso dovreste trovare il repository di SPDY

/etc/apt/sources.list.d/mod-spdy.list

e al seguente il file di configurazione

/etc/apache2/mods-available/spdy.conf

Riavviate Apache

/etc/init.d/apache2 restart

Andate con Chrome qui chrome://net-internals/#spdy e navigate il vostro sito per testare che effettivamente SPDY funzioni.

Ottenere un certificato SSL/TLS valido gratis

Andate sul sito startssl.com e registratevi. Il sito non è molto user-friendly, ma ce lo faremo piacere lo stesso visto che offre certificati validi in modo gratuito e per siti come blog, siti vetrina, piccoli siti senza troppe pretese possono essere considerati affidabili. Se volete approfondire su TLS, certificati e dubbi vi consiglio la lettura di questo articolo di Tim Nash.

Subito dopo la registrazione riceverete una mail come la seguente

This mail is intended for the person who requested to enroll at StartSSL™ (https://www.startssl.com).

Your authentication code is XXXXXXXXXXXXXX
Copy and paste this code now into the form at your open browser window.

Thank you!

StartCom Ltd.
StartSSL™ Certification Authority

Utilizzate il codice che io ho nascosto per verificare l’iscrizione e poi una volta verificato riceverete una mail che vi informa su come proseguire

To Andrea Pernici,

Your request for an account at StartSSL™ (www.startssl.com) has been approved and is available during the next 24 hours at the following location:

https://www.startssl.com/?app=12&action=release&id=XXXX&auth=XXXXXXXXXXXXXX

The verification code in order to continue the process is XXXXXXXXXXXXXX

Thank you!

StartCom Ltd.
StartSSL™ Certification Authority

Dopo questi passi vi troverete una schermata dove inserire il codice e iniziare la creazione del vostro primo certificato

ssl

Dopo aver premuto continua riceverete poi la seguente mail, che vi informa e consiglia di salvare il certificato per potersi loggare all’account su startssl in futuro.

Hi Andrea Pernici,

Congratulations on your new StartSSL™ account! Things you should know before proceeding:

During enrollment a client certificate has been installed into your browser for authentication purpose. This certificate allows you to securely access your account in the future. Make sure to *backup* this certificate including the private key to an external media! Failing to do so may result in the loss of your account. See also https://www.startssl.com/?app=25#4 for more information about how to backup your client certificates.

Even though StartSSL™ provides certificates generally free of charge, revocations thereof may carry a handling fee. Take great care of your private keys, save and backup all files all the time!

Take a minute of your time and visit the Tool Box section of your control panel, which provides you with many tools and utilities. They might help you during the various tasks of validation, creation and installation of your certificates.

Thank you for choosing StartSSL™!

Una volta fatto questo salvate la vostra chiave (qui le istruzioni)

esporta certificato

Finalmente possiamo andare nel pannello di controllo da loggati per iniziare l’Expert Lane per la generazione del certificato da associare a un nome dominio

expert lane

Inseriamo il dominio senza www, andiamo avanti e selezioniamo una della mail associate al dominio che abbiamo attiva per ricevere la verifica. In questa fase ci troveremo davanti alla seguente schermata

expert lane mail

Se dobbiamo installare il certificato avremo di certo accesso ad una shell quindi possiamo aprire la mail direttamente da shell per recuperare il codice di attivazione

mail startssl

Una volta preso il codice e confermato ci troveremo il seguente messaggio. Attenzione al messaggio che ci informa di dover completare la creazione del certificato entro 30 giorni. Questi 30 giorni non si riferiscono alla validità del certificato, ma semplicemente al tempo che abbiamo per mantenere valida la sessione di creazione di esso.

expert lane ok

Qualora non riusciate a completare il tutto in un colpo solo potrete anche riprendere la generazione dei certificati in qualsiasi momento selezionando l’opzione Web Server.

recupera ssl tls server web

Tramite il wizard sarà possibile generare tutto il necessario direttamente dal pannello di controllo del sito e dunque senza richiedere competenze aggiuntive

key ssl

Una volta inserita la password e selezionate le opzioni verrà generato un codice che dovremo incollare in un file di testo sul server e successivamente da linea di comando eseguire

openssl rsa -in ssl.key -out ssl.key

inserite la password scelta precedentemente ed il gioco sarà fatto.

Ora dopo aver fatto questo ci verrà chiesto di aggiungere un sottodominio e come nella maggior parte dei casi sarà il www a farla da padrone.

aggiunta sottodominio tls ssl

aggiunta tls

Dopo pochi minuti dovreste ricevere la mail che vi conferma la corretta approvazione della vostra richiesta
approvazione ssl

Ecco la mail che confermo di poterlo recuperare nel pannello di controllo.

certificato accettato

Dal pannello di controllo ora recuperaramo il certificato generato e approvato tramite la voce “Retrieve Certificate”

recupera certificato

Ora aggiungiamo il seguente codice al file virtualhost relativo al dominio per fare in modo che il sito sia raggiungibile anche via https://

<VirtualHost pallamanoitalia.it:443>
DocumentRoot /home/percorso/public_html
ErrorLog /home/percorso/logs/pallamanoitalia.it_error_log
TransferLog /home/percorso/logs/pallamanoitalia.it_transfer_log

SSLEngine on
SSLProtocol all -SSLv2
SSLCipherSuite ALL:!ADH:!EXPORT:!SSLv2:RC4+RSA:+HIGH:+MEDIUM

SSLCertificateFile /home/percorso/ssl.crt
SSLCertificateKeyFile /home/percorso/ssl.key
SSLCertificateChainFile /home/percorso/sub.class1.server.ca.pem
CustomLog /home/pallaman/logs/ssl_request_log \
"%t %h %{SSL_PROTOCOL}x %{SSL_CIPHER}x \"%r\" %b"
</VirtualHost>

Salviamo e facciamo un apache2ctl configtest per verificare che la configurazione sia corretta.

Se tutto risulta ok possiamo procedere con apache2ctl graceful e poi verificare il tutto visitando il sito su https://www.pallamanoitalia.it. Se non ci sono errori allora visitando il sito non riceveremo alcun warning di certificato non affidabile come potete vedere dall’immagine. L’icona gialla non è di per sé un problema che previene la visualizzazione e fruizione del sito, ma indica che all’interno della pagina vengono utilizzate risorse provenienti da connessione https://.

certificato tls ok

Andiamo ora a testare eventuali problemi dal sito ssllabs.com/ssltest/ (nel nostro caso https://www.ssllabs.com/ssltest/analyze.html?d=pallamanoitalia.it)

Una volta inserito il vostro sito lo strumento inizierà l’elaborazione

ssl report

e una volta terminato vedremo il punteggio assegnato alla configurazione TLS del nostro sito. Il nostro primo step come vedete ottiene un pessimo voto.

ssl report bad

Andiamo a vedere come è possibile risolvere la serie di problemi identificati.

Aggiungiamo queste righe (e commentiamo le precedenti) al nostro virtualhost per prevenire il caricamento di versioni SSL non supportate sulla nostra macchina.

SSLProtocol all -SSLv2 -SSLv3
SSLHonorCipherOrder on
SSLCipherSuite "EECDH+ECDSA+AESGCM EECDH+aRSA+AESGCM EECDH+ECDSA+SHA384 EECDH+ECDSA+SHA256 EECDH+aRSA+SHA384 EECDH+aRSA+SHA256 EECDH+aRSA+RC4 EECDH EDH+aRSA RC4 !aNULL !eNULL !LOW !3DES !MD5 !EXP !PSK !SRP !DSS"

Il warning avviene infatti perché sul nostro server OpenSSL è configurato in un certo modo e dunque la soluzione sarebbe quella di configurare diversamente openSSL oppure come fatto sopra abilitare solo le opzioni valide per il software che gira sul nostro server.

In ogni caso trovate ulteriori dettagli qui.

NB: Questa configurazione non è necessariamente valida per ogni caso, ma è valida nel caso in questione quindi agite sulla base del software installato sulla vostra macchina.

Ora rieseguendo il test dopo questa modifica la nostra configurazione ritorna un ottimo punteggio, ma possiamo fare ancora di meglio identificando eventuali altri problemi nelle parti di dettaglio successive.

ssl report good

Nel nostro caso possiamo aggiungere queste righe al file virtualhost per abilitare Strict Transport Security (HSTS).

<Directory /home/percorso/public_html>
Header always set Strict-Transport-Security "max-age=63072000; includeSubDomains"
</Directory>

ottenendo un risultato ancora migliore.

Se volete approfondire l’argomento HSTS ecco un ottimo punto di partenza.

ssl report good plus

A questo punto abbiamo la nostra configurazione TLS funzionante con attivo mod_spdy per migliorare le performance del giochino e siamo pronti per andare a smanettare a livello applicativo.

Redirect 301 e canonicalizzazione

Per evitare problemi di completa duplicazione sarà necessario configurare il sito per lavorare a livello di percorsi su https:// invece di https:// e possibilmente includere le risorse usando ‘//’ per far decidere alla risorsa inglobata su che protocollo essere erogata.

Questo aiuta a prevenire errori e blocchi di risorse come i seguenti che spesso possono essere semplici warning, ma in altri casi generare dei blocchi completi della risorsa (esempio i JS) rendendo inutilizzabile il sito.

errori

Nel nostro caso siamo abbastanza fortunati perché il sito gira in WordPress e dunque dovremo fare pochi passaggi per renderlo fruibile completamente su HTTPS.

Andiamo in impostazioni > generali e aggiungiamo una bella ‘s’

impostazioni generali wordpress

Se tutto va a buon fine verremo sloggati dal pannello admin. Rieffettuiamo il login e se usiamo Yoast, come consigliato nella guida SEO, andiamo in SEO > Permalinks > Impostazioni canonical > Forza transport su HTTPS.

Ora ci saranno alcuni problemini quindi assicuriamoci che tutte le risorse che rispondono sulla porta 80 e dunque su https:// facciano redirect verso la rispettiva https:// mettendo nel file di virtualhost (nella parte relativa al non TLS) le seguenti righe

RewriteCond %{HTTPS} off
RewriteRule (.*)$ https://www.pallamanoitalia.it/$1 [L,R=301]

Per forzare poi WordPress ad usare TLS aggiungiamo al wp-config.php

define('FORCE_SSL_ADMIN', true);
define('FORCE_SSL_LOGIN', true);

Correggere i percorsi del tema WordPress

Ora sarà possibile che il nostro tema includa qualche risorse hardcoded in ‘https://’ quindi non dobbiamo fare altro che cercare all’interno dei file tutte le occorrenze di queste risorse e convertirle in ‘//’. Per farlo in modo rapido possiamo utilizzare una grep come segue:

cd /home/percorse/public_html/wp-content/themes/miotema/
grep -R 'https://' *

per listare tutti i file che contengono la stringa con la relativa riga coinvolta.

A questo punto sistemiamo tutte le righe e saremo pronti per far navigare i nostri utenti senza problemi di usabilità.

Una volta sistemati tutti i percorsi il lucchetto del vostro browser risulterò verde brillante come segue

lucchetto verde

Configurare Mod_pagespeed per TLS

Questa non è una cosa che dovete fare per forza, ma dato che sul server in question gira mod_pagespeed riporto la configurazione precedente anche all’interno della parte di virtualhost dedicata ad https.

ModPagespeedRewriteLevel PassThrough

    ModPagespeedEnableFilters insert_dns_prefetch
    ModPagespeedEnableFilters add_head
    ModPagespeedEnableFilters combine_javascript
    ModPagespeedEnableFilters combine_css
    ModPagespeedEnableFilters outline_css
    ModPagespeedEnableFilters move_css_above_scripts
    ModPagespeedEnableFilters move_css_to_head
    ModPagespeedEnableFilters convert_meta_tags
    ModPagespeedEnableFilters extend_cache
    ModPagespeedEnableFilters inline_import_to_link,
    ModPagespeedEnableFilters rewrite_css
    ModPagespeedEnableFilters rewrite_images
    ModPagespeedEnableFilters rewrite_javascript
    ModPagespeedEnableFilters rewrite_style_attributes_with_url
    ModPagespeedEnableFilters collapse_whitespace
    ModPagespeedEnableFilters elide_attributes
    ModPagespeedEnableFilters convert_jpeg_to_progressive
    ModPagespeedEnableFilters convert_png_to_jpeg
    ModPagespeedEnableFilters convert_jpeg_to_webp
    ModPagespeedEnableFilters insert_image_dimensions
    ModPagespeedEnableFilters inline_images
    ModPagespeedEnableFilters recompress_images
    ModPagespeedEnableFilters resize_images
    ModPagespeedEnableFilters inline_preview_images
    ModPagespeedEnableFilters resize_mobile_images
    ModPagespeedEnableFilters remove_comments
    ModPagespeedEnableFilters lazyload_images
    ModPagespeedEnableFilters defer_javascript
    ModPagespeedEnableFilters sprite_images

    ModPagespeedDomain www.pallamanoitalia.it
    ModPagespeedDomain pallamanoitalia.it

In aggiunta per far funzionare correttamente mod_pagespeed su https aggiungiamo le seguenti direttive utili a far reperire il certificato, dialogare con https e con mod_spdy e rimuovere le chiamate al dominio stesso riducendo la possibilità di erogare contenuto di tipo diverso da https.

ModPagespeedFetchHttps enable
ModPagespeedSslCertDirectory /home/percorso
ModPagespeedSslCertFile ssl.crt
ModPagespeedMapOriginDomain "https://www.pallamanoitalia.it" "https://www.pallamanoitalia.it"

ModPagespeedFetchFromModSpdy on
ModPagespeedEnableFilters trim_urls

Se avete bisogno di una guida su mod_pagespeed trovate le informazioni sul wiki gt.

Andiamo ora a vedere cosa ci dice WebPageTest relativamente alla resa del nostro sito (anche se non abbiamo ancora lavorato su tutte le ottimizzazioni) in modo da identificare eventuali lentezze dovute alla nuova configurazione.

webpagetest

A quanto pare tutto sembra filare liscio con un rendering time inferiore ad 1 secondo. Dunque TLS è veloce?
Sembra proprio di sì.

Attivazione della versione TLS negli Strumenti Per I Webmaster di Google

Come già saprete la versione http e quella https vengono considerate come 2 siti completamente differenti quindi dovremo aggiungere il nuovo sito all’interno degli Strumenti per Webmaster di Google.

webmaster tool ssl

Dopo qualche giorno se tutto funziona correttamente dovremmo iniziare a vedere i dati di Webmaster Tools aggiornarsi anche sulla versione https creata.

Una delle cose importanti da fare secondo me per assicuraci che Googlebot non abbia problemi è di fare un fetch as Googlebot (Visualizza come Googlebot) come vedete nell’immagine

googlebot rendering

Se notate errori nei vostri browser o problemi di qualche tipo segnalatemeli e cercheremo di capire insieme come comportarci.

Aggiornamento del giorno dopo – 13-08-2014

Facendo una ricerca su Google iniziamo già a vedere la migrazione in atto

pallamanoitalia

Aggiornamento tre giorni dopo – 15-08-2014

Visitando gli strumenti per i webmaster possiamo già iniziare a vedere alcuni dati che possono tranquillizzarci sul processo di migrazione in atto tramite il pannello query di ricerca

dati https

tramite il pannello dedicato alle pagine scansionate che mostra un bel picco

scansione https

tramite la sitemap che sembra a poco a poco mostrare un riscontro con le pagine indicizzate

sitemap https

SSL/TLS sono lenti? Per niente se sai cosa fare

speed tls

Come potete vedere dall’immagine, relativa a qualche giorno dopo la migrazione, non si notano rallentamenti sensibili dei tempi di caricamento per la versione HTTPS.

Consideriamo anche che in questa fase ho continuato a fare test e esperimenti sulla macchina e dunque c’è ancora molto margine di miglioramento. Dunque se qualcuno vi dirà che la migrazione ad HTTPS non è compatibile con la velocità come segnale di ranking ditegli di rivedere la sua opinione.

Complichiamoci la vita e aggiungiamo un altro sito SSL sulla stessa macchina usando SNI

Non mi piace fare solamente le cose ovvie quindi ho testato una configurazione TLS con SNI aggiungendo un altro dominio sullo stesso server in modo da poter far girare X siti in HTTPS sulla stessa macchina, ognuno con il suo certificato.

Quello che faremo qui è lo stesso che abbiamo fatto precedentemente con qualche piccola modifica a livello di Apache.

Il concetto da fare proprio è quello di SNI, spiegato sul Wiki di Apache, e di seguito vedremo come configurare il secondo virtualhost per farlo funzionare sullo stesso server tramite NameBasedSSL Virtualhost.

Il primo step è quello di aggiungere una linea di codice alla configurazione globale di Apache (anche se dipende dalle vostre preferenze) quindi dobbiamo aprire il file con

vim /etc/apache2/apache2.conf

e aggiungere

NameVirtualHost YOURIP:443

Dopo questo step possiamo editare il nostro secondo file di configurazione del virtualhost aggiungendo tutte le direttive e i percorsi ai nuovi certificati generati come segue

<VirtualHost YOURIP:443>
ServerName salserocafe.com
ServerAlias www.salserocafe.com
DocumentRoot /home/salseroPATH/public_html
ErrorLog /home/salseroPATH/logs/salserocafe.com_error_log
TransferLog /home/salseroPATH/logs/salserocafe.com_transfer_log
DirectoryIndex index.html index.htm index.php index.php4 index.php5

SSLEngine on
SSLProtocol all -SSLv2 -SSLv3
SSLHonorCipherOrder on
SSLCipherSuite "EECDH+ECDSA+AESGCM EECDH+aRSA+AESGCM EECDH+ECDSA+SHA384 EECDH+ECDSA+SHA256 EECDH+aRSA+SHA384 EECDH+aRSA+SHA256 EECDH+aRSA+RC4 EECDH EDH+aRSA RC4 !aNULL !eNULL !LOW !3DES !MD5 !EXP !PSK !SRP !DSS"

SSLCertificateFile /home/salseroPATH/ssl.crt
SSLCertificateKeyFile /home/salseroPATH/ssl.key
SSLCertificateChainFile /home/salseroPATH/sub.class1.server.ca.pem
CustomLog /home/salseroPATH/logs/ssl_request_log \
      "%t %h %{SSL_PROTOCOL}x %{SSL_CIPHER}x \"%r\" %b"

<Directory /home/salseroPATH/public_html>
Header always set Strict-Transport-Security "max-age=63072000; includeSubDomains"
</Directory>
</VirtualHost>
ATTENZIONE cambiate “YOURIP” con il vostro reale indirizzo IP

Ora che il Virtualhost TLS di salsero è ok dobbiamo modificare anche quello di pallamanoitalia cambiando il listening e aggiungendo il ServerName come segue

<VirtualHost YOURIP:443>
ServerName pallamanoitalia.it
ServerAlias www.pallamanoitalia.it
</VirtualHost>

Dopo aver fatto questo possiamo provare un apache2ctl configtest per controllare che tutte le direttive siano corrette e quindi riavviare Apache per rendere effettive le modifiche.

Visitando a questo punto sia salserocafe che pallamanoitalia vediamo che entrambi funzionano in HTTPS senza alcun warning del browser sulla validità del certificato. Guardate qui e qui per verificare in autonomia.

Nello strumento di diagnostica però vedremo un nuovo warning nello strumento che dice

This site works only in browsers with SNI support.

Questo significa su tutti i moderni Browser. Provate ad indovinare quale Browser non supporta SNI? (smile). Lo so che conoscete la risposta.

Una ultima cosa.

Ricordate di impostare un virtualhost TLS di default (ad esempio il vostro indirizzo IP come ServerName) per evitare l’incontrollata duplicazione del dominio TLS di default per ogni richiesta che non soddisfi un versione TLS di altri domini sulla stessa macchina.

vim /etc/apache2/sites-enabled/default-ssl
<IfModule mod_ssl.c>
<VirtualHost YOURIP:443>
        ServerName YOURIP
        ...
</VirtualHost>
</IfModule>

A questo punto non dobbiamo fare altro che ripetere tutti gli step fatti per pallamanoitalia e monitorare l’evoluzione della migrazione ciclando per ogni sito che vogliamo migrare.

Efficienza di Crawling

Una nota per i più curiosi: andiamo a vedere cosa è successo in termini di efficenza di crawling.

speed crawl

Quindi posso solo consigliarvi di non credere a qualsiasi cosa vi vogliano fare credere in merito alla lentezza e HTTPS. Trovate le risposte nei vostri dati e nei vostri test.

Non accusate la tecnologia, ma accusate voi stessi per l’eventuale incapacità nel non farla funzionare al massimo.

Conclusione

Molto probabilmente non si tratta di una guida completa e assoluta, ma il racconto di un caso di studio fatto in meno di due ore e che spero possa essere utile a tutti dopo l’annuncio molto discusso di Google su TLS come fattore di ranking e considerando che nella credenza comune ci sia il fatto che acquistare e installare un certificato TLS sia una cosa costosa, complessa e che porta al degrado delle performance.

Nulla è impossibile e con un po’ di smanettamento (e qualche errore) possiamo mettere il lucchetto ai nostri siti anche se onestamente non tenderei a farlo per la questione del ranking, ma per una reale utilità del proprio sito.

In questo caso ho mostrato come poterlo fare in modo gratuito per un sito WordPress, ma ad esempio sul mio sito ho testato un certificato di NameCheap da poco più di 9 dollari annui su un server con tantissimi vincoli, ma il fatto di avere una versione non ultra performante e non ultra nuova rende sicuramente il nostro sito migliore rispetto a non averne per niente.

Se volete dunque passare non cercate per forza la soluzione più laboriosa o più costosa e magari effettuate prima degli esperimenti con queste soluzioni low cost che grazie a Giacomo Pelagatti ho deciso di testare con successo.

Datemi un feedback e segnalatemi eventuali altri aspetti da trattare.

Sei membro del forum? Vuoi scrivere anche tu su SEO Blog gt
Chiedilo a @giorgiotave