Illustrerad bild, ej sann kvalité
LIVE Àr en hemsida Àr du kan direktsÀnda din skÀrm över till andra.
För att strömma laddar man ned en klient, Java eller Swift beroende pÄ plattform. Sen skapar man en anvÀndare pÄ hemsidan och dÀrifrÄn fÄr du en ström-nyckel. Sedan skrivs ens ström-nyckel in i programmet man laddat ned och man kan börja strömma. PÄ hemsidan kan man Àndra titeln pÄ sin ström och beskrivningen.
Andra anvÀndare kan gÄ in pÄ din ström genom framsidan som visar alla live strömmar eller en direkt lÀnk till din kanal (/stream?Username).
I det hÀr projektet finns det fyra delar. Java klienten som funkar pÄ alla datorer. Swift klienten som funkar pÄ macOS klienter men Àr ocksÄ mycket snabbare Àn Java version (troligen p.g.a att Swift Àr native). Sen finns det hemsidan som anvÀnds för att titta pÄ strömmar. Sist men inte minst Àr servern som hanterar alla strömmar. Den Àr skriven i nodeJS och anvÀnder socket.io och express. Den kopplar till en SQL server som sparar all anvÀndardata. Den hanterar ocksÄ chatt-systemet.
Systemet Ă€r lite begrĂ€nsat pĂ„ vissa sĂ€tt. För det första finns det inget ljud överhuvudtaget. Det hade nog inte varit sĂ„ svĂ„rt att implementera det för att strömma, problemet var att jag inte kunde lista hur jag skulle plocka upp ljudet frĂ„n anvĂ€ndarens dator. Jag vill inte bara âströmma en mp3, utan en ström frĂ„n mikrofonen och spelets ljud.
Eftersom strömmen inte anvÀnder sig utav video-kompression tar det upp mycket bredband. NÀr en klient strömmar komprimerar den bilden som en JPEG, konverterar bilden till Base64 och skickar den till servern. PÄ ett lokalt nÀtverk med en kabel-anslutning funkar det hÀr helt okej och pÄ skolans nÀtverk fungerar det bÀttre Àn vad man kan tro.
En bugg som uppkom nyligen under nÄgra senare tester Àr att om mÄnga strömmar samtidigt (3-5 st.) avbryts vissa strömmar. Jag vet inte varför det hÀnder eftersom det Àr inte p.g.a. nÄgon överbelastning. Jag tror det kan ha att göra med ett system jag implementerade ganska sent som ska indikera om en ström Àr live eller inte som kanske avbryter strömmen av misstag.
En annan bugg som finns i Java klienten och Swift klienten Àr att nÀr man Àndrar vÀrden (framförallt medans man strömmar) sÄ försvinner vÀrdet frÄn input-rutan. Just nu kan man ocksÄ Àndra vÀrden som kompression och width, height medans du strömmar. SÄ lÀnge man inte skriver in t.ex 0 i width eller height (eftersom programmet kraschar dÄ) sÄ funkar det okej.
Jag inte har anvÀnt mig av nÄgon slags MPEG kompression som anvÀnder sig av huvudbilder (I Frames) och sedan endast skickar information om hur pixlar rör sig (P Frames). DÀrför Àr min prestanda inte superbra. Det gÄr att likna med en GIF, dem Àr vÀldigt komprimerande men Àr sparade bild-för-bild. I ström-klienten (Swift och Java) kan man Àndra storlek pÄ bilden, vÀlja frame rate och hur mycket kompression man vill ha (kompressionen Àr JPG).
Utan nÄgon kompression, 1920x1080 blir varje bildruta ca 378.5KB stor. Om man dÄ skulle strömma i 30FPS blir det 11.35 MB / sekund,vilket Àr ca 90Mb/s.
Med en kompression pÄ 0.7, 640x480 blir det ca 80KB / bildruta. AlltsÄ vid 30FPS blir det 2.4 MB/sekund eller 19.2 Mb/s.
CLEAR
Ett error, user-drag finns ej som attribut i taggen IMG. Den varnar ocksÄ för alla -webkit och -moz versioner av user-drag. Jag vill fortfarande anvÀnda user-drag, och nÀr den inte identifieras sÄ ingoreras den bara av webblÀsare.
Ett error och en varning. Erroret Àr att det saknas en alt-attribut pÄ loggan, enkel fix. Varningen Àr att det inte finns nÄgon struktur för anvÀndare utan css och javascript-stöd (No headdings) Detta Àr inte sÄ viktigt eftersom hemsidan inte skulle fungera över huvudtaget utan CSS och Javascript. Ett sÀtt man kan hjÀlpa anvÀndare som saknar en modern och/eller fungerande webblÀsare Àr att göra en javascript check-up nÀr sidan laddas in genom att t.ex skicka en request via ajax till servern. Om den aldrig kommer fram kan man omdiregera anvÀndaren till en hjÀlpsida med tydfligt heading struktur.
Om du vill starta LIVE
nodeJS, mySQL, NPM
- Klona det hÀr repot
- Skapa en mysql databas som heter "live"
- Importera LIVE.sql
$ mysql live < LIVE.sql - Navigera till /server
- Konfiguera MySQL.json till din mysql server
- Installera dependencies frÄn NPM
$ npm ci - Starta servern
$ sudo node index.js
SÄ hÀr ska det se ut nÀr du Àr klar.
