Cadoles/formations
20
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Cours hébergement web

Browse Source
This commit is contained in:
Sylvain 2019-05-15 12:23:31 +02:00
parent 4dca21830a
commit 0091d980b3
24 changed files with 2472 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
cesi/hebergement_web/.gitignore vendored Normal file
View File

@ -0,0 +1 @@
*.html

37
cesi/hebergement_web/00-intro.md Normal file
View File

@ -0,0 +1,37 @@
% Introduction à l'hébergement Web
% Sylvain Eliade — S.C.O.P. Cadoles
% Mai 2019
## Introduction
* Qui suis-je ? Développeur web depuis 2003 : agences web, Skyrock, Aéroport d'Auckland, Cadoles… / Administrateur de plusieurs serveurs web depuis 2002.
* Comment fonctionne ce cours ? Présentation d'un sujet, exercice en TP, exercices facultatifs
* Evaluation : bonne réalisation des TP.
---
## Le plan c'est…
1. DNS
2. HTTP et serveur web
3. HTTPS
4. Web dynamique et PHP
5. Sécurité du serveur web
---
## Prérequis
* VirtualBox avec une distribution Linux (Debian ou Ubuntu de préférence)
* Machine virtuelle dispo sur `https://sylvain.eliade.net/cesi/debian.ova`
* Si pas de réseau privé hôte existant, en créer un dans **Fichier > Gestionnaire de réseau hôte**
* Sélectionner le réseau privé hôte dans la config de la VM : **Mode d'accès réseau = réseau privé hôte**
---
## VM Debian
* Login : user / Mot de passe : abcd
* Pour devenir root : `sudo -i`
* Changer de répertoire : `cd /repertoire`
* Éditer un fichier `nano fichier.txt` (puis Ctrl+X pour quitter)

402
cesi/hebergement_web/01-dns.md Normal file
View File

