Publikacja strony internetowej na serwerze

Publikacja strony to przeniesienie gotowych plików – HTML, CSS, skryptów PHP i obrazów – z komputera, na którym powstały, na serwer WWW dostępny w internecie. Składa się z czterech elementów: hostingu (miejsca na serwerze, które ktoś utrzymuje za Ciebie), domeny (adresu, pod którym serwer jest widoczny, np. sklep.gry.pl), przesłania plików (programem FTP/SFTP albo menedżerem plików w panelu hostingu) i sprawdzenia, czy strona pod nowym adresem działa tak samo jak u Ciebie. Podstawa programowa poświęca temu cały efekt: Podstawa programowa INF.03.3, efekt 8: „Uczeń publikuje witryny i aplikacje internetowe" – kryterium 1: „opisuje usługi hostingu", kryterium 3: „opisuje operacje na domenach internetowych", kryterium 5: „rozpoznaje etapy publikacji witryn i aplikacji internetowych", kryterium 6: „opisuje funkcje programów wykorzystywanych do przesyłania danych na serwer", kryterium 8: „przesyła dane na serwer", kryterium 10: „sprawdza poprawność publikowanych stron www".

Na egzaminie INF.03 trzeba jednak od razu powiedzieć, jak to wygląda naprawdę. W części praktycznej nic nie wysyłasz na żaden zdalny serwer. „Serwerem" jest pakiet XAMPP zainstalowany na stanowisku: „Wykonaj aplikację internetową zawierającą ranking gier komputerowych, wykorzystując edytor grafiki rastrowej, pakiet XAMPP oraz edytor zaznaczający składnię" (arkusz CKE INF.03, czerwiec 2025, zadanie 1). Pliki strony zostają w folderze na pulpicie, a jedyną „publikacją" jest nagranie ich na płytę: „Nagraj płytę z rezultatami pracy. […] Po nagraniu płyty sprawdź poprawność jej odczytu. Opisz płytę numerem zdającego, którym został podpisany arkusz" (arkusz CKE INF.03, czerwiec 2025, zadanie 1). W arkuszach zebranych na portalu (INF.03 2021–2026, EE.09 2017–2022) frazy „htdocs", „FTP" i „hosting" w części praktycznej nie padają ani razu. Za to w części pisemnej publikacja jest stałym pytaniem: „Program o nazwie FileZilla pozwala na […] publikację strony internetowej na odległym serwerze" (arkusz CKE EE.09, styczeń 2021, część pisemna, zadanie 40 – klucz D).

Lokalny serwer z XAMPP ma w podstawie osobne miejsce – Podstawa programowa INF.03.5, efekt 5, kryterium 4: „instaluje i konfiguruje serwer WWW", kryterium 5: „instaluje i konfiguruje serwer baz danych" – a skrypty PHP to Podstawa programowa INF.03.5, efekt 4: „Uczeń programuje skrypty wykonywane po stronie serwera". Właśnie dlatego to hasło mówi o dwóch serwerach naraz: o tym na stanowisku egzaminacyjnym i o tym w internecie. Kroki są te same, różni się tylko miejsce.

Cztery zasady, które porządkują temat:

• Na egzaminie rezultatem jest folder z numerem zdającego nagrany na płytę, nie strona pod adresem w internecie (arkusz CKE INF.03, czerwiec 2025, zadanie 1).
• Skrypt PHP wykonuje serwer, nie przeglądarka – dlatego zasady oceniania każą sprawdzać rezultat ze skryptem w konkretnej wersji XAMPP (zasady oceniania INF.03, czerwiec 2025, zadanie 1 – streszczenie).
• Odnośniki i ścieżki do plików mają być względne – tylko takie przeżyją przeniesienie folderu na płytę albo na inny serwer (zasady oceniania E.14, czerwiec 2020, zadanie 1 – streszczenie).
• Do przesyłania plików na zdalny serwer służy FTP albo jego szyfrowana odmiana SFTP i klient taki jak FileZilla – to wiedza z części pisemnej (arkusz CKE EE.09, styczeń 2020, część pisemna, zadanie 40 – klucz A).

Uruchamianie phpMyAdmin i import bazy opisuje hasło Import bazy i kwerendy w phpMyAdmin, a sprawdzanie kodu walidatorem – Walidacja W3C i dostępność WCAG strony. Tu zajmujemy się tym, co dzieje się z plikami po napisaniu kodu.

Poniższe kroki dotyczą każdej publikacji – na płytę egzaminacyjną, do htdocs i na zdalny hosting. Przykładowy folder nazywa się 12345678, jak numer zdającego.

1. Zbierz wszystkie pliki strony w jednym folderze i używaj ścieżek względnych. Arkusz mówi wprost: „Zaleca się, aby rozpakowane pliki graficzne znajdowały się w tym samym folderze, co pliki źródłowe strony" (arkusz CKE INF.03, czerwiec 2025, zadanie 1). Ścieżka względna liczy się od pliku, w którym stoi, więc folder można przenieść w całości i nic się nie psuje:

