Comment exposer une application de démonstration Django à Internet avec Ngrok ?
Partager votre application Django en ligne sans hébergement
Découvrons comment rendre accessible une application Django de démonstration sur Internet, sans pour autant la déployer sur un service d'hébergement.
Il est fastidieux de mettre en place un environnement de déploiement temporaire juste pour montrer une démo de votre application Django. C'est encore pire si vous avez seulement besoin d'une URL pendant quelques instants, pour la présenter à un client ou à un collaborateur.
La meilleure solution consiste à utiliser un outil permettant d'exposer votre serveur local actuel. Et oui, grâce à cela, des personnes du monde entier pourront voir ce qui se passe sur votre machine !
Pour réaliser cela, nous utiliserons Ngrok. Cet outil nous permettra de générer des URLs publiques basées sur les ports locaux de vos ordinateurs, le tout grâce à la technique des tunnels.
Le code source utilisé dans ce tutoriel sera disponible dans ce référentiel GitHub.
Prérequis
Il est recommandé d'avoir des connaissances de base en développement web. Toutefois, il est fort probable que vous puissiez suivre ce tutoriel sans trop de difficultés.
Création d'une application Django
Pour proposer un tutoriel étape par étape, je vais vous guider à travers la création d'un projet Django. Si vous en possédez déjà un, vous pouvez ignorer cette section.
Environnement virtuel
Tout d'abord, mettons en place un environnement virtuel Python.
- Ouvrez votre terminal système (ou shell).
- Si ouvrir votre terminal vous semble compliqué, utilisez le terminal intégré de votre éditeur de code.
- Cliquez sur Terminal > Nouveau Terminal, et un shell devrait apparaître en bas de votre écran.
- Tapez la commande suivante pour créer un environnement virtuel à l'aide de l'outil intégré de Python.
python -m venv .venv
Cette commande signifie :
"Hey Python, crée un environnement virtuel (-m venv) nommé .venv"
- Maintenant, si vous listez les fichiers de votre répertoire actuel, vous devriez voir un dossier .venv.
$ ls -l drwxr-xr-x - daniel 30 abr 23:12 .venv # Autres fichiers ...
- Pour activer l'environnement virtuel, nous utilisons la commande source.
source .venv/bin/activate
- Si vous rencontrez des difficultés, référez-vous au tableau suivant tiré de la documentation officielle de Python.
Plateforme
Shell
Commande pour activer l'environnement virtuel
POSIX
bash/zsh
$ source
fish
$ source
csh/tcsh
$ source
PowerShell Core
$
Windows
cmd.exe
C:>
PowerShell
PS C:>
Une fois la bonne commande exécutée, le nom de l'environnement virtuel devrait apparaître dans votre shell.
$ source .venv/bin/activate.fish (.venv) $
Installation de Django
Après avoir activé votre environnement virtuel, vous pouvez installer la version de Django de votre choix. Il est généralement conseillé d'installer la dernière version stable.
$ pip install django Collecting django Using cached Django-3.2-py3-none-any.whl (7.9 MB) Collecting pytz Using cached pytz-2021.1-py2.py3-none-any.whl (510 kB) Collecting asgiref<4,>=3.3.2 Using cached asgiref-3.3.4-py3-none-any.whl (22 kB) Collecting sqlparse>=0.2.2 Using cached sqlparse-0.4.1-py3-none-any.whl (42 kB) Installing collected packages: pytz, asgiref, sqlparse, django Successfully installed asgiref-3.3.4 django-3.2 pytz-2021.1 sqlparse-0.4.1
Il est temps de créer la structure de base de projet de votre application Django.
$ django-admin startproject mytestingproject
Cette commande créera un projet Django nommé 'mytestingproject'. Une fois créé, entrez dans le répertoire où se trouve la structure du projet. Ensuite, lançons le serveur Django.
# Entrer dans le répertoire du projet (.venv)$ cd mytestingproject/ # Lister les fichiers à l'intérieur du projet (.venv) $ ls mytestingproject manage.py
Maintenant que vous y êtes, lançons le serveur Django pour voir à quoi il ressemble.
(.venv) $python manage.py runserver Watching for file changes with StatReloader Performing system checks... System check identified no issues (0 silenced). You have 18 unapplied migration(s). Your project may not work properly until you apply the migrations for app(s): admin, auth, contenttypes, sessions. Run 'python manage.py migrate' to apply them. May 01, 2021 - 04:34:25 Django version 3.2, using settings 'mytestingproject.settings' Starting development server at http://127.0.0.1:8000/ Quit the server with CONTROL-C.
En résumé, Django nous informe qu'un serveur local fonctionne sur votre localhost (127.0.0.1 y pointe toujours), sur le port par défaut 8000.
Ne vous inquiétez pas du message d'erreur. Avant tout, vérifions que tout fonctionne correctement sur votre serveur local. Pour cela, ouvrez votre navigateur web et collez cette adresse :
http://localhost:8000/ # Notez que localhost et 127.0.0.1 sont identiques ?
Si tout fonctionne comme prévu, vous devriez voir un modèle de base Django.

