Skip to content
Guidance

Nettleseravspiller for strømming

Når vi setter opp en lokal strømmeserver, bør det være enkelt for brukerne å koble seg til for å følge videostrømmen. For å få til det kan vi lage en HTML-side med nettleseravspiller for video.
Nettleser med videoavspiller som står klar til avspilling. Skjermbilde.
Image: Tron Bårdgård, Julius Silver / CC BY-SA 4.0

1. Legg til konfigurasjon for HTML-støtte

Åpne Nginx-konfigurasjon i editor.

sudo nano /etc/nginx/nginx.conf

Fjern den nederste sløyfeparentesen "}" i konfigurasjonen og kopier inn konfigurasjonen nederst i dokumentet.

Legg til HTML-konfigurasjon
1#konfigurasjon for forespørsler etter nettside
2        server {
3                listen 80; #portnummer, 80 er standard for web
4                location / {
5                        try_files $uri $uri/ =404;
6
7                root /var/www/html;
8                #prioriteringsliste, hvis ingen fil er spesifisert i forespørselen
9                index index.html index.htm index.nginx-debian.html;
10                }
11        }
12}

Trykk tastene Ctrl + X for å gå ut av editoren. Bekreft lagring av endringene.

2. Restart Nginx

Restart Nginx for at ny konfigurasjon skal bli tatt i bruk.

sudo systemctl restart nginx

Ved feil bruker du statuskommandoen under for feilsøking.

sudo systemctl status nginx

Bruk tastene Ctrl + Z for å komme ut av statusoversikten.

3. Teste standardnettside

Nettleserutklipp med teksten "Welcome to nginx!" øverst. Skjermbilde.
Image: Tron Bårdgård / CC BY-SA 4.0

Tidligere i Nginx-installasjonen testet du standard-HTML-siden som kommer med Nginx.

Etter at du begynte å lage din egen konfigurasjon, ble denne siden utilgjengelig. Nå har du lagt til ny konfigurasjon som gjør at siden igjen er tilgjengelig.

Gå i nettleseren og skriv inn IP-adressen til strømmeserveren din.

4. Lag statisk nettside for nettbasert strømmeavspiller

Det finnes en rekke nettleserbaserte avspillere for videostrømmer, i denne guiden brukes Video.js.

I dette oppsettet hentes selve videoavspilleren direkte fra Video.js-prosjektets sider. For oppsett som er uten nettilgang må Video.js-filene lastes ned på strømmeserveren. Det går vi ikke gjennom i denne guiden.

Lag HTML-side for avspilleren.

sudo nano /var/www/html/index.html

Kopier inn og juster HTML-koden til oppsettet ditt. Spesielt IP-adressen etter "source src=" må byttes til din servers IP-adresse.

Enkel index.html-side
1<!DOCTYPE html>
2<html>
3	<head>
4		<meta charset=utf-8 />
5		<title>Strømmetest</title>
6		<link href="https://unpkg.com/video.js/dist/video-js.css" rel="stylesheet">
7		<script src="https://unpkg.com/video.js/dist/video.js"></script>
8		<script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js"></script>
9	</head>
10	<body>
11		<video id="video1" class="video-js vjs-fluid vjs-default-skin vjs-big-play-centered" controls preload="auto" data-setup='{}'>
12		<source src="http://192.168.1.25:8080/stream.m3u8" type="application/x-mpegURL">
13	</video>
14  
15	<script>
16		var player = videojs('video1');
17		player.responsive(true);
18		player.play();
19		</script>	
20  
21</body>
22</html>

Trykk tastene Ctrl + X for å gå ut. Bekreft lagring av endringene.

5. Teste nettleseravspiller

For testen trenger du en aktiv RTMP-videostrøm fra OBS eller et annet strømmeprogram til serveren din. Sjekk at strømmen inn mot serveren din er aktiv før du går videre.

Maskinen du forsøker å åpne strøm fra, kan være den samme som du strømmer ut med, eller det kan være en annen maskin som er på det samme lokale nettverket som serveren din.

Nettleservindu med fullskjermavspiller som viser et landskapsbilde med fjord og høye fjell. Skjermbilde.
Image: Tron Bårdgård / CC BY-SA 4.0

Gå i nettleseren på en maskin som er tilkoblet det samme nettverket som strømmeserveren din. Skriv inn IP-adressen på serveren din.

Hvis oppsettet fungerer, vil du få opp en nettleseravspiller som du kan starte for å koble deg til videostrømmen du har satt opp.

En enkelt strømmeserver vil ikke kunne betjene veldig mange seere samtidig. Derfor bør du teste grundig før eventuell strømming.

Ved feil

Hvis videostrømmen ikke vil starte i nettleseravspilleren, kan du sjekke ut følgende mulige feilkilder og triks.

Er maskinen du forsøker å avspille med, i samme nettverk som strømmeserveren din?

Har maskinen du forsøker å spille av fra, tilgang til internett?

Sjekk at du har en aktiv RTMP-videostrøm fra OBS til serveren din.

Sjekk HTML-koden i Index.html-fila på serveren.

Restart videostrømmen fra OBS til strømmeserveren.

Sjekk at Nginx-konfigurasjonen er riktig. Forsøk gjerne med en restart av Nginx-webserveren.