<link rel="stylesheet" href="styl.css">
<img src="Mag.jpg" alt="Mag" title="6">
<a href="regulamin.html">Regulamin</a>
<a href="obrazy/kw1.jpg">kwerenda1</a>

Dlaczego: zasady oceniania z 2020 roku wymagały, żeby odsyłacze zawierały ścieżkę względną (zasady oceniania E.14, czerwiec 2020, zadanie 1 – streszczenie), a ścieżka typu C:\Users\Egzamin\Desktop\… po nagraniu płyty prowadzi donikąd.

2. Uruchom stronę na lokalnym serwerze. Według FAQ XAMPP „głównym katalogiem dla wszystkich dokumentów WWW jest \xampp\htdocs", a plik test.html położony w tym katalogu jest dostępny pod adresem http://localhost/test.html; podkatalog new otwiera się jako http://localhost/new/test.php. Skopiuj więc swój folder do htdocs, włącz Apache i MySQL w XAMPP Control Panel („Uruchom usługi MySQL i Apache za pomocą XAMPP Control Panel" – Informator INF.03, przykład zadania do części praktycznej) i wpisz adres:

# Windows z XAMPP: C:\xampp\htdocs\12345678\gry.php
# w przeglądarce:  http://localhost/12345678/gry.php

# Linux z Apache (sprawdzone w kontenerze Debian, Apache 2.4.68, PHP 8.2):
cp -r 12345678 /var/www/html/
# w przeglądarce:  http://localhost/12345678/gry.php  ->  200 OK, "PHP dziala: 5"

Dlaczego: plik .php otwarty dwuklikiem z dysku nie jest wykonywany – przeglądarka dostaje sam tekst <?php echo … ?> (sprawdzone). Wykonuje go dopiero serwer, bo to „skrypty wykonywane po stronie serwera" (Podstawa programowa INF.03.5, efekt 4). Zwykły HTML i CSS działają także z dysku – i na to liczą zasady oceniania: „Jeśli witryna nie uruchamia się z powodu błędów PHP – uruchomić plik lokalnie z dysku lub sprawdzić wg kryteriów w kodzie źródłowym strony" (zasady oceniania INF.03, czerwiec 2021, zadanie 1 – streszczenie).

3. Zdobądź dane dostępowe do serwera. Firma hostingowa podaje cztery rzeczy: adres serwera (host), nazwę użytkownika, hasło i katalog, do którego mają trafić pliki strony. Port wynika z protokołu – zgodnie z systemową listą usług (/etc/services) FTP używa portu 21, a SFTP działa przez SSH na porcie 22; strona wyświetla się przez HTTP na porcie 80 albo HTTPS na porcie 443.

4. Połącz się klientem i prześlij folder. W FileZilla i podobnych programach wpisujesz host, użytkownika, hasło i port, a po połączeniu widzisz dwa panele: po lewej pliki na Twoim komputerze, po prawej – na serwerze. Przeciągasz cały folder strony do katalogu dokumentów serwera. Program przesyła pliki jeden po drugim i zgłasza te, których nie udało się wysłać. Właśnie o tę funkcję pyta część pisemna: „Program FileZilla może posłużyć do […] publikacji strony internetowej" (arkusz CKE EE.09, czerwiec 2019, część pisemna, zadanie 40 – klucz C).

5. Sprawdź stronę po wgraniu tak, jakbyś widział ją pierwszy raz. Otwórz adres w przeglądarce i przejdź wszystkie odnośniki, obrazy i formularze. Trzy rzeczy, które lokalnie działały, a na serwerze potrafią paść, sprawdzone na serwerze Apache 2.4 w kontenerze Debian:

# ten sam folder 12345678 skopiowany do /var/www/html
http://localhost/12345678/              -> 200 OK   (serwer podał index.html)
http://localhost/12345678/Mag.jpg       -> 200 OK
http://localhost/12345678/mag.jpg       -> 404 Not Found   (inna wielkość liter)
http://localhost/12345678/GRY.php       -> 404 Not Found
http://localhost/12345678/tajne.txt     -> 403 Forbidden   (plik z chmod 000)

ls -l 12345678
-rw-r--r--  gry.php      # 644: właściciel czyta i pisze, reszta czyta
-rw-r--r--  styl.css
drwxr-xr-x  obrazy       # 755: katalog musi mieć prawo wejścia (x)
----------  tajne.txt    # 000: serwer nie może odczytać -> 403

Dlaczego: serwer Linux rozróżnia wielkość liter w nazwach plików, a Windows na stanowisku egzaminacyjnym – nie; plik, którego serwer nie ma prawa odczytać, zwraca błąd 403 zamiast treści. Kody odpowiedzi 404 i 403 zobaczysz w zakładce Sieć narzędzi deweloperskich – patrz Debugowanie w konsoli przeglądarki.

