Jak vystavit ukázkovou aplikaci Django na internetu s Ngrokem?

Podívejme se společně, jak elegantně zpřístupnit vaši Django aplikaci online, a to i bez nutnosti jejího nasazení na hostingovém serveru.

Konfigurování testovacího prostředí pro pouhou demonstraci vaší Django aplikace může být zdlouhavé a frustrující. Obzvlášť, pokud potřebujete veřejnou URL adresu jen na pár minut, abyste se o ni mohli podělit s klientem nebo kolegy.

Nejefektivnější řešení představuje použití nástroje, který dokáže „odhalit“ váš lokální server. Ano, čtete správně! Uživatelé po celém světě pak budou moci sledovat, co se děje přímo na vašem localhostu.

Pro tento účel využijeme Ngrok. Tento šikovný nástroj vám umožní vygenerovat veřejné URL adresy, které odkazují na konkrétní porty vašeho počítače. To vše je možné díky sofistikovanému mechanismu tunelování.

Veškerý kód použitý v tomto návodu je k dispozici v tomto Github repozitáři.

Předběžné požadavky

Doporučuje se, abyste měli základní povědomí o následujících tématech. Nicméně, i bez hlubších znalostí byste měli být schopni tento návod úspěšně dokončit.

Založení Django Aplikace

Abychom zajistili názornost tohoto tutoriálu, krok za krokem si projdeme proces vytvoření nového Django projektu. Pokud již projekt máte, tuto část můžete přeskočit.

Virtuální Prostředí

Nejprve si vytvoříme a aktivujeme virtuální prostředí Pythonu.

  • Otevřete si terminál (nebo shell) vašeho operačního systému.
  • Pokud se vám zdá otvírání systémového terminálu komplikované, můžete využít integrovaný terminál vašeho kódu editoru.
  • Klikněte na „Terminál“ -> „Nový terminál“, čímž by se měl ve spodní části obrazovky objevit nový shell.
  • Pro vytvoření nového virtuálního prostředí Pythonem použijte následující příkaz.
python -m venv .venv

Tento příkaz v podstatě říká:

„Hele Pythone, vytvoř mi virtuální prostředí (-m venv) s názvem .venv.“

  • Po vypsání obsahu vašeho aktuálního adresáře byste měli vidět složku .venv.
$ ls -l
drwxr-xr-x    - daniel 30 abr 23:12 .venv
# Ostatní soubory ...
  • Pro aktivaci virtuálního prostředí použijte příkaz „source“.
source .venv/bin/activate
  • Pokud narazíte na problémy, prostudujte si následující tabulku, převzatou z oficiální dokumentace Pythonu.
Platforma Shell Příkaz pro aktivaci virtuálního prostředí
POSIX bash/zsh $ source <venv>/bin/activate
fish $ source <venv>/bin/activate.fish
csh/tcsh $ source <venv>/bin/activate.csh
PowerShell Core $ <venv>/bin/Activate.ps1
Windows cmd.exe C:> <venv>\Scripts\activate.bat
PowerShell PS C:> <venv>\Scripts\Activate.ps1

Po úspěšném spuštění příslušného příkazu by se v názvu vašeho shellu mělo objevit jméno virtuálního prostředí.

$ source .venv/bin/activate.fish

(.venv) $ 

Instalace Django

S aktivním virtuálním prostředím můžete nyní nainstalovat libovolnou verzi Django. V tomto případě je rozumné nainstalovat nejnovější verzi.

$ 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

Je čas vytvořit základní strukturu Django projektu, který chcete zpřístupnit online.

$ django-admin startproject mytestingproject

Tím se vytvoří nový Django projekt s názvem „mytestingproject“. Přejděte do adresáře projektu a spusťte Django server.

# Přechod do adresáře projektu
(.venv)$ cd mytestingproject/

# Výpis souborů v adresáři
(.venv) $ ls
mytestingproject  manage.py 

