Slik setter du opp en egen CS2-HUD for streaming: steg for steg med GSI

De egne grafikkene du ser på turneringssendinger (lagpaneler, killfeed, bombetimer) kommer ikke fra selve spillet. Et eget overlegg leser live kampdata som spillet sender ut, og streamingprogrammet legger det oppå spillbildet. I denne guiden setter jeg opp min egen CS2 Major HUD med åpen kildekode, steg for steg. Den samme ideen fungerer for andre GSI-baserte HUD-er også.

Hva du trenger

• Counter-Strike 2 (Steam)
• Python 3 (fra python.org)
• OBS Studio, eller et annet streamingprogram som kan legge til en nettleserkilde
• HUD-filene: github.com/manyaksisko35/CounterStrike2MajorHUD

1. Legg GSI-cfg-filen inn i spillet

CS2s Game State Integration (GSI) sender kampens tilstand som JSON til en adresse du velger. For å slå det på legger du en fil som starter med gamestate_integration_ og slutter på .cfg i spillets cfg-mappe. Kopier gamestate_integration_manyak.cfg fra prosjektet til denne mappen:

pathSteam\steamapps\common\Counter-Strike Global Offensive\game\csgo\cfg

Den enkle måten å finne mappen på: høyreklikk CS2 i Steam, velg Administrer → Bla gjennom lokale filer, og åpne game → csgo → cfg. Slik ser filen ut; spillet sender data til 127.0.0.1:3000 hvert 0,1 sekund:

cfg"Manyaksisko35 GSI v1"
{
 "uri" "http://127.0.0.1:3000"
 "timeout" "5.0"
 "buffer"  "0.1"
 "throttle" "0.1"
 "heartbeat" "30.0"
 "data"
 {
   "provider"            "1"
   "map"                 "1"
   "round"               "1"
   "player_id"           "1"
   "player_state"        "1"
   "player_weapons"      "1"
   "player_match_stats"  "1"
   "allplayers_id"       "1"
   "allplayers_state"    "1"
   "allplayers_weapons"  "1"
   "allplayers_match_stats" "1"
   "phase_countdowns"    "1"
   "allplayers_position" "1"
 }
}

Spillet leser cfg-filer når det starter, så hvis CS2 er åpent, må du starte det på nytt.

2. Start Python-serveren

En liten Flask-server tar imot dataene spillet sender. Åpne en terminal i prosjektmappen, installer pakkene og start serveren:

bashpip install -r requirements.txt
python main.py

For å sjekke at det fungerer, åpner du http://127.0.0.1:3000 i en nettleser; du skal se "CS2 GSI Sunucusu Aktif" ("CS2 GSI-serveren kjører"). Under en kamp viser http://127.0.0.1:3000/canli_veri de forenklede dataene HUD-en leser. Det er det første stedet du bør se når noe er galt.

3. Legg HUD-en til i OBS

• I OBS klikker du + i Kilder-boksen og velger Nettleser.
• Kryss av for "Lokal fil" og velg index.html fra prosjektet.
• Sett bredden til 1920 og høyden til 1080. Bakgrunnen er gjennomsiktig, så du trenger ikke mer.
• Flytt nettleserkilden over spillopptaket.

HUD-en spør serveren 10 ganger i sekundet og oppdaterer bare det som endret seg, så det flimrer ikke på streamen. Lagnavn og logoer står i index.html; endre dem der for din egen kamp.

Vanlige problemer

• HUD-en viser ingen data og tiden står på "--:--": sjekk at cfg-filen starter med gamestate_integration_ og ligger i riktig mappe, og start CS2 på nytt. Sørg for at serveren kjører.
• Lagpanelene er tomme: spillet sender bare data om alle spillerne (allplayers) når du ser på som tilskuer, ikke når du spiller selv. Det er derfor broadcast-HUD-er brukes i tilskuermodus eller med GOTV.
• "Adressen er allerede i bruk": et annet program bruker port 3000. Endre porten i main.py, uri-linjen i cfg-filen og adressen i index.html til den samme nye porten.
• Våpenikonene vises ikke: ikonene lastes fra internett. Uten tilkobling, eller hvis adressen endres, viser HUD-en våpennavnet som tekst og fortsetter å fungere.

Hvis du vil se hvordan HUD-en ser ut før du setter den opp, har prosjektsiden en live demo som spiller en eksempelkamp. Koden er åpen på GitHub, og jeg har skrevet om hvordan jeg bygde den i et eget innlegg.