Skip to main content

Étape 3 : Website, Service, Entretien

Dans cette section, nous allons apprendre comment héberger un site web sur la Raspberry Pi pour télécharger les vidéos, puis nous passerons à la création de services pour lancer le code du système 'main.py' au démarrage. Enfin, nous gérerons l'entretien du système en créant des tâches qui s'exécutent régulièrement pour effacer les vidéos sauvegardées.

Website

Pour se Cultiver

Nginx :
Nginx est un serveur web open-source connu pour sa haute performance, sa stabilité, sa faible consommation de ressources et sa capacité à gérer un grand nombre de connexions simultanées. Il est souvent utilisé comme serveur web ou serveur proxy inverse, ainsi que pour la mise en cache, l'équilibrage de charge, et plus encore. 

PHP est un langage de script côté serveur conçu pour le développement web, mais il est également utilisé comme langage de programmation généraliste. Pour exécuter du code PHP sur un serveur, vous avez besoin de l'interpréteur PHP installé, tout comme vous avez besoin de l'interpréteur Python pour exécuter du code Python.

PHP-FPM (PHP FastCGI Process Manager) :
PHP-FPM est une implémentation alternative de PHP FastCGI avec des fonctionnalités supplémentaires utiles pour les sites web à forte charge. Il permet à PHP de fonctionner efficacement avec Nginx. Bien que Nginx ne puisse pas directement interpréter PHP, il transmet les requêtes PHP à PHP-FPM, qui traite le code et renvoie le résultat à Nginx.

1-Préparation

1 -Créer un répertoire pour stocker tous les fichiers en rapport avec la structure de votre site, par exemple :

mkdir /home/pi/Desktop/website

2 -Installer Nginx et PHP

sudo apt install nginx

sudo apt install php-fpm

3 -Démarrer et activer Nginx

sudo systemctl start nginx

sudo systemctl enable nginx

Normalement, après cette étape, vous pouvez visiter votre site en tapant l'adresse IP de votre Raspberry Pi dans votre navigateur web. Vous devriez voir cette page.

nginx-start.png

2-Modifier la Configuration de Nginx

Ouvrez le fichier de configuration par défaut pour l'éditer :

sudo nano /etc/nginx/sites-available/default

Remplacez le contenu du fichier en modifiant `root` avec le chemin du répertoire de votre site web et `alias` avec le chemin du répertoire où vous stockez vos vidéos, par exemple : 

server {
    listen 80 default_server;
    listen [::]:80 default_server;

    root /home/pi/Desktop/website;
    index index.php index.html index.htm;

    server_name _;

    location / {
        try_files $uri $uri/ =404;
    }

    location /videos/ {
        alias /home/pi/Desktop/videos/;
        autoindex on;
        allow all;
    }

    location ~ \.php$ {
        include snippets/fastcgi-php.conf;
        fastcgi_pass unix:/var/run/php/php8.2-fpm.sock;
    }

    location ~ /\.ht {
        deny all;
    }
}
3-Rendre le site plus beau

Créer un fichier pour le style.

sudo nano /home/pi/Desktop/website/style.css

Ajouter ca :

body {
    font-family: Arial, sans-serif;
    background-color: #f4f4f4;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.container {
    background-color: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    max-width: 600px;
    width: 100%;
}

h1 {
    text-align: center;
    color: #333;
}

ul {
    list-style: none;
    padding: 0;
}

li {
    margin: 10px 0;
}

a {
    text-decoration: none;
    color: #007bff;
    font-weight: bold;
}

a:hover {
    color: #0056b3;
}

en plus vous pouvez ajouter une image à votre site.

 

4-Ajoutez un fichier PHP dans le répertoire de votre site web

Créer le fichier index.php 

sudo nano /home/pi/Desktop/website/index.php

ensuite ajouter ca : 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Video Downloads</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <h1>Video Downloads</h1>
        <img src="images.png" alt="Fablab Sorbonne Image" style="max-width: 100%;">
        <ul>
            <?php
            $dir = '/home/pi/Desktop/videos/';
            $webPath = '/videos/';

            if ($handle = opendir($dir)) {
                while (false !== ($file = readdir($handle))) {
                    if ($file != "." && $file != ".." && !is_dir($dir . $file)) {
                        $filePath = $webPath . $file;
                        echo "<li><a href='" . htmlspecialchars($filePath) . "' download>" . htmlspecialchars($file) . "</a></li>";
                    }
                }
                closedir($handle);
            } else {
                echo "<p>Failed to open directory: $dir</p>";
            }
            ?>
        </ul>
    </div>
</body>
</html>

 

5-Modifier les Permissions 
sudo chown -R www-data:www-data /home/pi/Desktop/website
sudo chown -R www-data:www-data /home/pi/Desktop/videos
sudo chmod -R 755 /home/pi/Desktop/website
sudo chmod -R 755 /home/pi/Desktop/videos