Wiele kanałów i osobne nakładki

Czytaj wszystkie czaty w jednym doku, wybierając platformy widoczne w każdej nakładce widowni.

1. Połącz przechwytywanie w jednej sesji

Dodaj zamierzone czaty źródłowe w SSN i sprawdź, czy jedna nowa wiadomość z każdego dociera do tego samego niefiltrowanego doku Dok czatu transmisji. Zachowaj ten dok jako widok operatora.

Kopiuj wygenerowane łącza, aby zachować sesję, hasło, wersję i ustawienia serwera. Dodaj każdy widok widowni jako osobne źródło przeglądarkowe OBS. Nadaj źródłom OBS opisowe nazwy, takie jak Czat Twitch i Czat YouTube.

  1. Przechwytywanie Twitch + YouTube
  2. Jedna sesja SSN Dok operatora widzi oba
  3. Widoki OBS Tylko Twitch i tylko YouTube
Jeden przechwycony strumień może zasilać kilka różnie filtrowanych widoków.

2. Podziel przewijany czat według platformy

Dla przewijanego czatu utwórz dwie kopie wygenerowanego adresu URL doku dock.html . Dopisz te opcje do odpowiednich kopii:

Widok widowni Dopisz do URL doku
Czat Twitch &onlyfrom=twitch&hidemenu
Czat YouTube &onlyfrom=youtube&hidemenu
Twitch i YouTube razem &onlyfrom=twitch,youtube&hidemenu
Wszystko oprócz Discorda &hidefrom=discord&hidemenu

Na przykład przy domyślnym połączeniu:

https://socialstream.ninja/dock.html?session=YOUR_SESSION_ID&onlyfrom=twitch&hidemenu

Użyj onlyfrom i hidefrom dla tych stron. Nie zakładaj, że opcja taka jak onlytype z innej nakładki działa tutaj. Użyj youtubeshorts osobno, gdy przechwytywanie zgłasza ten typ. Zobacz Typy źródeł.

4. Dwa kanały na tej samej platformie

onlyfrom=twitch wybiera Twitch jako platformę, a nie konkretny kanał Twitch. Nazwy kanałów i tytuły transmisji są metadanymi, a nie wymiennymi nazwami filtrów URL. Dodaj &showchannelname aby pokazywać nazwy kanałów, gdy źródło je dostarcza.

Do zaawansowanego filtrowania doku &filtertid=123 przyjmuje liczbowy identyfikator karty źródłowej; obsługiwane są identyfikatory oddzielone przecinkami. Sprawdź rzeczywiste przechwycone dane, aby uzyskać jego tid (zobacz Dokumentacja zdarzeń i Polecenia i API). Nie używaj tutaj identyfikatora kanału platformy. Identyfikatory kart mogą zmieniać się po ponownym otwarciu źródeł, a źródła bez pasującego identyfikatora karty mogą zostać wykluczone. To opcja doku, a nie ogólny filtr kanału Featured Chat.

Dla w pełni niezależnych produkcji użyj osobnych instancji/profili przechwytywania z odrębnymi sesjami i otwieraj tam tylko źródła przeznaczone dla danej produkcji. Nadanie jednej nakładce innej sesji bez pasującego przechwytywania pozostawi ją bezczynną. Należące do nakładki label identyfikuje stronę do routingu; nie jest filtrem kanału.

5. Sprawdź każdy widok widowni

  1. Wyślij fikcyjną wiadomość testową Twitch i fikcyjną wiadomość testową YouTube do odizolowanej sesji za pomocą Twórz wiadomości testowe.
  2. Sprawdź, czy oba pojawiają się w doku operatora i czy każda przewijana nakładka pokazuje tylko zamierzone źródło.
  3. Wyróżnij każdą wiadomość i przetestuj przycisk czyszczenia. Po zmianie platform sprawdź wszystkie widoczne strony wyróżnionych wiadomości.
  4. Powtórz z prawdziwą wiadomością z każdego własnego połączonego źródła, ponieważ sztuczne wiadomości nie ustalają rzeczywistych identyfikatorów kart źródeł.

Jeśli widok jest pusty, tymczasowo usuń filtr. Jeśli czat wróci, sprawdź dokładny typ źródła lub identyfikator karty. Jeśli nadal jest pusty, użyj rozwiązywanie problemów z sesją i routingiem. Zmiana nazwy źródła OBS nie aktualizuje jego zapisanego URL.

6. Czat i alerty w jednej karcie przeglądarki