Ścieżka z własnego dysku w src lub href. Edytor podpowiada pełną ścieżkę C:\Users\Egzamin\Desktop\12345678\Mag.jpg albo file:///…, strona u zdającego wygląda dobrze, a po skopiowaniu folderu na serwer egzaminatora obraz znika. Zasady oceniania wymagały odsyłaczy ze ścieżką względną (zasady oceniania E.14, czerwiec 2020, zadanie 1 – streszczenie), a układ bloków i obrazy ocenia się po uruchomieniu w przeglądarce (zasady oceniania INF.03, czerwiec 2025, zadanie 1 – streszczenie). Poprawka: sama nazwa pliku lub ścieżka od folderu strony – src="Mag.jpg", href="obrazy/kw1.jpg".

Inna wielkość liter w nazwie pliku i w kodzie. Archiwum z arkusza zawiera pliki Czarodziejka.jpg, kalipso.jpg, NieznanyLad.jpg – każdy w innej konwencji (arkusz CKE INF.03, czerwiec 2025, zadanie 1). Na Windows src="mag.jpg" otworzy Mag.jpg, na serwerze Linux zwróci 404 (sprawdzone na Apache 2.4). Poprawka: kopiuj nazwy z Eksploratora, nie przepisuj z pamięci; na hostingu trzymaj się małych liter.

Plik PHP otwarty bezpośrednio z dysku. Zdający dwuklika gry.php, przeglądarka pokazuje surowy kod albo pustą stronę i zaczyna się szukanie błędu w składni. Kod PHP wykonuje serwer (Podstawa programowa INF.03.5, efekt 4), więc plik trzeba otworzyć przez http://localhost/… z folderu htdocs przy włączonym Apache (FAQ XAMPP). Egzaminator zrobi to samo w XAMPP 8.2.12 (zasady oceniania INF.03, czerwiec 2025, zadanie 1 – streszczenie). Poprawka: testuj skrypt tam, gdzie działa serwer, a połączenie z bazą buduj jak w haśle Połączenie z bazą MySQL w PHP (mysqli).

Grafiki poza folderem z numerem zdającego. Obrazy zostały w rozpakowanym archiwum na pulpicie, strona w folderze – lokalnie działa, bo ścieżka ../pliki1/Mag.jpg istnieje, na płycie już nie. Arkusz zaleca trzymać pliki graficzne „w tym samym folderze, co pliki źródłowe strony" i wymienia z nazwy, co ma być na płycie: Czarodziejka.jpg, gry.php, import.png, kalipso.jpg, …, styl.css (arkusz CKE INF.03, czerwiec 2025, zadanie 1). Poprawka: przed nagraniem otwórz stronę z folderu, który nagrywasz, nie z folderu roboczego.

Brak pliku przeglądarka.txt albo płyta niesprawdzona po nagraniu. Plik z nazwą przeglądarki jest osobnym poleceniem i figuruje na liście plików do nagrania (arkusz CKE INF.03, czerwiec 2025, zadanie 1). Płytę trzeba po nagraniu odczytać – arkusz każe sprawdzić poprawność odczytu, a wynik, którego nie da się odczytać, jest dla egzaminatora niewidoczny. Poprawka: przeglądarka.txt twórz od razu po pierwszym teście strony; po nagraniu otwórz płytę i przejrzyj listę plików.

Dwa pliki startowe w jednym folderze. Zdający zostawia stary index.html obok nowego index.php. Który otworzy się pod adresem folderu, zależy od listy DirectoryIndex serwera: domyślnie jest na niej tylko index.html (dokumentacja Apache mod_dir), a konfiguracja Debiana wymienia index.html przed index.php (sprawdzone) – serwer pokaże więc starą stronę. Poprawka: w folderze zostaje jeden plik startowy o nazwie z treści zadania, np. „Odnośnik „Strona główna" prowadzący do strony index.php" (arkusz CKE INF.03, styczeń 2025, zadanie 4).

Pomylone narzędzia w części pisemnej. FileZilla to klient FTP/SFTP do przesyłania plików na serwer – nie waliduje strony, nie importuje bazy i nie jest systemem kontroli wersji; do tych zadań służą odpowiednio walidator W3C, phpMyAdmin i GIT (arkusz CKE EE.09, styczeń 2021, część pisemna, zadanie 40 – klucz D; arkusz CKE E.14, styczeń 2021, część pisemna, zadanie 25 – klucz C). Poprawka: kojarz nazwę programu z czynnością, a protokół z portem – FTP 21, SFTP 22, HTTP 80, HTTPS 443.

Zagadnienia z tego samego obszaru matury – warto je powtórzyć razem: