NYXUAFTER HOURSWróć do panelu ↗

Nyxu na żywo

Pełna instrukcja • Pterodactyl + TikTok LIVE Studio • 1920 × 1080 • aktualizacja 7.11.2026

W paczce masz pięć scen, avatar, Discord nyxu_x oraz adres https://tipply.pl/@Nyxu. Dołączony serwer Node.js udostępnia grafikę na Twoim hostingu. Obraz gry, kamera, dźwięk i przełączanie transmisji należą do TikTok LIVE Studio.

Ważne dla obsługi: przyciski Start / Rozgrywka / Przerwa w panelu Nyxu wybierają podgląd i link. Właściwe sceny transmisji tworzysz i przełączasz w LIVE Studio. Panel Nyxu nie ma połączenia sterującego z tą aplikacją.

Nazwy przycisków mogą różnić się między językami i wersjami programów. Tam, gdzie dostępność zależy od konta lub wersji, opisano to przy danym kroku.

1. Przygotuj usługę w Pterodactylu

  1. Zaloguj się do swojego panelu hostingu i wybierz osobną, pustą usługę dla tej strony.
  2. Usługa powinna obsługiwać Node.js, najlepiej wersję 22 lub 24. W Pterodactylu typ aplikacji określa szablon nazywany „egg”. Sam dostęp do panelu z serwerem FiveM nie oznacza, że możesz uruchomić na nim Node.js.
  3. Jeśli masz wyłącznie usługę FiveM albo zajętą usługę bota, poproś hosting o osobną usługę Node.js. Pozwoli zachować działającą grę lub bota.
  4. Na tak małą stronę proponuję 256 MB RAM; jeśli szablon hostingu uruchamia dodatkowe procesy, wybierz 512 MB. To propozycja przydziału, nie wymaganie TikToka. Pliki paczki zajmują kilka MB.
  5. Otwórz Network / Sieć / Allocations i zapisz publiczny adres oraz główny port. Hosting może pokazywać adres także nad konsolą. To adres aplikacji, a nie strony logowania do panelu.

Program sam odczytuje SERVER_PORT ustawiony przez Pterodactyl. Gdy tej zmiennej nie ma, używa PORT, a przy braku obu — 8080. Nie ustawiaj losowego portu spoza przydziału hostingu.

2. Wgraj całą nową paczkę

  1. Pobierz zaktualizowany ZIP z tej rozmowy.
  2. W Pterodactylu wejdź w Files / Pliki.
  3. Wgraj ZIP przyciskiem Upload / Prześlij.
  4. Przy archiwum otwórz menu i wybierz Unarchive / Rozpakuj. Gdy hosting nie daje tej opcji, rozpakuj ZIP na komputerze i wgraj pliki przez SFTP. Dane SFTP znajdziesz w ustawieniach usługi.
  5. W głównym katalogu, zwykle /home/container, powinny znajdować się poniższe elementy.
Element Lokalizacja w Pterodactylu Do czego służy
server.js /home/container/server.js Uruchamia stronę
package.json /home/container/package.json Pozwala użyć npm start
START_TUTAJ.txt /home/container/START_TUTAJ.txt Krótkie uruchomienie
nyxu-stream /home/container/nyxu-stream/ Wszystkie sceny i zasoby

Jeżeli archiwum zostało rozpakowane do dodatkowego folderu, przenieś z niego te elementy poziom wyżej. server.js i package.json muszą leżeć obok siebie, a obok nich folder nyxu-stream.

3. Ustaw uruchamianie

Otwórz Startup / Uruchamianie. Wybierz odpowiedni wariant zależnie od pól, które daje hosting:

Pole w panelu Co ustawić
Node version / Docker image Dostępny obraz Node.js 22 albo 24
Main file / Entry point / JavaScript file server.js
Start command — gdy edytujesz pełne polecenie node server.js
npm script — gdy szablon uruchamia skrypty npm start
Pełna komenda npm — jeśli tego wymaga pole npm start

Wystarczy jeden wariant uruchamiania. Paczka nie wymaga instalowania bibliotek. Jeżeli szablon sam wykonuje npm install, pusty zestaw zależności jest prawidłowy. Nie włączaj automatycznego pobierania repozytorium, jeśli wgrywasz paczkę ręcznie i szablon udostępnia taką opcję.

Polecenie ustawiasz w Startup. Pole tekstowe konsoli uruchomionej aplikacji zwykle nie jest terminalem powłoki. Jeśli Startup jest zablokowany, hosting musi ustawić plik startowy lub polecenie.