Voilà pour l'installation de Django.
Passons à présent à l'exposition de ce projet Django. Si vous travaillez sur un projet plus complexe, les méthodes suivantes fonctionneront également.
Exposer une application Django avec Ngrok
Comme je l'ai mentionné précédemment, Ngrok est l'un des outils qui nous permettront de rendre notre serveur local accessible sur Internet. Par conséquent, commençons par télécharger Ngrok à partir du site officiel.
Une fois installé, passons aux commandes nécessaires.
Ouvrez un autre shell, tout en laissant tourner le terminal où votre serveur Django s'exécute, et tapez :
$ ngrok help NAME: ngrok - tunnel local ports to public URLs and inspect traffic More commands ....
Cela vous donnera un aperçu des commandes disponibles et confirmera que l'installation s'est correctement déroulée.
Pour générer une URL où les utilisateurs pourront accéder à votre serveur, exécutez la commande suivante :
$ ngrok http 8000
# URL publique sécurisée pour le serveur web du port 8000
L'argument 'http' indique que nous souhaitons créer une URL qui se connectera au port 8000 de votre localhost.
Voici le résultat que vous devriez obtenir :
ngrok by @inconshreveable (Ctrl+C to quit)
Session Status online
Session Expires 1 hour, 59 minutes
Update update available (version 2.3.39, Ctrl-U to update)
Version 2.3.35
Region United States (us)
Web Interface http://127.0.0.1:4040
Forwarding http://cac2165aa7f8.ngrok.io -> http://localhost:8000
Forwarding https://cac2165aa7f8.ngrok.io -> http://localhost:8000
Connections ttl opn rt1 rt5 p50 p90
0 0 0.00 0.00 0.00 0.00
Comme indiqué, Ngrok transmet une URL un peu étrange à votre hôte local. La magie opère quand vous cliquez sur l'URL fournie par Ngrok dans votre navigateur web.

Modification de settings.py
Oups, que s'est-il passé 😱 ?
Il semblerait que Django génère une erreur due à un paramètre "DisallowedHost". Si vous vérifiez le shell où vous exécutez le serveur Django et celui avec la session Ngrok, vous verrez des messages de débogage.
# Messages de Django Invalid HTTP_HOST header: 'cac2165aa7f8.ngrok.io'. You may need to add 'cac2165aa7f8.ngrok.io' to ALLOWED_HOSTS. Bad Request: / [01/May/2021 05:07:46] "GET / HTTP/1.1" 400 65196 Invalid HTTP_HOST header: 'cac2165aa7f8.ngrok.io'. You may need to add 'cac2165aa7f8.ngrok.io' to ALLOWED_HOSTS. # Messages de Ngrok HTTP Requests ------------- GET /favicon.ico 400 Bad Request GET / 400 Bad Request
Comme le précise Django, nous devons ajouter le domaine auquel nous nous connectons à la variable de configuration `ALLOWED_HOSTS`. Toutefois, le nom de domaine est un peu long et complexe.
Afin de résoudre cette erreur, modifions légèrement les paramètres de Django. Ouvrez le fichier `settings.py` situé dans le dossier du projet.
# mytestingproject/settings.py # Ligne 28 # Remplacer ALLOWED_HOSTS = [] # Par ALLOWED_HOSTS = ["*"]
Si vous connaissez les expressions régulières, vous comprendrez que nous utilisons un caractère générique, autorisant ainsi tous les hôtes.
Rechargez maintenant la page et observez le résultat.

Tout fonctionne parfaitement ! Et si vous commencez à développer des applications pour le projet, et à définir des URLs et des vues, tout cela sera visible via cette URL publique.
Important : N'oubliez pas de modifier `ALLOWED_HOSTS` en production, car cela créerait une importante faille de sécurité.
Conclusion
Dans ce tutoriel, vous avez appris à créer une URL de démonstration pour votre projet Django, sans avoir à le déployer.
Vous avez vu comment démarrer un projet Django et comment modifier le fichier `settings.py`.
Enfin, vous avez appris à utiliser Ngrok pour rendre accessible n'importe quel serveur local.
Poursuivez votre apprentissage en explorant des frameworks Python populaires pour la création d'APIs.