Generowanie HTML jako API: serwer zwraca tylko tekst
Serwerowy serwis internetowy działa prosto: na żądania HTTP zwracaj tekst w formacie HTML. To podstawowy, stabilny sposób bez zbędnych zależności. Przeglądarka sama wykonuje całą skomplikowaną pracę renderowania.
Przykład minimalnego serwera Pythona opartego na wbudowanym module http.server. Odpowiada statyczną stroną HTML na każdy żądanie GET:
from http.server import BaseHTTPRequestHandler, HTTPServer
WEBPAGE = "<h1>Strona w Pythonie!</h1>\n"
class HTMLServer(BaseHTTPRequestHandler):
def do_GET(self):
self.send_response(200)
self.end_headers()
self.wfile.write(str.encode(WEBPAGE))
webServer = HTTPServer(("localhost", 8080), HTMLServer)
print("Serwer działa pod adresem http://localhost:8080")
webServer.serve_forever()Za pomocą curl widać czysty tekst:
$ curl localhost:8080
<h1>Strona w Pythonie!</h1>W przeglądarce znacznik <h1> przekształci się w sformatowany nagłówek. Dodaj CSS, aby nadać styl:
WEBPAGE = """
<style>
body {
background-color: lightblue;
font-family: 'Comic Sans MS', cursive;
}
</style>
<h1>Strona w Pythonie!</h1>
"""Przeglądarka automatycznie zastosuje style.
Renderowanie to zadanie przeglądarki
Serwer generuje tekst, przeglądarka parsuje go do DOM, oblicza układ, stosuje czcionki uwzględniając DPI, kering i metryki. To wieloetapowy proces: parsowanie, obliczanie stylów, układ, malowanie.
Realizacja renderowania wymaga głębokiego zrozumienia typografii — od konwersji pt na px po wysokość ascendera i descendera liter. Przeglądarki rozwiązują to za Ciebie.
Generowanie HTML to operacje na ciągach znaków. Nie ma potrzeby używania terminologii "renderowanie po stronie serwera", która sugeruje skomplikowanie.
HTML do prezentacji danych
Dowolne dane można wyrazić jako HTML przez szablony tekstowe. Przykład z dzielnicami Nowego Jorku:
boroughs = [
"The Bronx",
"Manhattan",
"Brooklyn",
"Queens",
"Staten Island"
]
LIST = "<li>".join(boroughs)
WEBPAGE = "<h1>Dzielnice NYC</h1><ul><li>" + LIST + "</ul>"Wynik poprawnie zostanie sparsowany przez przeglądarkę, nawet bez </li> (HTML5 jest tolerancyjny).
Podobnie dla JSON:
LIST = '","'.join(boroughs)
WEBPAGE = '{ "nyc_boroughs": ["' + LIST + '"] }'HTML jest lepszy: wbudowane narzędzia hipermultimedialne (linki, formularze) bez potrzeby JavaScriptu po stronie klienta.
- Zalety generowania HTML jako ciągów:
- Działa we wszystkich językach bez bibliotek.
- Minimalny nakład obliczeniowy.
- Łatwo debugować: curl pokaże surowy wynik.
- Krzyżowa platformowość (bash, awk, Python).
HTML API zamiast JSON API
Nazywaj to "HTML API": serwer zwraca HTML zamiast JSON. Przeglądarka to klient, który interpretuje hipermultimedia.
Porównanie:
HTML:
<h1>Dzielnice NYC</h1>
<ul>
<li>The Bronx
<li>Manhattan
<li>Brooklyn
<li>Queens
<li>Staten Island
</ul>JSON:
{
"nyc_boroughs": [
"The Bronx",
"Manhattan",
"Brooklyn",
"Queens",
"Staten Island"
]
}HTML zawiera zarówno dane, jak i ich prezentację. JSON zawiera tylko dane, wymaga logiki po stronie klienta.
Szablony dla środowiska produkcyjnego
W rzeczywistych usługach używaj szablonników takich jak Jinja2. Zapewniają one escaping, pętle, dziedziczenie.
Przykład z Jinja:
<h1>Dzielnice NYC</h1>
<ul>
{% for borough in boroughs %}
<li>{{ borough }}
{% endfor %}
</ul>- Główne zalety szablonników:
1. Automatyczny escaping HTML przeciwko XSS.
2. Powtarzalność fragmentów (partials).
3. Naturalny składnia dla języka (Htmx dla Rusta, Zig).
4. Bezstanowość: łatwo testować, debugować.
5. Brak overheadu hydrowania jak w SPA.
W przeciwieństwie do Reacta, gdzie JSON jest hydrowany do DOM po stronie klienta, szablony generują gotowy HTML po stronie serwera.
Co ważne
- Serwer generuje tekst HTML — przeglądarka renderuje.
- HTML API: hipermultimedia zamiast czystych danych JSON.
- Operacje na ciągach działają wszędzie, bez frameworków.
- Szablony dodają escaping i strukturę.
- Rozwiązanie skaluje się na dowolny język programowania.
— Editorial Team
Brak komentarzy.