@ -0,0 +1,402 @@
% Introduction au DNS
% Sylvain Eliade — S.C.O.P. Cadoles
% Mai 2019
## Introduction au DNS
* Domain Name System
* Service de base sur Internet
* Permet d'obtenir l'adresse IP d'une machine à partir d'un nom intelligible (résolution de nom)
* Exemple : `www.cesi.fr -> 178.170.102.194`
* Sur le port 53, en UDP (+ TCP pour les réponses de plus de 512 octets) : plus rapide !
---
## Un nom DNS
`www.cesi.fr` comporte trois parties :
* `fr` est le TLD (Top Level Domain)
* `cesi` est le nom de domaine
* `www` est un sous-domaine
Le FQDN (*Fully Qualified Domain Name*) est le nom intégral, suivi d'un point final (= la racine), indiquant que le nom est complet : `www.cesi.fr.`
L'ensemble des enregistrements d'un nom de domaine s'appelle une *zone*.
---
## Les TLD
Plusieurs types :
* pour les pays (`.fr`, `.be`, `.nz`, etc.) = ccTLD (Country-Code)
* génériques (gTLD) : `.com`, `.info`, et les nouveaux : `.paris`, `.ovh` et des centaines d'autres
* infrastructure `.arpa` : ne sert que pour les reverse DNS (trouver un nom à partir d'une IP)
---
### État des TLDs
Plus de 1500 TLD à ce jours. Expansion depuis l'ouverture à la vente des gTLD en 2012 (100.000$ pour déposer un dossier).
TLD réservés : `.example`, `.invalid`, `.localhost`, `.test`, `.local` (multicast), `.onion` (Tor).
Attention à ne pas utiliser des TLD perso en interne : exemple du `.dev` acheté par Google.
---
## Résolution DNS
Le DNS est un système hiérarchique. On commence par la racine (root) et on descend les niveaux.
![](./img/hierarchie_dns.svg)
---
Ainsi pour résoudre le nom `fr.wikipedia.org` on va demander :
* aux serveur racine : quel serveur est responsable du TLD `org` ?
* au serveur responsable de `org` : qui est responsable du domaine `wikipedia.org` ?
* au serveur responsable du domaine `wikipedia.org` : quelle est l'adresse IP de `fr.wikipedia.org` ?
On obtient enfin l'adresse IP du serveur associé à `fr.wikipedia.org`, ou si celui-ci n'existe pas, le serveur DNS renvoie `NXDOMAIN` (Non-eXistent domain).
---
## Les outils d'inspection DNS
* `host` renvoie des réponses courtes et simples. Pratique pour scripter.
* `dig` est plus complet. Mieux pour diagnostiquer des problèmes DNS.
* `nslookup` : simpliste, mais dispo sous Windows et Linux, déconseillé.
Pour leur utilisation : `man dig` et `man host`
```
% host eliade.net
eliade.net has address 91.121.181.110
eliade.net has IPv6 address 2001:41d0:1:f66e::1
eliade.net mail is handled by 10 mail.kd2.org.
```
---
```
% dig eliade.net
…
;; ANSWER SECTION:
eliade.net. 201 IN A 91.121.181.110
;; Query time: 1 msec
;; SERVER: 192.168.5.253#53(192.168.5.253)
;; WHEN: Mon May 13 10:45:34 CEST 2019
;; MSG SIZE rcvd: 55
```
Attention, par défaut les deux outils utilisent le résolveur configuré dans `/etc/resolv.conf` (ici `192.168.5.253`). Bien utiliser leurs options si on veut faire des requêtes directement sur les serveurs racine, de TLD, ou autoritaires.
---
## Exemple de résolution de domaine : fr.wikipedia.org
On peut reproduire le travail d'un résolveur avec l'outil `dig`.
On demande au serveur racine qui est responsable pour le TLD `org` :
```bash
% dig NS org +short
a0.org.afilias-nst.info.
c0.org.afilias-nst.info.
b0.org.afilias-nst.org.
b2.org.afilias-nst.org.
d0.org.afilias-nst.org.
a2.org.afilias-nst.info.
```
---
On sait que `a0.org.afilias-nst.info` est responsable de la zone `.org`, on va lui demander qui est responsable de la zone `wikipedia.org`
```
% dig wikipedia.org @a0.org.afilias-nst.info
…
wikipedia.org. 86400 IN NS ns0.wikimedia.org.
wikipedia.org. 86400 IN NS ns2.wikimedia.org.
wikipedia.org. 86400 IN NS ns1.wikimedia.org.
…
```
---
Reste plus qu'à demander au serveur responsable de `wikipedia.org` quelle est l'adresse de `fr.wikipedia.org` :
```
% dig fr.wikipedia.org @ns0.wikimedia.org
…
fr.wikipedia.org. 3600 IN CNAME dyna.wikimedia.org.
…
```
Ah c'est un `CNAME` donc un alias, vers `dyna.wikimedia.org` !
---
Donc il nous faut aller voir à quoi correspond `dyna.wikimedia.org` :
```
% dig dyna.wikimedia.org @ns0.wikimedia.org
…
dyna.wikimedia.org. 600 IN A 91.198.174.192
…
```
Et voilà on a notre adresse IP !
(Ici on a pris un raccourci, normalement on aurait dû aller demander quel était le serveur responsable de `wikimedia.org` mais c'est le même que `wikipedia.org`).
---
## Attention au cache !
Évidemment on ne va pas re-demander au serveur racine à chaque fois quels sont les serveurs responsables de chaque TLD, si on a déjà l'information, elle est mise en cache pour un certain temps, à plusieurs niveaux (application, OS, serveur DNS local, etc.).
---
## Syntaxe d'enregistrement
```
dyna.wikimedia.org. 600 IN A 91.198.174.192
```
Chaque enregistrement indique :
* son nom (`dynam.wikimedia.org`)
* son **TTL** (Time-To-Live) : limite de temps avant qu'un résolveur ne doive aller re-demander l'enregistrement au serveur autoritaire (`600` secondes = 10 minutes)
* `IN` pour *INternet*
* le type de l'enregistrement (`A`)
* la valeur (`91.198.174.192`)
---
## Types d'enregistrements
* SOA = Infos sur le domaine (Start of Authority)
* A = Adresse IPv4
* AAAA = Adresse IPv6
* CNAME = Alias vers un autre nom
* MX = Serveur de mail responsable de la zone
* NS = Serveur DNS responsable de la zone
* TXT = Commentaire
Attention : le CNAME ne peut pas être utilisé pour un nom de domaine, seulement pour un sous-domaine ! (car il doit être le seul enregistrement !)
---
## Priorité d'enregistrements
Les enregistrements de type `MX` permettent de spécifier la priorité de chaque enregistrement :
```
% dig MX fastmail.fm +short
20 in2-smtp.messagingengine.com.
10 in1-smtp.messagingengine.com.
```
Ainsi ici les serveurs de mail vont essayer `in1-smtp.messagingengine.com` en premier, et s'il ne répond pas, ils essaieront `in2-smtp.messagingengine.com`.
---
## La syntaxe du SOA
Le SOA est l'enregistrement le plus important avec NS. Il a une syntaxe spécifique : `MNAME RNAME SERIAL REFRESH RETRY EXPIRE TTL`
* MNAME = adresse du serveur DNS primaire (Master)
* RNAME = adresse email du Responsable (en remplaçant le `@` par un point `.`)
* SERIAL = numéro de dernière modification de la zone, doit être incrémenté à chaque modification de la zone (en général on utilise la date du jour + un nombre qui s'incrémente). C'est ce qui indique aux serveurs secondaires qu'ils doivent
---
* REFRESH = nombre de secondes avant que les serveurs secondaires ne doivent aller re-vérifier si le serial a changé. En général c'est 86400 (24 heures).
* RETRY = nombre de secondes avant que les secondaires ne relancent une requête si le primaire ne répond pas (générallement 7200 = 2 heures)
* EXPIRE = nombre de secondes avant que les secondaires doivent arrêter de relayer la zone si le primaire ne répond pas (en général 1000 heures = 41,6 jours)
* TTL = Time To Live = nombre de secondes avant qu'un résolveur doive ré-essayer si le serveur a répondu `NXDOMAIN`
Exemple pour `octopuce.fr` :
```
ubal.octopuce.fr. support.octopuce.fr.
2019051305 21600 3600 604800 3600
```
---
## Les différents types de serveurs DNS
* Serveur racine : 13 serveurs (13 lettres) en Anycast (= 13 adresses IP, mais 600+ serveurs physiques répartis dans le monde), indique le serveur autoritaire d'un TLD
* Serveur responsable de TLD : serveur qui indique le serveur autoritaire d'un nom de domaine
* Serveur autoritaire de nom de domaine
* Serveur récursif : en général celui de votre FAI, ou de votre réseau local, c'est lui qui va faire les requêtes vers les serveurs racine, de TLD et autoritaire et renvoyer directement la réponse finale au client
---
## Le serveur autoritaire
C'est celui qu'on est susceptible de mettre en place en tant que sysadmin, il répond aux requêtes pour un ou plusieurs domaines particuliers.
* C'est lui qui fait autorité sur un/des domaines (`AUTHORITY`)
* Son autorité ne vaut rien si le serveur du TLD n'indique pas ce serveur comme étant responsable du domaine
Donc bien vérifier auprès du registrar (auquel vous avez payé le nom de domaine), que le domaine est bien configuré.
---
## Serveur autoritaire primaire et secondaire
Il est possible de n'avoir qu'un seul serveur autoritaire pour un domaine, mais si celui-ci devient injoignable, tous vos noms de domaines sont aussi injoignables. En général on a donc un serveur primaire et un ou plusieurs serveurs secondaires.
Les serveurs secondaires enregistrent une copie de la zone depuis le serveur primaire. Pour faire cette copie ils envoient une requête `AXFR` au serveur primaire qui leur renvoie tous les enregistrements de la zone.
Les clients eux iront demander à n'importe quel serveur listé comme `NS` pour la zone, au hasard, qu'il soit primaire ou secondaire.
---
## Notification des serveurs secondaires
Il existe deux manières pour un serveur secondaire de savoir s'il a besoin de mettre à jour une zone :
* le serveur primaire notifie les serveurs secondaires (message `NOTIFY`)
* les secondaires vont demander le `SOA` toutes les *x* secondes (spécifié dans le paramètre `REFRESH` du `SOA`), et regarder si le `SERIAL` du `SOA` a changé depuis la dernière fois
De nos jours on utilise plutôt le `NOTIFY` car ça permet d'avoir une répercussion immédiate des changements.
---
## Le serveur récursif (résolveur)
C'est celui à qui on parle en général ! (enfin à qui son OS et ses applications parlent)
Il enregistre dans son cache les réponses qu'il a faites (en fonction )
---
## Exemple pratique : mise en place d'un nom de domaine
* Achat du domaine `miammiammiam.com` auprès d'un registrar (par exemple OVH)
* Configuration du domaine chez le registrar pour pointer sur nos serveurs DNS : `ns1.superboite.fr` et `ns2.superboite.fr`
* Installation d'un serveur DNS sur nos deux serveurs NS1 et NS2
* Configuration de notre zone `miammiammiam.com` sur NS1 en *master*, et configuration de NS2 en *secondaire*
* Vérification du fonctionnement : le SOA renvoyé par NS1 doit être le même que celui envoyé par NS2, et le serveur DNS de `.fr` doit bien indiquer nos deux serveurs DNS
---
## Problèmes courants
* Mauvais serveur DNS indiqué auprès du registrar
* Problème de synchronisation entre le DNS primaire et un ou plusieurs DNS secondaires (le serial du SOA est-il identique ?)
* Problème de cache dans le résolveur de l'entreprise
Le résolveur envoie ses requêtes au hasard sur le DNS primaire ou l'un des DNS secondaires ! Il n'envoie pas déjà sur le primaire et ensuite sur les secondaires, c'est pas comme ça que ça marche !
---
## Serveurs DNS
* Bind (le plus répandu)
* PowerDNS (très puissant et versatile)
Les deux permettent de faire résolveur et/ou serveur autoritaire. Pour 90% des cas, Bind suffit amplement.
Il est conseillé de séparer les deux fonctions toutefois. Je conseille de mettre un serveur résolveur qui n'écoute qu'en local sur `127.0.0.1` (ou sur une IP du réseau interne), et le serveur autoritaire sur l'IP publique (accessible depuis Internet). Perso je met un bind en local, et un PowerDNS (avec MySQL) en public.
---
## Le futur
DNS n'est pas très sécurisé… Plusieurs solutions sont disponibles :
* DNSSEC : signature des zones, permet de valider que la réponse DNS n'a pas été modifiée par le résolveur en cours de route. N'empêche pas d'espionner les requêtes et réponses DNS.
* DNS over TLS, DNS over HTTPS : chiffrement de la connexion entre le client et le résolveur
* DNSCrypt : chiffrement et signature entre résolveur et client
DNSSEC peut être combiné avec DoT, DoH et DNSCrypt.
Comparaison DoH, DoT et DNSCrypt : [https://dnscrypt.info/faq/](https://dnscrypt.info/faq/)
---
## Aller plus loin
* [Problèmes courants de mauvaise configuration DNS](https://www.howtoforge.com/troubleshooting-common-dns-misconfiguration-errors)
---
## Exercice 1
Identifier le parcours DNS d'un résolveur récursif pour `www.cesi.fr` avec `dig`. (Copier/coller chaque étape)
---
## Exercice 2
Identifier les adresses IP du serveur de mail le plus prioritaire pour `gmail.com`.
---
## Exercice 3
J'ai créé un nouveau site web sur `dns1.sylvain.eliade.net` mais il ne marche pas.
Identifier la ou les erreurs commises et indiquer une solution.
---
## Exercice 4
Identifier le reverse DNS de l'adresse IP correspondant au serveur de `www.cesi.fr`
---
## Exercice 5 (facultatif)
Créer une zone Bind pour un domaine fictif avec un A et un AAAA sur le domaine lui-même, deux serveurs DNS, un SOA valide, deux serveurs de mail, et un CNAME de www qui redirige sur le domaine lui-même. Exemple :
```
$TTL 3600
@ IN SOA ns1.domain.tld. hostmaster.domain.tld. (
2017090401 ; SERIAL (DATE+NUMBER)
86400 ; REFRESH (SEC)
3600 ; RETRY (SEC)
3600000 ; EXPIRE (SEC)
300 ) ; MINIMUM (SEC)
@ IN NS ns1.domain.tld.
@ IN NS ns2.domain.tld.
ns1 IN A 10.1.2.2
ns2 IN A 10.1.2.3
@ IN A 127.0.0.1
@ IN AAAA ::1
@ IN MX 10 mx1.domain.tld.
@ IN MX 20 mx2.domain.tld.
mx1 IN A 10.1.1.1
mx2 IN A 10.1.1.2
www IN CNAME domain.tld.
```
Les point-virgules indiquent les commentaires
## Exercice 6 (facultatif)
Installer bind (`apt install bind9`). Par défaut il est configuré comme résolveur récursif local. L'utiliser pour faire des requêtes locales, par exemple : `dig www.cesi.fr @localhost`
## Exercice 7 (facultatif)
Mettre en place la zone bind créée à l'exercice 6 dans l'installation du Bind local. Un tuto utile : [https://www.adrienfuret.fr/2017/09/04/debian-dns-bind/](https://www.adrienfuret.fr/2017/09/04/debian-dns-bind/)
Tester le fonctionnement avec dig : `dig domain.tld @localhost`

440
cesi/hebergement_web/02-http.md Normal file
View File

@ -0,0 +1,440 @@
% Introduction au HTTP
% Sylvain Eliade — S.C.O.P. Cadoles
% Mai 2019
## Introduction au HTTP
* HyperText Transport Protocol
* Protocole texte
* Client-serveur
* En général sur TCP, port 80
* Stateless, aucun état n'est conservé entre les requêtes
* Très simple
* Requêtes **toujours** initiées par le client
---
## À quoi ça ressemble ?
Un simple `telnet` permet de faire des requêtes HTTP !
```
% telnet sylvain.eliade.net 80
Trying 91.121.181.110...
Connected to eliade.net.
Escape character is '^]'.
GET /resume/ HTTP/1.1
Host: sylvain.eliade.net
```
---
Le serveur nous répond :
```
HTTP/1.1 200 OK
Date: Mon, 13 May 2019 10:02:02 GMT
Server: Apache
Last-Modified: Fri, 19 Apr 2019 07:36:32 GMT
ETag: "2abb-586dd2d7c21de"
Accept-Ranges: bytes
Content-Length: 10939
Vary: Accept-Encoding
Content-Type: text/html
Connection: close
<!DOCTYPE html>
<html>
…
```
---
Un outil plus pratique est quand même `curl` !
```
% curl -v http://sylvain.eliade.net/resume/
```
---
## Structure d'une requête
Première ligne : `MÉTHODE RESSOURCE PROTOCOLE`
* Méthode (ou verbe) HTTP = action que l'on souhaite utiliser (`GET`, `DELETE`, `POST`, etc.)
* Ressource sur laquelle on souhaite effectuer l'action
* Version du protocole : `HTTP/1.0` ou `HTTP/1.1` (il existe encore des clients HTTP/0.9 mais bon…)
Lignes suivantes : les entêtes. Puis : une ligne vide.
Puis éventuellement (méthodes `POST`, `PUT`, `PATCH`, etc.) : corps (contenu) de la requête.
---
### Méthodes HTTP
* GET : la plus courante, renvoie la ressource demandée (exemple : visualiser une page web)
* POST : envoyer des données liées à la ressource (exemple : envoyer un formulaire web)
Les méthodes suivantes sont rarements utilisées par les navigateurs mais souvent dans les API :
* HEAD : obtenir des infos sur la ressource. En pratique c'est souvent pareil que GET, mais ça ne renvoie que les entêtes et pas le corps.
* PUT : ajouter / remplacer une ressource
* OPTIONS : savoir quelles sont les méthodes supportées par le serveur pour une ressource
---
## Structure d'une réponse
Première ligne : `PROTOCOLE CODE MESSAGE`
* Code = code de réponse du serveur (200 = OK, 404 = Not Found, etc.)
* Message = message de réponse associé au code
Lignes suivantes : les entêtes de réponse.
Puis : une ligne vide.
Puis éventuellement (tout le temps sauf avec requête `HEAD`) : corps de la réponse.
---
### Codes de réponses HTTP
Le premier chiffre indique le type de code :
* 1xx = requête reçue mais son exécution n'est pas terminée
* 2xx = succès
* 3xx = redirection
* 4xx = erreur du client
* 5xx = erreur du serveur
---
### Codes courants
* 200 OK = la plus courante
* 301 Moved Permanently = ressource déplacée définitivement (voir l'entête `Location` pour la nouvelle adresse)
* 302 Found = ressource déplacée temporairement
* 400 Bad Request = erreur dans la requête du client
* 401 Unauthorized = le client n'a pas accès, il lui faut s'authentifier
* 403 Forbidden = accès refusé (par exemple mauvais login/mot de passe)
* 404 Not Found = ressource non trouvée
* 500 Internal Server Error
* 503 Service Unavailable = serveur surchargé
---
## Entêtes
```
Host: sylvain.eliade.net
User-Agent: telnet/1.0
```
Chaque entête est une clé (en général avec une majuscule au début de chaque mot, les mots étant séparés par des tirets), suivi de deux points `:`, d'un espace et de la valeur de l'entête.
Liste des entêtes : [https://en.wikipedia.org/wiki/List_of_HTTP_header_fields](https://en.wikipedia.org/wiki/List_of_HTTP_header_fields)
---
### Entêtes courants pour les requêtes
* `Host` : pour indiquer le nom de domaine que l'on essaye d'atteindre (car le serveur HTTP ne sais pas quelle requête DNS on a fait pour le contacter)
* `Accept-Language` : indique les langues préférées du client (`fr-BE, fr, en-AU, en`)
* `Accept` : les formats de fichier gérés par le client (`text/html, image/jpeg…`)
* `Connection` : pour garder la connexion TCP ouverte pour faire plusieurs requêtes de suite
* `User-Agent` : nom du client utilisé
* `Cookie` : contenu d'un cookie
* `Authorization` : identifiants de connexion HTTP (accès par mot de passe)
---
### Entêtes courants pour les réponses
* `Connection` : état de la connexion TCP
* `Date` : date de réponse
* `Content-Type` : type du contenu (`text/html; charset=utf-8`)
* `Location` : nouvelle adresse du contenu quand il a changé d'adresse
* `Server` : nom du serveur
* `Set-Cookie` : le client doit enregistrer ce cookie
* `WWW-Authenticate` : demande d'authentification
---
## Aparté : les URLs
Uniform Resource Locator (interchangeable avec URI, Uniform Resource Identifier)
`protocol://[user[:password]@]host[:port]path[?query][#fragment]`
Entre crochets les parties facultatives.
---
* protocol : http ou https
* user[:password] : nom d'utilisateur (et éventuellement mot de passe), pour l'authentification HTTP
* host : nom de domaine (ou adresse IP, pour une IPv6 elle doit être entre crochets, exemple : `http://[::1]/page`)
* port : numéro de port optionnel
* path : chemin de la ressource
* query (ou query string) : liste de clés et valeurs, séparées par des `&`
* fragment : identifiant d'une sous-ressource à l'intérieur de la ressource (en pratique, utilisé pour se rendre à une point particulier de la page web, ou en javascript)
---
`https://catalogue.cesi.fr/recherche/?domaine=informatique&niveau=bac4#type`
* protocol: `https`
* host: `catalogue.cesi.fr`
* path: `/recherche/`
* query: `domaine=informatique&niveau=bac4`
* fragment: `type`
---
## Les serveurs HTTP les plus courants
* Apache (29% des serveurs)
* nginx (29%) : plus rapide qu'Apache sur les fichiers statiques, même performance sur le contenu dynamique (PHP)
* Microsoft IIS (19%)
Apache est le plus courant, historiquement le plus utilisé, mais on trouve de plus en plus du nginx aussi. La configuration de nginx est un peu plus lisible que celle d'Apache.
---
## Apache et ses MPM
Apache possède plusieurs MPM (multi-processing module) qui ont des comportements différents :
* prefork : moins performant (sans threads), chaque processus ne peut traiter qu'une seule requête à la fois
* worker ou event : plus performant, chaque processus a plusieurs threads, et peut donc traiter plusieurs requêtes à la fois
Quel MPM choisir ? En production on utilisera *worker* ou *event*, car plus rapides, mais pour tester des trucs rapidement avec PHP on peut utiliser *prefork* qui est plus simple à metter en place.
---
## Un mot sur l'utilisateur www-data
Par défaut Apache est lancé avec l'utilisateur `www-data`. Ça va si on n'a qu'un seul site hébergé sur la machine.
Si on veut héberger plusieurs sites, il vaut mieux pouvoir avoir un utilisateur par site, pour pas qu'un site puisse aller modifier les fichiers d'un autre site.
Pour cela une version de *prefork* appelée **ITK** (`apt install libapache2-mpm-itk`) permet d'avoir des processus Apache qui se lancent avec les droits d'utilisateurs différents.
---
## Installation Apache sous Debian
* Installer le serveur : `apt install apache2`
* Statut du serveur : `apache2ctl status` (permet de voir les requêtes traitées en ce moment, le nombre de *workers* etc.)
* Tester si la config n'a pas d'erreur : `apache2ctl configtest`
* Recharger la configuration après modification : `apache2ctl graceful`
---
## Gérer les modules Apache sous Debian
* Activer un module : `a2enmod NOM_DU_MODULE` (exemple : `a2enmod rewrite`)
* L'outil préviendra s'il y a un conflit entre deux modules incompatibles :)
* Désactiver : `a2dismod NOM_DU_MODULE`
* Même chose pour les MPM : `a2dismod mpm_prefork` puis `a2enmod mpm_worker`
Astuce : lancer `a2enmod` sans argument liste les modules disponibles.
La configuration du module est dans le fichier `/etc/apache2/mods-available/NOM_DU_MODULE.conf`
---
## Configuration Apache
Syntaxe simple. Ce n'est pas du XML !
```
Listen 80
KeepAlive Off # Ne pas autoriser les connexions persistantes
<Directory /var/www/monsite>
Require all granted
Options -Indexes
</Directory>
```
---
## VirtualHost
Apache permet d'héberger plusieurs sites sur le même serveur avec des hôtes virtuels. L'hôte est reconnu avec l'entête "Host". Pour cela on utilise des hôtes virtuels.
```
<VirtualHost *:80>
ServerName cadoles.com
DocumentRoot /var/www/monsite
</VirtualHost>
<VirtualHost *:80>
ServerName mail.cadoles.com
DocumentRoot /var/www/roundcube
</VirtualHost>
```
Le premier vhost de la liste sera utilisé comme vhost "par défaut" si aucun vhost n'est trouvé pour l'hôte demandé.
---
### VirtualHost dans Debian/Ubuntu
Les vhost disponibles sont séparés par fichiers dans `/etc/apache2/sites-available`, triés par ordre alpha-numérique.
Ensuite : `a2ensite nomduvhost` pour activer, ou `a2dissite nomduvhost` pour désactiver.
Ne pas oublier de tester la config et recharger ensuite !
Astuce : lancer `a2ensite` ou `a2dissite` sans argument liste les sites disponibles.
---
## Fichiers .htaccess
Apache permet de configurer des options pour un répertoire donné à l'aide d'un fichier `.htaccess` (en UNIX, les fichiers avec un point au début sont des fichiers "cachés").
C'est pratique, mais attention, cela veut dire qu'Apache sera beaucoup plus lent, car il va chercher ce fichier dans tous les sous-répertoires à chaque requête !
Donc il est recommandé de désactiver ce comportement par défaut, et de ne l'activer que pour les sites qui en ont besoin. Tant que possible il vaut mieux mettre toute la configuration dans les fichiers de configuration Apache du vhost.
---
```
<Directory />
AllowOverride None
</Directory>
<Directory /var/www/wordpress>
AllowOverride All
</Directory>
```
[AllowOverride](https://httpd.apache.org/docs/2.4/mod/core.html#allowoverride) permet de configurer le type de directive autorisée dans le fichier `.htaccess`.
None = aucune directive autorisée = Apache ne va même pas lire les fichier `.htaccess`
---
## Restriction d'accès
Un exemple courant de `.htaccess` est la restriction d'accès par mot de passe. Pour cela il faut dire à Apache de n'autoriser que les utilisateurs connectés avec `Require valid-user` :
```
Require valid-user
AuthType basic
AuthName "Accès restreint"
AuthUserFile /var/www/monsite/secret/.htpasswd
```
---
### Fichier htpasswd
Pour créer le fichier `.htpasswd` qui contiendra la liste de nos utilisateurs autorisés et leurs mots de passe nous devons utiliser l'outil `htpasswd`.
A installer avec `apt install apache2-utils`.
---
* Créer le fichier avec `htpasswd -c /var/www/monsite/secret/.htpasswd NOM_UTILISATEUR` (`-c` comme **Création** du fichier)
* L'outil demande de taper, puis re-taper le mot de passe
* Pour ajouter un utilisateur ou modifier son mot de passe, simplement : `htpasswd /var/www/monsite/secret/.htpasswd NOM_UTILISATEUR` (sans le `-c` donc)
```
sylvain:$apr1$vfxnPOnt$gI7MkAizYirxT/CrUfCqU0
```
---
## Exercice 1
Faire une requête avec `curl` sur `http://www.cesi.fr/`. Quel est le code HTTP retourné ? Quel est le serveur web utilisé ?
---
## Exercice 2
Installation de Apache2. Faire une requête sur `http://localhost/` pour voir si ça fonctionne.
Puis essayer d'accéder à l'IP de la VM depuis un navigateur de la machine hôte pour voir si ça fonctionne bien.
(Pour obtenir l'IP : `ip addr` depuis la console)
---
## Exercice 3
Prérequis : créer un répertoire `/var/www/cesi.test` et un fichier `/var/www/cesi.test/index.html` avec :
```
mkdir /var/www/cesi.test
echo "Hello monde !" > /var/www/cesi.test/index.html
```
Exercice : Mettre en place un VirtualHost `cesi.test` proprement, l'activer.
Pour vérifier son fonctionnement, ajouter la ligne suivante dans `/etc/hosts` : `127.0.0.1 cesi.test`. Puis faire `curl http://cesi.test/`, le message "Hello monde" devrait apparaître.
---
## Exercice 4
Prérequis : créer un répertoire `/var/www/cesi.test/secret` : `mkdir /var/www/cesi.test/secret`
Désactiver les vhosts existants, sauf celui de `cesi.test`. Recharger apache.
Mettre en place une protection par mot de passe du répertoire `/var/www/cesi.test/secret` avec un fichier `.htaccess`.
Vérifier que ça marche correctement en utilisant le navigateur de la machine hôte sur l'IP de la VM.
---
## Exercice 5 (facultatif)
Tester la charge du serveur avec ApacheBench :
* installer `ab` : `apt install apache2-utils`
* dans une première console, lancer `watch -d -n 0.1 sudo apache2ctl status`
* lancer dans une seconde console `ab -n 5000 -c 100 http://localhost/` (va lancer 5000 requêtes, par vagues de 100 en même temps)
* observer l'évolution du nombre de workers, et de la charger serveur (*Server load*)
---
## Exercice 6 (facultatif)
Changer de MPM, passer de *prefork* (celui utilisé par défaut normalement) à *event*.
Répéter le test de l'exercice 5 et observer les différences.
---
## Exercice 7 (facultatif)
On nous demande de faire de la réécriture d'adresse.
Faire en sorte que `http://cesi.test/etu` redirige vers `http://localhost/infos-etudiant` en utilisant la directive `Redirect` dans le vhost créé précédemment (voir la [documentation de Redirect](https://httpd.apache.org/docs/2.4/mod/mod_alias.html#redirect) pour un exemple).
Pour cela il faudra activer le module `alias`.
Il est courant d'utiliser `RewriteRule` pour faire cela (module `rewrite`), mais il est plus lent et complexe ([Documentation](https://httpd.apache.org/docs/2.4/rewrite/intro.html)), mais permet plus de possibilités.
---
## Exercice 8 (facultatif)
Installer `nginx` et créer un virtualhost `cesi.test`.
Un exemple de configuration de virtualhost est dispo dans `/etc/nginx/sites-available/default`.
Pour créer le vhost, créer un fichier `/etc/nginx/sites-available/cesi.test`.
Pour l'activer exécuter `ln -s /etc/nginx/sites-available/cesi.test /etc/nginx/sites-enabled/cesi.test`, cela va créer un lien symbolique (pas de commande comme avec Apache type `a2ensite`).
Puis `nginx -t` pour vérifier la configuration et `service nginx reload` pour recharger.

174
cesi/hebergement_web/03-https.md Normal file
View File

@ -0,0 +1,174 @@
% Introduction au HTTPS
% Sylvain Eliade — S.C.O.P. Cadoles
% Mai 2019
## Introduction au HTTPS
* HTTP encapsulé dans une connexion chiffrée
* Historiquement avec le protocole SSL
* Aujourd'hui c'est TLS
---
## Chiffrement à clé publique et privée
* La clé publique est distribuée (non secrète) et ne sert qu'à chiffrer
* La clé privée est secrète et sert à déchiffrer
Le serveur possède une clé privée (secrète) et une clé publique (appelée certificat), signée par une *autorité*.
---
## Certificats
* Prouve l'identité du propriétaire du certificat
* Doivent être signés par une autorité reconnue (ou plusieurs)
* Peuvent être signés par soi-même (*self signed*) mais c'est relou (difficile à utiliser), et du coup ça ne prouve pas grand chose
---
## Autorités
* Système hiérarchique (une autorité peut signer des certificats d'une sous-autorité, etc.) : on parle de *chaîne* de certificats
* Combine des acteurs publics (états, ministères, etc.) et privés (entreprises)
* On doit avoir confiance envers ces autorités
* Chaque OS a un « app store » de certificats d'autorités (paquet `ca-certificates` dans Debian/Ubuntu)
* Système centralisé, moyennement sûr (nombreux cas d'autorités qui font n'importe quoi)
* Un peu mieux depuis Let's Encrypt
---
## Phase de négociation (handshake) TLS
![](./img/tls_handshake.gif)
---
En simplifié :
1. Le client se connecte au serveur, lui indique les protocoles cryptographiques qu'il supporte (cipher suite)
2. Le serveur lui répond, en indiquant le protocole choisi, ainsi que son certificat public (signé par une autorité).
3. Le client vérifie le certificat.
4. Échange de clé entre le client et le serveur. Cette clé est spécifique à cette session entre client et serveur.
Ensuite le client et le serveur communiquent en HTTP entre eux, mais tout est chiffré à l'aide des clés échangées.
---
La phase de négociation ne se reproduit pas à chaque requête HTTP : normalement la connexion TLS reste ouverte une ou deux minutes, permettant de faire passer d'autres requêtes.
De même, les étapes 1 à 3 peuvent être ignorées quand le serveur et le client se connaissent déjà et ont encore les infos de chacun en cache.
---
## Vérification OCSP
A l'étape 3, le client peut aller vérifier auprès d'un serveur OCSP (*Online Certificate Status Protocol*) que le certificat du serveur est bien valide.
De nos jours, le serveur peut s'en charger lui-même (*OCSP stapling*), il envoie une certification OCSP (avec la date) au client : évite un aller-retour du client avec le serveur OCSP.
---
## SNI (Server Name Indication)
Rappel du HTTP : le nom d'hôte demandé est transmis dans l'entête `Host` de la requête HTTP.
Donc : l'hôte demandé est dans la requête chiffrée, AVANT que le serveur web ne puisse savoir quel certificat utiliser pour le HTTPS !
Solution : le SNI !
---
* Le nom d'hôte demandé est inscrit dans la connexion TLS par le client
* Très bien supporté de nos jours (si pas supporté : utilisation du vhost par défaut)
* Inconvénient : le nom n'est pas chiffré (possibilité d'interception pour voir quel site vous visitez)
---
## Configuration Apache HTTPS
Attention : il faut créer un vhost différent, car le port est différent.
```
<VirtualHost *:443>
ServerName cesi.test
SSLEngine on
SSLCertificateFile "/var/www/certs/cesi.cert"
SSLCertificateKeyFile "/var/www/certs/cesi.private"
</VirtualHost>
```
Si on a un site en HTTPS il est recommandé que la version HTTP ne fasse que rediriger vers le site en HTTPS (plus simple niveau config serveur).
---
## Let's Encrypt
* Autorité de certification à but non lucratif qui délivre des certificats signés gratuits.
* Avant LE, il fallait payer (en général cher) pour avoir un certificat signé par une autorité !
* Inconvénient : durée du certificat limitée à 90 jours.
* Inconvénient : ne marche pas pour les domaines privés (réseau privé).
* Plusieurs manières de valider qu'on est bien propriétaire d'un domaine : HTTP ou DNS
* Plusieurs clients : certbot, dehydrated, etc.
---
## Let's Encrypt : certbot
* `# apt install certbot python-certbot-apache`
* `# certbot --apache`
C'est tout, il va poser des questions et va tout configurer à votre place… Mais des fois ça ne marche pas trop du coup quand notre configuration est un peu complexe.
---
## Let's Encrypt : [dehydrated](https://github.com/lukas2511/dehydrated)
Plus léger que certbot, un peu plus manuel.
* `# apt install dehydrated dehydrated-apache2`
* Ajouter les noms de domaine dans le fichier `/etc/dehydrated/domains.txt` (un par ligne)
* Lancer `dehydrated -c`
* Configurer son vhost :
```
SSLCertificateFile /var/lib/dehydrated/certs/example.org/fullchain.pem
SSLCertificateKeyFile /var/lib/dehydrated/certs/example.org/privkey.pem
```
Tester la config et recharger Apache.
---
## Attention !
Dans certains cas, `apache2ctl configtest` ne renvoie pas d'erreur s'il y a un problème au niveau des certificats, mais ensuite le `reload` (ou `graceful`) plantera !
Exemple : si on utilise `chain.pem` de Let's encrypt (qui ne contient que la chaîne de certification, et pas le certificat lui-même) à la place de `fullchain.pem`.
Solution : vérifier `/var/log/apache2/error.log` après un reload si on a modifié des trucs dans la config SSL !
---
## Exercice 1
Installer `dehydrated` et le configurer pour le domaine `cesi.sylvain.eliade.net`. Lancer dehydrated.
Il va tenter de vérifier l'appartenance du domaine et échouer (logique). A la place, prendre les fichiers `.pem` fournis et les recopier dans le bon répertoire.
Configurer un vhost Apache pour ce domaine, utilisant les certificats fournis. Ne pas oublier d'activer `mod_ssl` : `a2enmod ssl` et redémarrer Apache.
Dans `/etc/hosts` inscrire une ligne avec `127.0.0.1 cesi.sylvain.eliade.net`.
Tester la config avec curl, et si possible le navigateur de la machine hôte.
## Exercice 2 (facultatif)
Générer un certificat auto-signé :
```
# mkdir /etc/ssl/localcerts/
# openssl req -new -x509 -days 365 -nodes -out /etc/ssl/localcerts/apache.pem -keyout /etc/ssl/localcerts/apache.key
```
Le mettre en place dans Apache, et vérifier que ça fonctionne avec un navigateur (qui affichera un message d'avertissement).

271
cesi/hebergement_web/04-dynamique.md Normal file
View File

@ -0,0 +1,271 @@
% Introduction au web dynamique
% Sylvain Eliade — S.C.O.P. Cadoles
## Introduction web dynamique
* Dans le web *statique*, le serveur web ne fait que renvoyer le contenu d'un fichier existant
* Dans le web *dynamique*, le serveur web délègue la génération du contenu à un sous-programme
* Ce sous-programme peut réagir aux demandes de l'utilisateur, retourner des données d'une base de données, etc.
---
## Script CGI
À l'origine, le serveur web interagissait avec des scripts CGI (Common Gateway Interface) : il exécutait un programme, auquel il passait les données de la requête HTTP, et retournait ce que le script lui renvoyait.
---
Configuration Apache :
```
<Directory "/var/www/cesi.test">
Options +ExecCGI
AddHandler cgi-script .cgi
</Directory>
```
---
Exemple de script basique `date.cgi`
```
#!/bin/bash
echo "Content-type: text/html"
echo ""
echo "Nous sommes le "
date
```
Résultat :
```
Nous sommes le mercredi 15 mai 2019, 14:38:57 (UTC+0200)
```
---
Exemple d'interaction avec la requête `methode.cgi` :
```
#!/bin/bash
echo "Content-type: text/html"
echo ""
echo "Méthode de requête utilisée : "
echo "$REQUEST_METHOD"
```
Résultat :
```
Méthode de requête utilisée : GET
```
---
Avantage : très simple !
Inconvénient : peu performant, chaque requête crée un nouveau processus qui est détruit à la fin de la requête.
---
## FastCGI
* Un second serveur (FastCGI), qui communique avec le serveur web
* Il garde le processus lancé en permanence
* Il reçoit les requêtes du serveur web
* Il lui envoie des requêtes et reçoit des réponses
* Il renvoie les réponses au serveur web
Ainsi il n'y a plus de création/destruction de processus, plus rapide. De plus le serveur FastCGI peut avoir plusieurs processus lancés en même temps, et répartir les requêtes. C'est un modèle similaire aux *workers* Apache !
---
## Présentation de PHP
* Langage de programmation
* Créé en 1994
* Originellement conçu comme proche de Perl et C
* Pour faire des pages web dynamiques (en CGI !)
* Mal considéré (à tort)
* Utilisé sur 79% des sites web (WordPress sur 32% des sites !)
---
### Les versions
* PHP 7 est 2-3 fois plus rapide que PHP 5.6
* PHP 5 n'est plus supporté (plus de mises à jour de sécurité), PHP 7.0 non plus !
Les versions de PHP sont supportées environ 3 ans (mais les distributions peuvent allonger ce délai en backportant les correctifs).
Moralité : beaucoup de boîtes sont à la ramasse, et se traînent des PHP qui ne sont pas à jour… Et ça peut durer longtemps.
---
### A quoi ça ressemble ?
```
<?php
echo "Aujourd'hui nous sommes le ";
echo date('d/m/Y');
```
---
```
<?php
$colors = ['blue', 'white', 'rainbow', 'yellooooollipop'];
$color = $colors[array_rand($colors)];
?>
<p>My favorite unicorn color is <?=$color?></p>
…
```
## Installation et configuration de PHP
Il existe plusieurs versions de PHP :
* En ligne de commande : CLI (`apt install php-cli`), utile pour lancer des scripts, tester rapidement avec le serveur web intégré…
* mod_php pour Apache (`apt install libapache2-mod-php`)
* FPM (FastCGI Process Manager) pour serveur web (`apt install php-fpm`)
---
### PHP CLI
Cette version en ligne de commande permet de lancer un script (`php monscript.php`) ou un serveur web de test pour essayer un site, etc. (`php -S localhost:8080 /var/www/monsite` et le site sera joignable sur http://localhost:8080/).
Le serveur web ne peut traiter qu'une seule requête en même temps… pas très indiqué pour un vrai site web !
---
### mod_php
* Très simple à mettre en place
* Nécessite mpm-prefork = pas très rapide
* Convient pour des petits sites
Rien à configurer dans Apache : les fichiers `.php` seront exécutés directement.
---
### Rappel sur MPM-ITK
Pour configurer MPM-ITK sur un vhost pour qu'il se limite à utilisateur :
```
<IfModule mpm_itk_module>
AssignUserId USER GROUP
</IfModule>
```
---
### FPM
* Basé sur FastCGI
* Crée un serveur d'application PHP
* Un peu de configuration à faire
* Permet de créer plusieurs *pools* pour des sites/utilisateurs différents
* Rapide !
---
## Configuration FPM
Création de pool dans `/etc/php/7.0/fpm/pool.d/cesi.conf` :
```
[cesi]
…
user = cesi
group = cesi
…
listen = /run/php/php7.0-fpm-cesi.sock
```
---
Configuration du VHost :
```
<FilesMatch \.php$>
SetHandler "proxy:unix:/run/php/php7.0-fpm-cesi.sock"
</FilesMatch>
```
---
## Exercice 1
Faire un script PHP qui va afficher la date du jour.
L'exécuter avec `php` en ligne de commande.
---
## Exercice 2
Installer `mod_php`.
Déplacer le script créé dans un répertoire d'un vhost existant.
Vérifier sa bonne exécution avec curl, ou un navigateur.
---
## Exercice 3
Prérequis : avoir au moins deux vhosts actifs différents.
* Créer un utilisateur par vhost avec `useradd -G www-data USER`
* Installer et activer le MPM ITK de Apache.
* Pour chaque vhost, configurer le vhost pour utiliser ITK et l'utilisateur du vhost et le groupe *www-data* (via `AssignUserId`)
Puis :
Dans chaque répertoire de chaque vhost mettre un fichier `compteur.php` dont le contenu est :
```
<?php
if (file_exists('stats.txt')) {
$nb_visites = file_get_contents('stats.txt');
}
else {
$nb_visites = 0;
}
$nb_visites++;
file_put_contents('stats.txt', $nb_visites);
echo "Vous êtes le visiteur n° " . $nb_visites;
```
Vérifier que les permissions de chaque répertoire de chaque vhost sont restreintes à l'utilisateur du vhost ! (et les fichiers du répertoire)
Enfin : visiter le fichier `compteur.php` de chaque vhost. Vérifier les utilisateurs propriétaires des fichiers `stats.txt`.
---
## Exercice 4
Installer `php-fpm`.
Activer avec `a2enmod proxy_fcgi setenvif` et `a2enconf php7.0-fpm`.
Créer un fichier `fcgi.php` contenant `<?php echo php_sapi_name();` et vérifier qu'il renvoie bien `fpm-fcgi` quand il est consulté.
---
## Exercice 5 (facultatif)
Mettre en place au moins deux pools FPM avec deux utilisateurs différents pour deux vhosts différents, comme avec ITK, mais avec FPM.

306
cesi/hebergement_web/05-security.md Normal file
View File

@ -0,0 +1,306 @@
% Introduction à la sécurité d'un serveur web
% Sylvain Eliade — S.C.O.P. Cadoles
## Introduction à la sécurité d'un serveur web
## Fail2ban
S'il ne faut en retenir qu'un c'est celui-là !
`apt install fail2ban`
Il lit les logs en permanence et détecte les tentatives d'intrusion (mauvais mot de passe SSH, email, HTTP…) et bloque les IP automatiquement !
Activer les filtres dans `/etc/fail2ban/jail.conf` (passer `enabled` à `true`). Normalement la plupart des filtres nécessaires sont activés par défaut, mais ça vaut le coup de regarder si on peut en activer d'autres, ou de faire les siens !
## Mises à jours de sécurité
Ça semble évident, mais ça ne l'est pas pour tout le monde.
Activer les mises à jour automatique de sécurité avec `unattended-upgrades`.
```
apt install unattended-upgrades
```
---
## Pare-feu (firewall)
Sous Linux, les ports sont fermés par défaut si un service n'écoute pas dessus, donc c'est "sécurisé" par défaut. Alors pourquoi un firewall ?
Parce que si un attaquant parvient à ouvrir un port sur votre machine il peut s'en servir pour lui donner des ordres, ou faire des requêtes vers d'autres machines (par exemple transformer votre serveur en attaquant DDoS).
Du coup un firewall est utile pour restreindre le risque en cas d'attaque.
---
## Pare-feu Linux
Le noyau Linux contient déjà un pare-feu, c'est Netfilter, accessible via la commande `iptables`.
Comme elle est un peu complexe, on conseille en général d'utiliser `ufw` (Uncomplicated FireWall), qui est une interface iptables simplifiée.
---
## UFW
Installer avec `apt install ufw`, et activer avec `ufw enable`.
Consulter le statut avec `ufw status verbose`.
```
Status: active
Logging: on (low)
Default: deny (incoming), allow (outgoing), disabled (routed)
New profiles: skip
```
Lister les règles disponibles : `ufw app list`
---
(Dés)Activer le blocage par défaut :
```
ufw default allow incoming
ufw default deny outgoing
```
Activer un service :
```
ufw allow in WWW
ufw allow out VNC
```
---
Autoriser un port :
```
ufw allow 53
ufw allow 25/tcp
```
Bloquer une IP :
```
ufw deny from X.X.X.X to any
```
---
## Restriction par IP
Si on veut restreindre l'accès à un serveur web à certaines IP il y a plusieurs stratégies possibles :
* au niveau du firewall (mieux, car le plus tôt dans la connexion réseau)
* via TCP Wrappers ou systemd
* via le serveur web
---
## Avec UFW
```
ufw deny 80
ufw allow from X.X.X.X to any port 80
```
---
## TCP Wrappers
Mécanisme ancien, simple, mais aujourd'hui on utilise un firewall.
Malgré le nom, il gère aussi UDP.
La configuration se fait dans les fichiers `/etc/hosts.allow` et `/etc/hosts.deny`.
N'est plus supporté par systemd.
---
```
# /etc/hosts.allow
sshd: 192.168.1.0/255.255.255.0
# /etc/hosts.deny
sshd: ALL
````
---
## Restriction avec systemd
Se fait au niveau du fichier `.service` :
```
IPAddressDeny=1.1.1.1
IPAddressAllow=8.8.8.8
```
Encore une fois, mieux vaut préférer un firewall.
---
## Restriction avec Apache
Avantage : peut se faire par répertoire, vhost, fichier…
Tout autoriser sauf une IP :
```
<RequireAll>
Require all granted
Require not ip 10.252.46.165
</RequireAll>
```
---
Tout bloquer sauf si connexion valide OU adresse IP spécifique :
```
<RequireAll>
Require all denied
<RequireAny>
Require ip 192.168.1.12
Require valid-user
</RequireAny>
</RequireAll>
```
---
## Ne pas se tirer une balle dans le pied
* Utiliser PHP 7.2 ou 7.3 ! Abandonnez PHP 5 et PHP 7.0 (plus supportés !) ! Enfin si c'est possible…
* Configurer le serveur web pour n'écouter que sur l'interface / port nécessaire (`/etc/apache2/ports.conf`)
* Ne pas exposer sa version de PHP ou Apache (ou nginx)
* Désactiver le vhost par défaut d'apache, dont la page HTML peut contenir des infos utiles à un attaquant
* Bloquer l'accès aux répertoires .svn et .git !
```
RedirectMatch 404 /\.git
RedirectMatch 404 /\.svn
```
---
## Cacher les versions
Pourquoi ? Contre les bots qui scannent les serveurs pas à jour.
Dans `/etc/apache2/conf-enabled/security.conf` :
```
ServerTokens Prod
ServerSignature Off
```
---
Avant :
`Server: Apache/2.4.25 (Debian)`
Après :
`Server: Apache`
---
Dans `/etc/php/7.0/apache/conf.d/local.ini` ajouter :
```
expose_php = off
```
---
## Restreindre la surface d'attaque (Apache)
Désactiver les index de répertoires, l'exécution de CGI, les liens symboliques et les inclusions :
```
<Directory />
Options -Indexes -ExecCGI -FollowSymLinks -Includes
</Directory>
```
Désactiver les .htaccess si possible.
---
## Restreindre la surface d'attaque (PHP)
Restreindre les répertoires accessibles de PHP (dans le vhost Apache) :
```
php_admin_value open_basedir /var/www/monsite.com
```
Interdire l'exécution de programme externe :
```
disable_functions = exec,passthru,shell_exec,system,proc_open,popen
```
à mettre dans le `/etc/php/7.0/apache/conf.d/local.ini`, ou dans un `php_admin_value` par vhost.
---
## Aller plus loin
Vérifier sa config :
* Audit automatisé : mieux que ne rien faire, mais à ne pas faire en prod, laisse pas mal de traces (logs), peut surcharger le serveur
* Audit manuel : de bonnes connaissances en sécu, ou un bon chéquier !
* Hardening PHP : ça restreint certaines fonctions et attaques, mais c'est bien mais ça peut casser des applis :(
* WAF (Web Application Firewall) : idem, ça détecte des attaques connues, bonne stratégie défensive, mais attention aux effets de bord.
---
* [Auditer son site avec Nikto](https://doc.ubuntu-fr.org/nikto)
* [Hardening PHP : snuffleupagus (Apache)](https://github.com/nbs-system/snuffleupagus)
* [Tester son certificat SSL avec SSL Labs](https://www.ssllabs.com/ssltest/)
* [Mise en place de WAF avec mod_security pour Apache](https://www.it-connect.fr/installation-de-mod_security-devant-un-serveur-web-apache/)
* [WAF pour nginx avec naxsi](https://www.digitalocean.com/community/tutorials/how-to-secure-nginx-with-naxsi-on-ubuntu-16-04)
---
## Exercice 1
Installer `ufw` et n'autoriser que le port 80 en entrée.
Vérifier avec :
```
nmap -p 80 ADRESSE_IP
nmap -p 443 ADRESSE_IP
```
La première doit renvoyer que le port est ouvert, mais pas la seconde.
---
## Exercice 2
Modifier le `.htaccess` du répertoire `secret` précédemment créé pour autoriser aussi l'adresse IP `127.0.0.1` à y accéder sans mot de passe.
Vérifier avec curl.
---
## Exercice 3
Cacher les versions de PHP et Apache. Vérifier avec Curl.
---
## Exercice 4 (facultatif)
Installer Nikto et scanner les vhosts du serveur web. Nikto est dans les dépôts `non-free` de Debian : https://debian-facile.org/doc:systeme:apt:sources.list:sources.list-non-free

11
cesi/hebergement_web/Makefile Normal file
View File

@ -0,0 +1,11 @@
.PHONY: slides pdf all
all: slides pdf
slides:
for i in 0*.md; do pandoc -t s5 -s -o $$i.html $$i; done;
rename 's/.md.html/.html/' *.html
pdf:
for i in 0*.html; do prince $$i; done;
rename 's/.html.pdf/.pdf/' *.pdf

37
cesi/hebergement_web/README.md Normal file
View File

@ -0,0 +1,37 @@
Préparation pour intervenant :
== Partie 1 - DNS
1. Mettre en place un enregistrement CNAME d'un sous-domaine qui pointe sur un autre sous-domaine qui n'existe pas.
2. Bonus si possible : désynchroniser le DNS primaire et les secondaires de la zone pour que seul le primaire ait le CNAME, et que le serial du SOA soit différent entre primaire et secondaire.
== Partie 2 - HTTP
Rien à faire.
== Partie 3 - HTTPS
Faire signer un sous-domaine réel (mais non utilisé) par Let's Encrypt, et recopier le certificat (fullchain.pem et privkey.pem) pour que les étudiants puissent mettre en place ce vhost signé sur leur VM.
== Partie 4 - Web dynamique
== TODO - améliorations et idées à prendre en compte pour prochaine session
- pas assez de schémas visuels dans les slides / supports
- texte (tags pre) qui dépassent des slides
Difficultés rencontrées le 16 mai 2019 :
- DNS : problèmes de DNS menteur sur certains réseaux 4G (Bouygues) qui altèrent les réponses DNS
- mauvaise assimilation / confusion sur différence entre IP et host DNS, confusion entre host DNS et vhost HTTP chez certains étudiants (environ 3-4 sur 17)
- certains recopient de tutos datés du net sans réfléchir…
- certains ne lisent pas les énoncés…
- rythme relativement soutenu, parfois un peu dur pour les élèves de suivre d'une partie à l'autre (beaucoup de sujets abordés)
Idées pour la partie DNS :
- Mettre en place un DNS sur réseau local, avec un TLD virtuel, et pouvoir déléguer des zones NS à chacun des postes des étudiants, pour qu'ils puissent mettre en place leur propre serveur autoritaire et se faire des requêtes entre eux
Pour le web dynamique ça serait bien de leur faire installer un CMS flatfile (pas de base de données, pour simplifier).

142
cesi/hebergement_web/img/hierarchie_dns.svg Normal file
View File

@ -0,0 +1,142 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="951"
height="519"
version="1.1"
id="svg4707"
sodipodi:docname="DNS_schema.svg"
inkscape:version="0.92.1 r15371">
<metadata
id="metadata4713">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs4711" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1918"
inkscape:window-height="1055"
id="namedview4709"
showgrid="false"
inkscape:zoom="0.67893756"
inkscape:cx="752.78408"
inkscape:cy="272.96054"
inkscape:window-x="0"
inkscape:window-y="23"
inkscape:window-maximized="1"
inkscape:current-layer="svg4707"
fit-margin-top="10"
fit-margin-left="10"
fit-margin-right="10"
fit-margin-bottom="10" />
<g
id="g4627"
style="stroke-width:3"
transform="translate(-116.5,-72.5)">
<path
d="m 236,516 h 136 c 7,0 12,5 12,12 v 40 c 0,7 -5,12 -12,12 H 236 c -7,0 -12,-5 -12,-12 v -40 c 0,-7 5,-12 12,-12 z M 140,372 h 136 c 7,0 12,5 12,12 v 40 c 0,7 -5,12 -12,12 H 140 c -7,0 -12,-5 -12,-12 v -40 c 0,-7 5,-12 12,-12 z M 332,228 h 136 c 7,0 12,5 12,12 v 40 c 0,7 -5,12 -12,12 H 332 c -7,0 -12,-5 -12,-12 v -40 c 0,-7 5,-12 12,-12 z m 0,-144 h 136 c 7,0 12,5 12,12 v 40 c 0,7 -5,12 -12,12 H 332 c -7,0 -12,-5 -12,-12 V 96 c 0,-7 5,-12 12,-12 z m 68,64 v 80 m 0,64 -192,80 m 1,65 95,79"
id="path4619"
inkscape:connector-curvature="0"
style="fill:#d8e2c3;stroke:#bd1220" />
<path
d="m 428,516 h 136 c 7,0 12,5 12,12 v 40 c 0,7 -5,12 -12,12 H 428 c -7,0 -12,-5 -12,-12 v -40 c 0,-7 5,-12 12,-12 z m 96,-144 h 136 c 7,0 12,5 12,12 v 40 c 0,7 -5,12 -12,12 H 524 c -7,0 -12,-5 -12,-12 v -40 c 0,-7 5,-12 12,-12 z M 908,228 h 136 c 7,0 12,5 12,12 v 40 c 0,7 -5,12 -12,12 H 908 c -7,0 -12,-5 -12,-12 v -40 c 0,-7 5,-12 12,-12 z m -192,0 h 136 c 7,0 12,5 12,12 v 40 c 0,7 -5,12 -12,12 H 716 c -7,0 -12,-5 -12,-12 v -40 c 0,-7 5,-12 12,-12 z m -192,0 h 136 c 7,0 12,5 12,12 v 40 c 0,7 -5,12 -12,12 H 524 c -7,0 -12,-5 -12,-12 v -40 c 0,-7 5,-12 12,-12 z m -384,0 h 136 c 7,0 12,5 12,12 v 40 c 0,7 -5,12 -12,12 H 140 c -7,0 -12,-5 -12,-12 v -40 c 0,-7 5,-12 12,-12 z M 592,372 400,292 M 496,516 208,436 M 976,228 400,148 m 384,80 -384,-80 m 0,0 192,80 m -384,0 192,-80"
id="path4621"
inkscape:connector-curvature="0"
style="fill:#d3e2ea;stroke:#006ab2"
sodipodi:nodetypes="sssssssssssssssssssssssssssssssssssssssssssssssssssssscccccccccccc" />
</g>
<g
font-size="48"
id="g4705"
style="font-size:48px;font-family:'Liberation Sans';text-anchor:middle;fill:#006ab2"
transform="translate(-116.5,-72.5)">
<text
x="401"
y="134"
font-size="85"
id="text4645"
style="font-size:85px">.</text>
<text
x="208"
y="276"
id="text4647">com</text>
<text
x="400"
y="276"
id="text4649">org</text>
<text
x="592"
y="276"
id="text4651">net</text>
<switch
transform="translate(784,276)"
id="switch4665">
<text
id="text4663">fr</text>
</switch>
<text
x="976"
y="276"
id="text4667">...</text>
<text
x="592"
y="420"
id="text4671">...</text>
<text
x="208"
y="416"
font-size="32"
id="text4673"
style="font-size:32px">wikipedia</text>
<switch
transform="translate(304,564)"
id="switch4701">
<text
systemLanguage="de"
id="text4687">de</text>
<text
systemLanguage="en"
id="text4689">en</text>
<text
systemLanguage="es"
id="text4691">es</text>
<text
systemLanguage="jbo"
id="text4693">jbo</text>
<text
systemLanguage="pl"
id="text4695">pl</text>
<text
systemLanguage="ru"
id="text4697">ru</text>
<text
id="text4699">fr</text>
</switch>
<text
x="496"
y="564"
id="text4703">...</text>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.7 KiB

BIN
cesi/hebergement_web/img/tls_handshake.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 19 KiB

BIN
cesi/hebergement_web/ressources/Fiche de preparation RISR B4 - Hébergement Web -- remplie.docx Normal file
View File

Binary file not shown.

BIN
cesi/hebergement_web/s5/default/bg-shade.png Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 594 B

BIN
cesi/hebergement_web/s5/default/bg-slide.jpg Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

BIN
cesi/hebergement_web/s5/default/blank.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 49 B

BIN
cesi/hebergement_web/s5/default/bodybg.gif Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.9 KiB

23
cesi/hebergement_web/s5/default/framing.css Normal file
View File

@ -0,0 +1,23 @@
/* The following styles size and place the slide components.
Edit them if you want to change the overall slide layout.
The commented lines can be uncommented (and modified, if necessary)
to help you with the rearrangement process. */
div#header, div#footer, div.slide {width: 100%; top: 0; left: 0;}
div#header {top: 0; left: 0; z-index: 1;}
div#footer {top: auto; bottom: 0; width: 100%; z-index: 5;}
div.slide {top: 0; width: 88%; padding: 1em 7% 2em 5%; z-index: 2;}
#footer div#controls {bottom: 1.5em; left: 0; width: 100%; text-align: center; z-index: 1;}
div#controls form {margin: 0; padding: 0;}
#currentSlide {position: absolute; left: 0; bottom: 0.5em; z-index: 10;
width: 100%; text-align: center;}
html>body #currentSlide {position: fixed;}
/*
div#header {background: #FCC;}
div#footer {background: #CCF;}
div#controls {background: #BBD;}
div#currentSlide {background: #FFC;}
*/

7
cesi/hebergement_web/s5/default/opera.css Normal file
View File

@ -0,0 +1,7 @@
/* DO NOT CHANGE THESE unless you really want to break Opera Show */
.slide {
visibility: visible !important;
position: static !important;
page-break-before: always;
}
#slide0 {page-break-before: avoid;}

15
cesi/hebergement_web/s5/default/outline.css Normal file
View File

@ -0,0 +1,15 @@
/* don't change this unless you want the layout stuff to show up in the outline view! */
.layout div, #footer *, #controlForm * {display: none;}
#footer, #controls, #controlForm, #navLinks, #toggle {
display: block; visibility: visible; margin: 0; padding: 0;}
#toggle {float: right; padding: 0.5em;}
html>body #toggle {position: fixed; top: 0; right: 0;}
/* making the outline look pretty-ish */
#slide0 h1, #slide0 h2, #slide0 h3, #slide0 h4 {border: none; margin: 0;}
#slide0 h1 {padding-top: 1.5em;}
.slide h1 {margin: 1.5em 0 0; padding-top: 0.25em;
border-top: 1px solid #888; border-bottom: 1px solid #AAA;}
#toggle {border: 1px solid; border-width: 0 0 1px 1px; background: #FFF;}

38
cesi/hebergement_web/s5/default/pretty.css Normal file
View File

@ -0,0 +1,38 @@
/* Following are the presentation styles -- edit away!
Note that the 'body' font size may have to be changed if the resolution is
different than expected. */
body {background: #95A7D4 url(bg-slide.jpg) 100% 100% no-repeat; color: #210; font: 29px Arial, sans-serif;}
a {text-decoration: none; color: #336; border-bottom: 1px dotted;}
h1, h2, h3, h4, h5, h6 {font-size: 1em; margin: 0;}
sup {font-size: 0.75em; font-weight: normal;
vertical-align: 0.5em; line-height: 1px;}
ul {margin-left: 1em; padding-left: 0;}
li {margin-bottom: 0.66em;}
li li {margin: 0.33em 0; font-size: smaller;}
#header {background: url(bg-shade.png); border-bottom: 1px solid #333;
padding-bottom: 2em;}
#footer {background: url(bg-shade.png); color: #BBB; border-top: 1px solid #333;}
#header, #footer {font-size: 0.5em;}
#footer h1, #footer h2 { padding: 0.5em 0.75em;
font-weight: normal; font-style: italic;}
#footer h1 {left: 0; font-size: 1em; letter-spacing: 1px;}
#footer h2 {position: absolute; bottom: 0; right: 0;}
#controls a {display: none;}
#controls select {visibility: hidden;}
#controls div:hover select {visibility: visible;}
#currentSlide {font-size: 0.5em;}
#currentSlide span {font-size: 13px; color: rgb(49%,47%,66%);}
#currentSlide #csSep {display: none;}
#currentSlide #csHere {font-weight: bold;}
#currentSlide #csHere:before {content: "#"; font-weight: normal;}
#currentSlide #csTotal:before {content: " of ";}
.slide h1 {font-size: 1.66em; line-height: 1; letter-spacing: -1px;
margin: 0 -15% 1em 0; padding: 0.25em 15% 0.06125em 0; border-bottom: 0.06125em solid rgb(90,94,120);}
#slide0 h1 {border: none; font-size: 2.25em; letter-spacing: 0; margin: 3em 0 1.5em;}
#slide0 h3 {margin-bottom: 0;}
#slide0 h4 {margin-top: 0; font-size: smaller;}

1
cesi/hebergement_web/s5/default/print.css Normal file
View File

@ -0,0 +1 @@
/* The following rule is necessary to have all slides appear in print! DO NOT REMOVE IT! */ .slide, ul {page-break-inside: avoid; visibility: visible !important;} h1 {page-break-after: avoid;} body {font-size: 12pt; background: white;} * {color: black;} #slide0 h1 {font-size: 200%; border: none; margin: 0.5em 0 0.25em;} #slide0 h3 {margin: 0; padding: 0;} #slide0 h4 {margin: 0 0 0.5em; padding: 0;} #slide0 {margin-bottom: 3em;} h1 {border-top: 2pt solid gray; border-bottom: 1px dotted silver;} .extra {background: transparent !important;} div.extra, pre.extra, .example {font-size: 10pt; color: #333;} ul.extra a {font-weight: bold;} p.example {display: none;} #header {display: none;} #footer h1 {margin: 0; border-bottom: 1px solid; color: gray; font-style: italic;} #footer h2, #controls {display: none;} /* The following rule keeps the layout stuff out of print. Remove at your own risk! */ .layout, .layout * {display: none !important;} img { max-width: 95%; }

9
cesi/hebergement_web/s5/default/s5-core.css Normal file
View File

@ -0,0 +1,9 @@
/* Do not edit or override these styles! The system will likely break if you do. */
div#header, div#footer, div.slide {position: absolute;}
html>body div#header, html>body div#footer, html>body div.slide {position: fixed;}
div.slide {visibility: hidden;}
#slide0 {visibility: visible;}
div#controls {position: absolute;}
#footer>div#controls {position: fixed;}
.handout {display: none;}

5
cesi/hebergement_web/s5/default/slides.css Normal file
View File

@ -0,0 +1,5 @@
@import url("s5-core.css"); /* required to make the slide show run at all */
@import url("framing.css"); /* sets basic placement and size of slide components */
@import url(pretty.css); /* stuff that makes the slides look better than blah */
img { max-height: 25rem; }

553
cesi/hebergement_web/s5/default/slides.js Normal file
View File

@ -0,0 +1,553 @@
// S5 v1.1 slides.js -- released into the Public Domain
//
// Please see http://www.meyerweb.com/eric/tools/s5/credits.html for information
// about all the wonderful and talented contributors to this code!
var undef;
var slideCSS = '';
var snum = 0;
var smax = 1;
var incpos = 0;
var number = undef;
var s5mode = true;
var defaultView = 'slideshow';
var controlVis = 'visible';
var isIE = navigator.appName == 'Microsoft Internet Explorer' && navigator.userAgent.indexOf('Opera') < 1 ? 1 : 0;
var isOp = navigator.userAgent.indexOf('Opera') > -1 ? 1 : 0;
var isGe = navigator.userAgent.indexOf('Gecko') > -1 && navigator.userAgent.indexOf('Safari') < 1 ? 1 : 0;
function hasClass(object, className) {
if (!object.className) return false;
return (object.className.search('(^|\\s)' + className + '(\\s|$)') != -1);
}
function hasValue(object, value) {
if (!object) return false;
return (object.search('(^|\\s)' + value + '(\\s|$)') != -1);
}
function removeClass(object,className) {
if (!object) return;
object.className = object.className.replace(new RegExp('(^|\\s)'+className+'(\\s|$)'), RegExp.$1+RegExp.$2);
}
function addClass(object,className) {
if (!object || hasClass(object, className)) return;
if (object.className) {
object.className += ' '+className;
} else {
object.className = className;
}
}
function GetElementsWithClassName(elementName,className) {
var allElements = document.getElementsByTagName(elementName);
var elemColl = new Array();
for (var i = 0; i< allElements.length; i++) {
if (hasClass(allElements[i], className)) {
elemColl[elemColl.length] = allElements[i];
}
}
return elemColl;
}
function isParentOrSelf(element, id) {
if (element == null || element.nodeName=='BODY') return false;
else if (element.id == id) return true;
else return isParentOrSelf(element.parentNode, id);
}
function nodeValue(node) {
var result = "";
if (node.nodeType == 1) {
var children = node.childNodes;
for (var i = 0; i < children.length; ++i) {
result += nodeValue(children[i]);
}
}
else if (node.nodeType == 3) {
result = node.nodeValue;
}
return(result);
}
function slideLabel() {
var slideColl = GetElementsWithClassName('*','slide');
var list = document.getElementById('jumplist');
smax = slideColl.length;
for (var n = 0; n < smax; n++) {
var obj = slideColl[n];
var did = 'slide' + n.toString();
obj.setAttribute('id',did);
if (isOp) continue;
var otext = '';
var menu = obj.firstChild;
if (!menu) continue; // to cope with empty slides
while (menu && menu.nodeType == 3) {
menu = menu.nextSibling;
}
if (!menu) continue; // to cope with slides with only text nodes
var menunodes = menu.childNodes;
for (var o = 0; o < menunodes.length; o++) {
otext += nodeValue(menunodes[o]);
}
list.options[list.length] = new Option(n + ' : ' + otext, n);
}
}
function currentSlide() {
var cs;
if (document.getElementById) {
cs = document.getElementById('currentSlide');
} else {
cs = document.currentSlide;
}
cs.innerHTML = '<span id="csHere">' + snum + '<\/span> ' +
'<span id="csSep">\/<\/span> ' +
'<span id="csTotal">' + (smax-1) + '<\/span>';
if (snum == 0) {
cs.style.visibility = 'hidden';
} else {
cs.style.visibility = 'visible';
}
}
function go(step) {
if (document.getElementById('slideProj').disabled || step == 0) return;
var jl = document.getElementById('jumplist');
var cid = 'slide' + snum;
var ce = document.getElementById(cid);
if (incrementals[snum].length > 0) {
for (var i = 0; i < incrementals[snum].length; i++) {
removeClass(incrementals[snum][i], 'current');
removeClass(incrementals[snum][i], 'incremental');
}
}
if (step != 'j') {
snum += step;
lmax = smax - 1;
if (snum > lmax) snum = lmax;
if (snum < 0) snum = 0;
} else
snum = parseInt(jl.value);
var nid = 'slide' + snum;
var ne = document.getElementById(nid);
if (!ne) {
ne = document.getElementById('slide0');
snum = 0;
}
if (step < 0) {incpos = incrementals[snum].length} else {incpos = 0;}
if (incrementals[snum].length > 0 && incpos == 0) {
for (var i = 0; i < incrementals[snum].length; i++) {
if (hasClass(incrementals[snum][i], 'current'))
incpos = i + 1;
else
addClass(incrementals[snum][i], 'incremental');
}
}
if (incrementals[snum].length > 0 && incpos > 0)
addClass(incrementals[snum][incpos - 1], 'current');
ce.style.visibility = 'hidden';
ne.style.visibility = 'visible';
jl.selectedIndex = snum;
currentSlide();
number = 0;
}
function goTo(target) {
if (target >= smax || target == snum) return;
go(target - snum);
}
function subgo(step) {
if (step > 0) {
removeClass(incrementals[snum][incpos - 1],'current');
removeClass(incrementals[snum][incpos], 'incremental');
addClass(incrementals[snum][incpos],'current');
incpos++;
} else {
incpos--;
removeClass(incrementals[snum][incpos],'current');
addClass(incrementals[snum][incpos], 'incremental');
addClass(incrementals[snum][incpos - 1],'current');
}
}
function toggle() {
var slideColl = GetElementsWithClassName('*','slide');
var slides = document.getElementById('slideProj');
var outline = document.getElementById('outlineStyle');
if (!slides.disabled) {
slides.disabled = true;
outline.disabled = false;
s5mode = false;
fontSize('1em');
for (var n = 0; n < smax; n++) {
var slide = slideColl[n];
slide.style.visibility = 'visible';
}
} else {
slides.disabled = false;
outline.disabled = true;
s5mode = true;
fontScale();
for (var n = 0; n < smax; n++) {
var slide = slideColl[n];
slide.style.visibility = 'hidden';
}
slideColl[snum].style.visibility = 'visible';
}
}
function showHide(action) {
var obj = GetElementsWithClassName('*','hideme')[0];
switch (action) {
case 's': obj.style.visibility = 'visible'; break;
case 'h': obj.style.visibility = 'hidden'; break;
case 'k':
if (obj.style.visibility != 'visible') {
obj.style.visibility = 'visible';
} else {
obj.style.visibility = 'hidden';
}
break;
}
}
// 'keys' code adapted from MozPoint (http://mozpoint.mozdev.org/)
function keys(key) {
if (!key) {
key = event;
key.which = key.keyCode;
}
if (key.which == 84) {
toggle();
return;
}
if (s5mode) {
switch (key.which) {
case 10: // return
case 13: // enter
if (window.event && isParentOrSelf(window.event.srcElement, 'controls')) return;
if (key.target && isParentOrSelf(key.target, 'controls')) return;
if(number != undef) {
goTo(number);
break;
}
case 32: // spacebar
case 34: // page down
case 39: // rightkey
case 40: // downkey
if(number != undef) {
go(number);
} else if (!incrementals[snum] || incpos >= incrementals[snum].length) {
go(1);
} else {
subgo(1);
}
break;
case 33: // page up
case 37: // leftkey
case 38: // upkey
if(number != undef) {
go(-1 * number);
} else if (!incrementals[snum] || incpos <= 0) {
go(-1);
} else {
subgo(-1);
}
break;
case 36: // home
goTo(0);
break;
case 35: // end
goTo(smax-1);
break;
case 67: // c
showHide('k');
break;
}
if (key.which < 48 || key.which > 57) {
number = undef;
} else {
if (window.event && isParentOrSelf(window.event.srcElement, 'controls')) return;
if (key.target && isParentOrSelf(key.target, 'controls')) return;
number = (((number != undef) ? number : 0) * 10) + (key.which - 48);
}
}
return false;
}
function clicker(e) {
number = undef;
var target;
if (window.event) {
target = window.event.srcElement;
e = window.event;
} else target = e.target;
if (target.getAttribute('href') != null || hasValue(target.rel, 'external') || isParentOrSelf(target, 'controls') || isParentOrSelf(target,'embed') || isParentOrSelf(target,'object')) return true;
if (!e.which || e.which == 1) {
if (!incrementals[snum] || incpos >= incrementals[snum].length) {
go(1);
} else {
subgo(1);
}
}
}
function findSlide(hash) {
var target = null;
var slides = GetElementsWithClassName('*','slide');
for (var i = 0; i < slides.length; i++) {
var targetSlide = slides[i];
if ( (targetSlide.name && targetSlide.name == hash)
|| (targetSlide.id && targetSlide.id == hash) ) {
target = targetSlide;
break;
}
}
while(target != null && target.nodeName != 'BODY') {
if (hasClass(target, 'slide')) {
return parseInt(target.id.slice(5));
}
target = target.parentNode;
}
return null;
}
function slideJump() {
if (window.location.hash == null) return;
var sregex = /^#slide(\d+)$/;
var matches = sregex.exec(window.location.hash);
var dest = null;
if (matches != null) {
dest = parseInt(matches[1]);
} else {
dest = findSlide(window.location.hash.slice(1));
}
if (dest != null)
go(dest - snum);
}
function fixLinks() {
var thisUri = window.location.href;
thisUri = thisUri.slice(0, thisUri.length - window.location.hash.length);
var aelements = document.getElementsByTagName('A');
for (var i = 0; i < aelements.length; i++) {
var a = aelements[i].href;
var slideID = a.match('\#slide[0-9]{1,2}');
if ((slideID) && (slideID[0].slice(0,1) == '#')) {
var dest = findSlide(slideID[0].slice(1));
if (dest != null) {
if (aelements[i].addEventListener) {
aelements[i].addEventListener("click", new Function("e",
"if (document.getElementById('slideProj').disabled) return;" +
"go("+dest+" - snum); " +
"if (e.preventDefault) e.preventDefault();"), true);
} else if (aelements[i].attachEvent) {
aelements[i].attachEvent("onclick", new Function("",
"if (document.getElementById('slideProj').disabled) return;" +
"go("+dest+" - snum); " +
"event.returnValue = false;"));
}
}
}
}
}
function externalLinks() {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName('a');
for (var i=0; i<anchors.length; i++) {
var anchor = anchors[i];
if (anchor.getAttribute('href') && hasValue(anchor.rel, 'external')) {
anchor.target = '_blank';
addClass(anchor,'external');
}
}
}
function createControls() {
var controlsDiv = document.getElementById("controls");
if (!controlsDiv) return;
var hider = ' onmouseover="showHide(\'s\');" onmouseout="showHide(\'h\');"';
var hideDiv, hideList = '';
if (controlVis == 'hidden') {
hideDiv = hider;
} else {
hideList = hider;
}
controlsDiv.innerHTML = '<form action="#" id="controlForm"' + hideDiv + '>' +
'<div id="navLinks">' +
'<a accesskey="t" id="toggle" href="javascript:toggle();">&#216;<\/a>' +
'<a accesskey="z" id="prev" href="javascript:go(-1);">&laquo;<\/a>' +
'<a accesskey="x" id="next" href="javascript:go(1);">&raquo;<\/a>' +
'<div id="navList"' + hideList + '><select id="jumplist" onchange="go(\'j\');"><\/select><\/div>' +
'<\/div><\/form>';
if (controlVis == 'hidden') {
var hidden = document.getElementById('navLinks');
} else {
var hidden = document.getElementById('jumplist');
}
addClass(hidden,'hideme');
}
function fontScale() { // causes layout problems in FireFox that get fixed if browser's Reload is used; same may be true of other Gecko-based browsers
if (!s5mode) return false;
var vScale = 22; // both yield 32 (after rounding) at 1024x768
var hScale = 32; // perhaps should auto-calculate based on theme's declared value?
if (window.innerHeight) {
var vSize = window.innerHeight;
var hSize = window.innerWidth;
} else if (document.documentElement.clientHeight) {
var vSize = document.documentElement.clientHeight;
var hSize = document.documentElement.clientWidth;
} else if (document.body.clientHeight) {
var vSize = document.body.clientHeight;
var hSize = document.body.clientWidth;
} else {
var vSize = 700; // assuming 1024x768, minus chrome and such
var hSize = 1024; // these do not account for kiosk mode or Opera Show
}
var newSize = Math.min(Math.round(vSize/vScale),Math.round(hSize/hScale));
fontSize(newSize + 'px');
if (isGe) { // hack to counter incremental reflow bugs
var obj = document.getElementsByTagName('body')[0];
obj.style.display = 'none';
obj.style.display = 'block';
}
}
function fontSize(value) {
if (!(s5ss = document.getElementById('s5ss'))) {
if (!isIE) {
document.getElementsByTagName('head')[0].appendChild(s5ss = document.createElement('style'));
s5ss.setAttribute('media','screen, projection');
s5ss.setAttribute('id','s5ss');
} else {
document.createStyleSheet();
document.s5ss = document.styleSheets[document.styleSheets.length - 1];
}
}
if (!isIE) {
while (s5ss.lastChild) s5ss.removeChild(s5ss.lastChild);
s5ss.appendChild(document.createTextNode('body {font-size: ' + value + ' !important;}'));
} else {
document.s5ss.addRule('body','font-size: ' + value + ' !important;');
}
}
function notOperaFix() {
slideCSS = document.getElementById('slideProj').href;
var slides = document.getElementById('slideProj');
var outline = document.getElementById('outlineStyle');
slides.setAttribute('media','screen');
outline.disabled = true;
if (isGe) {
slides.setAttribute('href','null'); // Gecko fix
slides.setAttribute('href',slideCSS); // Gecko fix
}
if (isIE && document.styleSheets && document.styleSheets[0]) {
document.styleSheets[0].addRule('img', 'behavior: url(ui/default/iepngfix.htc)');
document.styleSheets[0].addRule('div', 'behavior: url(ui/default/iepngfix.htc)');
document.styleSheets[0].addRule('.slide', 'behavior: url(ui/default/iepngfix.htc)');
}
}
function getIncrementals(obj) {
var incrementals = new Array();
if (!obj)
return incrementals;
var children = obj.childNodes;
for (var i = 0; i < children.length; i++) {
var child = children[i];
if (hasClass(child, 'incremental')) {
if (child.nodeName == 'OL' || child.nodeName == 'UL') {
removeClass(child, 'incremental');
for (var j = 0; j < child.childNodes.length; j++) {
if (child.childNodes[j].nodeType == 1) {
addClass(child.childNodes[j], 'incremental');
}
}
} else {
incrementals[incrementals.length] = child;
removeClass(child,'incremental');
}
}
if (hasClass(child, 'show-first')) {
if (child.nodeName == 'OL' || child.nodeName == 'UL') {
removeClass(child, 'show-first');
if (child.childNodes[isGe].nodeType == 1) {
removeClass(child.childNodes[isGe], 'incremental');
}
} else {
incrementals[incrementals.length] = child;
}
}
incrementals = incrementals.concat(getIncrementals(child));
}
return incrementals;
}
function createIncrementals() {
var incrementals = new Array();
for (var i = 0; i < smax; i++) {
incrementals[i] = getIncrementals(document.getElementById('slide'+i));
}
return incrementals;
}
function defaultCheck() {
var allMetas = document.getElementsByTagName('meta');
for (var i = 0; i< allMetas.length; i++) {
if (allMetas[i].name == 'defaultView') {
defaultView = allMetas[i].content;
}
if (allMetas[i].name == 'controlVis') {
controlVis = allMetas[i].content;
}
}
}
// Key trap fix, new function body for trap()
function trap(e) {
if (!e) {
e = event;
e.which = e.keyCode;
}
try {
modifierKey = e.ctrlKey || e.altKey || e.metaKey;
}
catch(e) {
modifierKey = false;
}
return modifierKey || e.which == 0;
}
function startup() {
defaultCheck();
if (!isOp)
createControls();
slideLabel();
fixLinks();
externalLinks();
fontScale();
if (!isOp) {
notOperaFix();
incrementals = createIncrementals();
slideJump();
if (defaultView == 'outline') {
toggle();
}
document.onkeyup = keys;
document.onkeypress = trap;
document.onclick = clicker;
}
}
window.onload = startup;
window.onresize = function(){setTimeout('fontScale()', 50);}