Użyj Połącz nakładki aby ułożyć istniejące adresy URL nakładek warstwami w jednej karcie lub jednym źródle przeglądarkowym OBS. Przydaje się to do czytania czatu na telefonie podczas transmisji IRL.

  1. Wklej wygenerowany URL Streaming Chat Dock do dolnej warstwy, a URL Multi-Stream Alert Box do górnej. Zachowaj sesję, hasło i opcje połączenia w obu łączach.
  2. Pozostaw Przezroczyste tło SSN zaznaczone. Włącz „Zezwalaj na dotknięcia i przewijanie na tej warstwie” dla czatu, a wyłącz dla alertów, aby nie blokowały interakcji z czatem.
  3. Wybierz Podgląd, a następnie Pokaż kod QR i zeskanuj aparatem telefonu. Lub wybierz Kopiuj połączone łącze aby wkleić wynik do źródła przeglądarkowego. Połączony widok nie ma elementów konfiguracji.

Możesz dodać do ośmiu adresów URL i używać przycisków strzałek do przesuwania warstwy za inną lub przed nią. Warstwy domyślnie wypełniają przeglądarkę. Rozwiń Rozmiar i pozycja w warstwie, aby ustawić jej szerokość, wysokość i przesunięcia od lewej oraz od góry w pikselach (na przykład 450) lub procentach (na przykład 100%). Pusta szerokość i wysokość wypełniają przeglądarkę; puste przesunięcia zaczynają w lewym górnym rogu. Przywróć pełny ekran czyści pozycję tej warstwy. Każda nakładka zachowuje własną treść i ustawienia.

Dla lewej kolumny czatu w źródle przeglądarkowym OBS 1920×1080 ustaw szerokość warstwy czatu na 450, wysokość na 1080, lewo na 0, a górę na 0. Inne warstwy mogą pozostać pełnoekranowe. Dla Hype nad czatem i Featured Chat przesuniętego w prawo użyj przepisu układu OBS poniżej. Rozmiary w pikselach pozostają stałe przy zmianie rozmiaru przeglądarki; procenty podążają za jej szerokością lub wysokością.

Użyj edytowalnego łącza, aby ponownie otworzyć konfigurację z wypełnionymi URL-ami i pozycjami. Aby później edytować połączone łącze, dodaj ?edit=1 przed jego #.

Łącza i opcje warstw są automatycznie zapisywane w tej przeglądarce, także niedokończone konfiguracje. Otwórz ponownie Połącz nakładki aby kontynuować edycję, lub wybierz Wyczyść zapisaną konfigurację aby zacząć od nowa. Magazyn przeglądarki może być niedostępny lub tymczasowy w trybie prywatnym.

Połączone łącze i kod QR zawierają pełny układ oraz adresy URL. Skonfiguruj na komputerze, zeskanuj raz na telefonie i dodaj połączony widok do zakładek. Otwarcie zapisuje też konfigurację w przeglądarce telefonu. Zmiany na komputerze nie aktualizują automatycznie starszego łącza: po edycji skopiuj lub zeskanuj nowe. Funkcja nie synchronizuje ustawień przez identyfikator sesji.

Chroń połączone łącza i kody QR tak samo jak pojedyncze łącza nakładek. Przechwytywanie SSN nadal musi działać, a telefon musi mieć dostęp do serwerów używanych przez oryginalne adresy URL. Adres localhost lub 127.0.0.1 wskazuje urządzenie otwierające łącze. Bardzo długie adresy URL mogą przekroczyć pojemność QR; połączone łącze nadal można skopiować.

Przepis OBS: lewa kolumna czatu z pełnoekranowymi efektami

Do tego układu nie potrzebujesz CSS. Każda warstwa jest osobnym obszarem przeglądarki. Ustaw całe źródło przeglądarkowe OBS na 1920×1080, a następnie użyj tych wartości w sekcji każdej warstwy Rozmiar i pozycja. Wpisz same liczby, bez przecinków ani „px”. Dodaj warstwy w tej kolejności, zaczynając od spodu:

WarstwaSzerokośćWysokośćLewoGóra
1. Czat na żywo / dok4501000080
2. Licznik hype4508000
3. Ściana emoji / emotek1920108000
4. Wyróżniony czat147010804500
5. NinjaBacker (opcjonalnie)1920108000