Wróć do Console / Konsola i kliknij Start. Poprawne uruchomienie wyświetli komunikat podobny do: 

NYXU READY — HTTP, port 12345
Panel: /index.html | Instrukcja: /PTERODACTYL_TIKTOK.html

Numer 12345 w przykładzie zastąpi Twój rzeczywisty port. Usługa powinna pozostać uruchomiona podczas korzystania z nakładek.

4. Sprawdź adres i skonfiguruj HTTPS

W przeglądarce komputera otwórz http://TWÓJ_ADRES:TWÓJ_PORT/index.html, podstawiając publiczny przydział usługi. Powinien otworzyć się panel Nyxu. Pod /healthz zobaczysz {"status":"ok","app":"nyxu-stream"}.

Serwer udostępnia zawartość folderu nyxu-stream bezpośrednio pod głównym adresem. Dlatego URL to /index.html i /overlay.html, bez dopisywania /nyxu-stream/.

Do stałego używania w LIVE Studio najwygodniejszy jest adres domeny z działającym HTTPS, np. https://stream.twoja-domena.pl/. Jeśli hosting oferuje „Domenę / Proxy / Web proxy”, przypisz ją do tej usługi i włącz certyfikat. Jeśli tej funkcji nie ma, poproś administratora o skonfigurowanie połączenia z publicznej domeny do portu aplikacji.

Przykładowa treść do hostingu, do samodzielnego wysłania po uzupełnieniu danych:

Proszę udostępnić moją aplikację Node.js z przydziału [ADRES:PORT] pod domeną [DOMENA] z HTTPS. Aplikacja nasłuchuje po HTTP na 0.0.0.0 i porcie SERVER_PORT. Potrzebuję proxy do tego przydziału i certyfikatu TLS. Plik startowy to server.js, komenda node server.js.

Sam rekord DNS nie usuwa numeru portu i nie włącza HTTPS. Samo zamienienie http na https również nie uruchomi certyfikatu. Nie używaj portu panelu ani portu Wings jako portu strony.

Jeżeli link http://ADRES:PORT działa w Chrome, ale LIVE Studio go odrzuca, sprawdź ten sam zestaw pod poprawnym publicznym HTTPS. Nie trzeba zmieniać plików scen. Gotowe linki kopiuj już z docelowej domeny, aby miały właściwy adres.

5. Skonfiguruj wygląd w panelu Nyxu

  1. Otwórz index.html z adresu hostingu.
  2. Sprawdź nick, kolory, Discord i Tipply.
  3. Wybierz Start. Ustaw odliczanie, np. 5 minut, i kliknij Kopiuj link. Zapisz ten adres jako link sceny Start.
  4. Wybierz Rozgrywka. Jeśli używasz kamerki, włącz Ramka kamery i wybierz jej położenie. Skopiuj link tej sceny.
  5. Powtórz dla Przerwa, Rozmowa i Koniec.
  6. Jeśli „Kopiuj link” nie zapisuje schowka przy adresie HTTP, zaznacz całe pole z adresem i użyj Ctrl+C.

Każdy wygenerowany adres zawiera fragment #cfg=… z ustawieniami. Kopiuj go w całości. Zmiana ustawień panelu wpływa na jego podgląd; do LIVE Studio przenosisz zmianę, wklejając nowy link.

Możesz również pobrać config.js i zastąpić plik /home/container/nyxu-stream/config.js. Z takich ustawień skorzystają po odświeżeniu proste URL-e bez #cfg=…:

Scena Adres względem Twojej domeny
Start /overlay.html?scene=start
Rozgrywka /overlay.html?scene=live
Przerwa /overlay.html?scene=brb
Rozmowa /overlay.html?scene=chat
Koniec /overlay.html?scene=end

Link z #cfg=… ma pierwszeństwo przed config.js. Ustawienia zapisane w przeglądarce panelu nie synchronizują się automatycznie z aplikacją TikToka.