Nyní, když jste uvnitř adresáře projektu, spusťte Django server, abyste viděli, jak vypadá.

 (.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.

Django nám sděluje, že na localhostu (adresa 127.0.0.1) běží vývojový server na výchozím portu 8000.

Chybovou hláškou se prozatím nezabývejte. Nejprve ověříme, že na lokálním serveru vše běží správně. Otevřete si webový prohlížeč a zadejte tuto adresu:

http://localhost:8000/
# Všimli jste si, že localhost a 127.0.0.1 jsou totožné?

Pokud vše funguje správně, měli byste vidět uvítací stránku Django.

Instalaci Django máme zdárně za sebou.

Nyní se pojďme podívat, jak tento Django projekt zpřístupnit online. Následující metody fungují i pro složitější projekty.

Zpřístupnění Aplikace Django pomocí Ngroku

Jak již bylo zmíněno, Ngrok je nástroj, který nám umožní sdílet naši aplikaci online. Nejprve si stáhněte Ngrok z oficiálních stránek.

Po jeho instalaci pokračujte s potřebnými příkazy.

Otevřete nový shell (ponechte terminál, na kterém běží Django server běžet) a zadejte:

$  ngrok help
NAME:
   ngrok - tunnel local ports to public URLs and inspect traffic

More commands ....

Zobrazí se přehled dostupných příkazů Ngroku, což je zároveň potvrzením, že instalace proběhla úspěšně.

Pro vygenerování URL adresy, pomocí které se lidé dostanou k vašemu serveru, spusťte:

    $ ngrok http 8000 
# Vygeneruje veřejnou URL pro port 8000 webového serveru

Argument „http“ zajistí, že se vygenerovaná URL adresa bude připojovat k portu 8000 na vašem localhostu.

Zde je výsledek, který byste měli vidět:

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       

Ngrok „přesměruje“ tuto dlouhou URL adresu na váš localhost. Kouzlo se stane, když tuto adresu otevřete ve webovém prohlížeči.

Úprava settings.py

Co se to právě stalo 😱?

Zdá se, že Django vyhodilo chybu kvůli nastavení „DisallowedHost“. Pokud se podíváte do shellu, kde běží váš Django server, uvidíte ladící zprávy.

# Zprávy 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.

# Zprávy Ngroku
HTTP Requests                                                            
-------------                                                            
                                                                         
GET /favicon.ico               400 Bad Request                           
GET /                          400 Bad Request                           
                                              

Jak Django správně hlásí, musíme přidat doménu, ze které se připojujeme, do konfigurační proměnné „ALLOWED_HOSTS“. Problém je, že název domény je příliš dlouhý a komplikovaný.

Pojďme upravit Django nastavení a tento problém vyřešit. Otevřete soubor „settings.py“, který se nachází v adresáři vašeho projektu.

# mytestingproject/settings.py

# Řádek 28

# Změňte z
ALLOWED_HOSTS = []

# Na

ALLOWED_HOSTS = ["*"]

Pokud znáte regulární výrazy, tak víte, že jsme nastavili zástupný znak, který povolí všechny hostitele.

Znovu načtěte webovou stránku a podívejte se na výsledek.

Nyní už vše funguje bezchybně! A když začnete vytvářet nové aplikace pro váš projekt a nastavovat URL adresy a zobrazení, vše se projeví i na této veřejné adrese.

Důležité upozornění: Nezapomeňte ve produkčním prostředí změnit hodnotu „ALLOWED_HOSTS“, protože by to mohlo vytvořit bezpečnostní mezeru.

Závěrem

V tomto návodu jste se naučili, jak vytvořit demo URL adresu pro váš Django projekt, aniž byste jej museli nasazovat na server.

Procvičili jste si spouštění Django projektu a práci se souborem „settings.py“.

V neposlední řadě jste se naučili, jak používat Ngrok a jak s jeho pomocí zpřístupnit libovolný lokální server.

Nyní můžete prozkoumat další populární frameworky Pythonu pro tvorbu API.