Pierwsze 80 pikseli jest zarezerwowane dla Hype, pozostawiając poniżej kolumnę czatu szeroką na 450 pikseli. Aby czat zamiast tego zajmował pełną wysokość za Hype, ustaw wysokość Live Chat na 1080 i górę na 0. Inne rozmiary scen wymagają innych wartości pikseli.

  1. Wklej pełne adresy URL nakładek. Skopiuj je z właściwości istniejących źródeł przeglądarkowych, zachowując sesję, hasło, style i ustawienia połączenia. Pozostaw Przezroczyste tło SSN zaznaczone. Przycinanie, przekształcenia, filtry OBS i pole Custom CSS nie są częścią URL i nie są przenoszone.
  2. Wyśrodkuj Hype w kolumnie. W jego hype.html URL ustaw align=center (zastąp istniejące align=left lub align=right, i usuń alignright jeśli obecne). W URL, który już ma ?session=..., dopisz &align=center. Opcjonalny zwarty styl początkowy to &combineall&hidetitle&style=compact&scale=0.75; zastąp istniejące wartości zamiast je powielać. Zwiększ wysokość warstwy Hype, jeśli wybrany styl potrzebuje więcej miejsca.
  3. Trzymaj Featured Chat poza kolumną czatu. Ustaw Left = 450 i Width = 1470 razem: 450 + 1470 = 1920. Przesunięcie warstwy szerokiej na 1920 o 450 w prawo obcięłoby jej prawą krawędź. Featured Chat nadal umieszcza wiadomość blisko dołu własnego obszaru. Aby wyśrodkować krótsze wiadomości w tym obszarze, dodaj &center do jego featured.html URL. Aby zamiast tego wyśrodkować wiadomości w całej scenie, użyj Left = 0, Width = 1920 oraz &center.
  4. Trzymaj NinjaBacker nad Featured Chat. Wklej URL nakładki widza jako ostatnią warstwę z istniejącym ustawieniem animacji wejścia z prawej. Łącznik steruje obszarem i kolejnością warstw; nakładka NinjaBacker steruje animacją i wewnętrznym rozmieszczeniem. Jej tło musi być przezroczyste, a witryna musi zezwalać na osadzanie. Ta opcjonalna warstwa nie była częścią testu przykładu czterech nakładek.
  5. Podejrzyj w rozdzielczości 1920×1080. Wyślij testową wiadomość czatu z emoji, wyróżnij wiadomość z doku i włącz dane Hype w SSN. Sam zwykły czat nie wybiera wiadomości Featured Chat. Jeśli nakładka pozostaje pusta, sprawdź działanie każdej osobno.
  6. Skopiuj nowe połączone łącze do OBS. Ustaw własną szerokość tego źródła przeglądarkowego na 1920, a wysokość na 1080. Rozmiar podglądu łącznika nie ustawia wymiarów OBS. Dopasuj nowe źródło do sceny bez przycinania. Po każdej zmianie układu skopiuj nowe połączone łącze ponownie; starsze łącze OBS zachowa stary układ.
Przetestowany połączony widok: Hype wyśrodkowany nad wąską lewą kolumną czatu, emoji w całej scenie i wyróżniona wiadomość wzdłuż dołu po prawej stronie czatu.
Rzeczywisty test Chromium z czterema nakładkami SSN i odizolowanym strumieniem testowym. Obraz jest przezroczysty; ciemne tło pokazano tutaj dla czytelności. Kliknij, aby zobaczyć pełny rozmiar. Czcionki, kolory i odstępy wiadomości pochodzą z własnych ustawień nakładek.

Wydajność: jedno źródło przeglądarkowe nadal uruchamia każdą osadzoną nakładkę i jej połączenia. Łączenie zmniejsza liczbę źródeł OBS, ale nie gwarantuje mniejszego użycia CPU ani pamięci. Po zakończeniu zamknij podgląd przeglądarki i porównaj wydajność OBS z wyłączonymi starymi źródłami. Wydajność M1 macOS/OBS i konkretny URL NinjaBacker nadal wymagają sprawdzenia w Twojej konfiguracji. Możesz zachować Live Chat osobno i połączyć tylko pozostałe nakładki, jeśli działa to lepiej.

Jeśli warstwa jest pusta lub zakrywa czat

  • Najpierw otwórz każdy oryginalny URL osobno. Alerty zwykle pozostają puste do nadejścia zdarzenia; łączenie stron nie przechwytuje nowych zdarzeń.
  • Automatyczna przezroczystość obsługuje dock.html, featured.html, multi-alerts.html i minecraft.html. Inne strony potrzebują własnych ustawień przezroczystego tła. Niektóre witryny zewnętrzne całkowicie blokują osadzanie.
  • Przezroczysta warstwa nadal może blokować dotyk. Wyłącz Zezwól na dotyk i przewijanie w każdej warstwie nad czatem, która nie wymaga interakcji.
  • Przeglądarki mobilne mogą wymagać interakcji ze stroną przed odtworzeniem dźwięku. W razie potrzeby włącz interakcję dla tej warstwy i dotknij jej; ograniczenia automatycznego odtwarzania nadal obowiązują. Sprawdź dźwięk na rzeczywistym telefonie, zanim na nim polegniesz.