6. Utwórz pięć scen w LIVE Studio

  1. Uruchom TikTok LIVE Studio na swoim koncie.
  2. Dla tego zestawu wybierz układ poziomy / Landscape, 16:9. Zestaw zaprojektowano na 1920 × 1080. Format pionowy wymaga osobnej kompozycji; obrócenie lub rozciągnięcie tej grafiki pogorszy wygląd.
  3. W sekcji Sceny / Scenes utwórz osobne sceny: 01 START, 02 GRA, 03 PRZERWA, 04 ROZMOWA, 05 KONIEC.
  4. Jeśli aplikacja proponuje szablony, wybierz pusty układ i nadaj mu swoją nazwę.
  5. Ustaw jakość wyjściową na 1080p, jeśli Twoje konto i sprzęt ją obsługują. Płynność 60 FPS dla FiveM dobierz po teście; sama nakładka nie wymusza 60 FPS. Gdy opcja jest dostępna osobno dla źródła Link, wystarcza mu 30 FPS.

Do konfiguracji scen nie musisz rozpoczynać publicznej transmisji.

7. Dodaj źródła Link

Dla każdej sceny wykonaj te same kroki:

  1. Wybierz scenę, np. 01 START.
  2. Naciśnij Dodaj źródło / Add source → Link. W niektórych tłumaczeniach chodzi o źródło strony internetowej z polem URL.
  3. Nazwij źródło, np. Nyxu — Start.
  4. Wklej pełny link do odpowiedniej sceny overlay.html, skopiowany z panelu Nyxu.
  5. Jeśli trzeba, włącz Custom resolution / Własna rozdzielczość. Ustaw W = 1920, H = 1080. To rozmiar renderowania strony, niezależny od późniejszego skalowania źródła.
  6. Nakładka nie odtwarza dźwięku, więc jej opcja audio może pozostać wyłączona.
  7. Dodaj źródło i dopasuj je do całego poziomego płótna. W menu dopasowania szukaj Fit to screen / Dopasuj do ekranu. Zachowaj proporcje.
  8. Zablokuj pozycję źródła kłódką, jeśli jest dostępna, i przejdź do następnej sceny.

Do transmisji wklejasz link overlay.html. index.html otwiera panel z przyciskami i ustawieniami, więc powinien pozostać narzędziem do konfiguracji.

Jeśli źródło Link jest nieaktywne, kliknij je i sprawdź komunikat aplikacji dotyczący wersji, dostępu lub bieżącego układu. Braku tej funkcji nie rozwiąże zmiana adresu strony.

8. Ułóż rozgrywkę i kamerę

W 02 GRA uruchom FiveM i dodaj Przechwytywanie gry / Game capture, wskazując okno gry. W razie problemów spróbuj przechwytywania okna. Dopasuj grę do pełnego płótna.

Źródła wyżej na liście zakrywają niższe. Ustaw następującą kolejność od góry:

  1. Alerty Tipply / TikTok, jeśli już je dodasz.
  2. Nyxu — Rozgrywka, przezroczysta nakładka.
  3. Kamera, jeśli jej używasz.
  4. FiveM, obraz z gry.

Nakładka Rozgrywka ma już przezroczystość. Dodaj ją jako Link. Przechwytywanie zwykłego okna przeglądarki może zamienić przezroczyste tło w widoczny prostokąt.

Obraz kamerki powinien mieć proporcje 16:9. Dopasuj lub przytnij obraz w źródle kamery. Współrzędne liczone są od lewego górnego rogu płótna 1920 × 1080:

Ramka w Rozgrywce X Y Szerokość Wysokość
Prawa góra 1487 254 384 216
Prawy środek 1487 469 384 216
Lewa góra 49 254 384 216

Jeśli LIVE Studio pokazuje numeryczne pola rozmiaru i położenia źródła, użyj tych wartości. Jeśli Twoja wersja pozwala tylko przesuwać i skalować myszą, dopasuj obraz do wnętrza ramki w powiększonym podglądzie. Bez kamery zostaw Ramka kamery wyłączoną w panelu Nyxu.

9. Skonfiguruj scenę Rozmowa

W 04 ROZMOWA umieść kamerę albo obraz gry pod nakładką. Drugie okno przeznaczone jest na źródło czatu.

Element X Y Szerokość Wysokość
Duże okno kamery lub gry 80 210 1264 711
Okno czatu 1384 210 456 711

Jeśli w źródłach LIVE Studio jest dostępny widget czatu, dodaj go i dopasuj do prawego okna. Możesz też użyć własnego widgetu czatu zgodnego z TikTokiem, dodając jego URL jako osobne źródło Link. Paczka Nyxu nie pobiera komentarzy samodzielnie.

Start, Przerwa i Koniec mają pełne tło. Każda z tych scen może zawierać tylko właściwy Link Nyxu oraz ewentualne alerty. Dźwięk konfigurujesz osobno.

10. Przypisz przyciski do zmiany scen

Otwórz Ustawienia / Settings → Skróty klawiszowe / Hotkeys. Znajdź działania przełączające na konkretne utworzone sceny. Wybierz pole przypisania, naciśnij kombinację i zapisz. Jeśli Twoja wersja umieszcza przypisania przy scenach zamiast w ogólnych ustawieniach, użyj tych pól.

Poniższa tabela to proponowany zestaw do samodzielnego przypisania. Skróty nie są włączane przez pliki HTML.

Działanie Proponowany skrót
01 START Ctrl + Alt + 1
02 GRA Ctrl + Alt + 2
03 PRZERWA Ctrl + Alt + 3
04 ROZMOWA Ctrl + Alt + 4
05 KONIEC Ctrl + Alt + 5
Wyciszenie / przywrócenie mikrofonu Ctrl + Alt + M

Użyj lewego Ctrl i lewego Alt oraz cyfr z górnego rzędu. Sprawdź, czy przypisania nie kolidują z grą lub innym programem. Jeśli preferujesz pojedynczy klawisz, wybierz wolne przyciski, z których nie korzystasz w FiveM.

Jeżeli aplikacja udostępnia efekt przejścia, proponuję łagodne przenikanie około 200–300 ms. Gdy dostępne jest tylko zwykłe przełączenie, cały zestaw nadal działa.

Przetestuj skróty najpierw z aktywnym LIVE Studio, a potem z aktywnym FiveM. Jeśli działają tylko w pierwszym przypadku, sprawdź konflikty klawiszy oraz zgodność poziomu uprawnień aplikacji. Nie zakładaj, że skrót działa w grze, zanim tego nie sprawdzisz.

Możesz też przypisać te same kombinacje do przycisków posiadanego panelu makr lub Stream Decka, wybierając akcję wysyłania skrótu klawiaturowego. Najpierw uruchom przypisania bezpośrednio z klawiatury.

11. Odliczanie i przerwy

Licznik w Start i Przerwa zaczyna biec po załadowaniu strony. LIVE Studio może wczytać źródło wcześniej lub utrzymywać je aktywne w tle. Samo przełączenie sceny nie gwarantuje nowego odliczania.

Przed pokazaniem Start lub Przerwy odśwież odpowiednie źródło Link, korzystając z jego polecenia odświeżenia. Jeśli Twoja wersja udostępnia odświeżanie przy aktywacji, możesz je włączyć i sprawdzić wynik. Nie każda wersja ma taką opcję. Gdy odświeżenia nie ma, można ponownie wczytać źródło w jego ustawieniach; pewnym obejściem jest dodanie go od nowa przed transmisją.

Dla częstych, krótkich przerw wygodniejszy jest ekran bez licznika. W panelu Nyxu wybierz Przerwa, wyłącz odliczanie i skopiuj nowy link tylko do tej sceny. Link Start może nadal zawierać włączony licznik.

Po 00:00 pojawia się komunikat gotowości. Na Rozgrywkę przechodzisz własnym skrótem. Scena Koniec wyświetla podziękowanie; zakończenie połączenia LIVE wykonujesz osobno w aplikacji.

12. Mikrofon, gra i alerty

W mikserze wybierz właściwy mikrofon i właściwe źródło dźwięku gry. Wykonaj próbne nagranie, mówiąc podczas grania. Ustaw grę tak, aby głos był wyraźnie słyszalny i żeby wskaźnik mikrofonu nie dochodził do czerwonego pola. Unikaj równoczesnego przechwytywania tego samego audio przez dwa źródła.

Zmiana obrazu na Przerwę nie wycisza automatycznie mikrofonu ani audio FiveM. Przed odejściem użyj wyciszenia i sprawdź wskaźniki miksera. Po powrocie włącz mikrofon i dopiero wróć do rozmowy. Jeżeli ma zniknąć również głos z gry, wycisz odpowiedni kanał osobno.

Publiczny adres Tipply w grafice jest informacją dla widza. Transmisja zamienia stronę w obraz, więc link narysowany w scenie nie staje się klikalnym przyciskiem TikToka. Miejsce z aktywnym linkiem w profilu zależy od funkcji dostępnych dla konta.

Aby pokazywać powiadomienia o wpłatach:

  1. Zaloguj się do własnego panelu Tipply i otwórz konfigurację powiadomień / widgetu.
  2. Skopiuj wygenerowany tam adres nakładki powiadomień. Publiczny adres https://tipply.pl/@Nyxu prowadzi do strony wsparcia i nie jest URL-em widgetu alertów.
  3. Dodaj adres widgetu jako osobne źródło Link w LIVE Studio, zgodnie z rozmiarem podanym przez Tipply.
  4. Umieść alerty nad grafiką Nyxu i włącz audio źródła, jeśli alert zawiera dźwięk.
  5. Skorzystaj z testu powiadomienia w panelu dostawcy. Sprawdź obraz oraz dźwięk w próbnym nagraniu.

Własny URL widgetu wklejasz w źródle LIVE Studio. Nie umieszczaj go w publicznym config.js. Prezenty TikToka i wpłaty Tipply są oddzielnymi zdarzeniami. Alerty prezentów możesz dodać przez dostępne widgety LIVE Studio albo narzędzie do TikToka, np. TikFinity.

13. Próba przed pierwszym streamem

  1. Otwórz panel oraz źródło Rozgrywka z hostingu. Sprawdź, czy widać avatar i właściwe kolory.
  2. W LIVE Studio sprawdź wszystkie pięć scen oraz kolejność źródeł.
  3. Zrób krótkie lokalne nagranie, jeśli ta funkcja jest dostępna w Twojej wersji. Mów, uruchom FiveM i przełączaj sceny skrótami.
  4. Sprawdź brak czarnego prostokąta za nakładką rozgrywki, poprawny kadr kamery i czytelność napisów w podglądzie dla telefonu.
  5. Sprawdź wyciszenie na Przerwie i przywrócenie mikrofonu po powrocie.
  6. Przetestuj alerty, jeśli je dodałeś. Odtwórz nagranie i oceń poziom gry względem głosu.
  7. Przed rozpoczęciem właściwego LIVE odśwież licznik Start albo wyłącz odliczanie.

Typowy przebieg: wybierz Start → rozpocznij LIVE → skrót Gra → skrót Przerwa i wyciszenie → powrót do Gry z mikrofonem → Koniec → zakończ LIVE w aplikacji.

14. Najczęstsze problemy

Objaw Co sprawdzić
Cannot find module .../server.js Plik startowy ma złą nazwę albo paczka leży o jeden folder za głęboko.
NYXU ERROR i brak katalogu strony Folder nyxu-stream musi znajdować się obok server.js i zawierać index.html.
EADDRINUSE Port jest już zajęty. Sprawdź przydział i czy nie uruchomiono drugiej kopii.
Strona nie otwiera się po IP Usługa musi działać; użyj publicznego przydziału i sprawdź z hostingiem dostępność jego portu.
Panel wciąż pokazuje „Starting”, ale strona działa Administrator powinien dopasować rozpoznawanie gotowości szablonu do tekstu NYXU READY.
Błąd HTTPS Potrzebny jest działający certyfikat i proxy domeny. Sam serwer Node udostępnia HTTP.
404 po dopisaniu /nyxu-stream/ Przy dołączonym serwerze używaj bezpośrednio /index.html i /overlay.html.
Na streamie są przyciski panelu W źródle wklejono index.html. Skopiuj link wybranej sceny overlay.html.
Nakładka jest przycięta lub mała Ustaw renderowanie źródła Link na 1920 × 1080, poziome płótno i dopasowanie z zachowaniem proporcji.
Gra jest zasłonięta W scenie Gra użyj scene=live, źródła Link i poprawnej kolejności warstw.
Stare kolory lub napisy Wklej nowy pełny link. Fragment #cfg=… zachowuje stare ustawienia nawet po zmianie config.js.
Licznik już się skończył Źródło zostało załadowane wcześniej. Odśwież je albo wyłącz odliczanie.
Skrót nie działa Sprawdź przypisanie i konflikt z FiveM; przetestuj aplikację z aktywnym oknem oraz w tle.
Brak Link lub przypisań konkretnych scen Sprawdź dostępność w tej wersji i koncie. Zrzut listy źródeł lub skrótów pozwoli dopasować dalsze kroki.
Widać donate, ale brak alertów Napis z adresem wsparcia nie pobiera zdarzeń. Potrzebne jest osobne źródło widgetu Tipply.

Źródła i zakres sprawdzenia

Serwer i sceny można sprawdzić lokalnie. Konfiguracja Twojej usługi Pterodactyla i interfejs Twojej wersji LIVE Studio wymagają wykonania opisanych kroków po Twojej stronie. Nie jest to automatyczny instalator scen w TikToku.

Wróć do panelu Nyxu · Dotychczasowa instrukcja ogólna