lach Juniormester
06. oktober 2018 - 21:05 Der er 12 kommentarer

Videofremviser

Hej.
Jeg har en side i asp hvor man kan uploade små videoklps i forskellige formater.
Findes der en måde hvor man kan åbne videofremviser som kan afspille disse formater, en måde hvor man kan ligge codes ind.
Eller hvad gør man? og er mit spg. i den rette kategori?
keysersoze Guru
07. oktober 2018 - 01:00 #1
ASP fungerer på serveren - en afspiller ligger på klienten så du skal have fat i almindelig HTML. Se fx https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video og https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats
lach Juniormester
07. oktober 2018 - 14:34 #2
Det vil sige at man skal finde alle disse plugins, i html som kan understøtte forskellige videoer formater?
Eller findes der et der kan alle? Dem du har vist virker så kun i Mozilla browsere?
eurositi Ekspert
07. oktober 2018 - 22:27 #3
Der skal ikke downloades plugins. Disse formater er understøttet direkte i browseren. Hvis andre formater skal afspilles, skal siden enten loade en speciel webplayer, som brugeren selv skal godkende, eller også må brugeren først downloade videoen til sin lokale PC.
Ift. browserunderstøttede formater kan du bruge siden Caniuse.com: https://caniuse.com/#search=webm

Apples Safari er den store modspiller ift. understøttelse af åbne (ikke-licensbehæftede) mediestandarder. Hvis du ikke har Apple-brugere (eller er ligeglad med dem), kan du bruge VP9 video og Opus audio i en WebM container. Men hvis du vil være sikker på fuld browserunderstøttelse, skal du bruge den kommercielle mediestandard H.264 video og AAC audio i en MP4 container.
lach Juniormester
07. oktober 2018 - 22:34 #4
Så må jeg lige spørge hvad en web container er .?
eurositi Ekspert
07. oktober 2018 - 22:53 #5
Jeg går ud fra, at du har videoerne liggende i diverse filformater? Disse filformater kaldes også containere, fordi de teknisk set sammenholder videosporet og lydsporet (og nogle gange flere ting). WebM og MP4 er de mest almindelige i vore dage. Men f.eks. Flash hjemmesider benyttede ofte containeren FLV, og Silverlight benyttede WMV og ASF.

WebM indeholder video af typen VP8 eller VP9 samt lyd i typen Vorbis eller Opus.
MP4 indeholder (som regel) video i typen H.264 og lyd i typen AAC.

Andre filtyper (MKV, MXF eller MOV) kan indeholde mange typer af video og lyd, men generelt kan ingen af disse afspilles direkte i en browser. Disse containere er også udviklet til andre formål end lige netop streaming.

En web container er noget andet end en mediecontainer: https://en.wikipedia.org/wiki/Web_container
lach Juniormester
08. oktober 2018 - 19:26 #6
Tak for god forklaring.
Men når de ikke kan afspilles direkte i browseren, hvad er så løsningen?
Er det nødvendig at brugeren eks. installerer quick time player osv?
keysersoze Guru
10. oktober 2018 - 13:10 #7
Hvis man helt vil undgå problemer med formater osv skal du kigge på en ekstern løsning, fx youtube, vimeo eller 23video, men ellers kan du langt hen ad vejen nøjes med et video-tag som jeg linkede til i #1.
lach Juniormester
11. oktober 2018 - 18:15 #8
Vil indrømme, jeg er måske ikke helt med.
Men har prøvet dette:
<video controls
      muted
      src="video/test2.mp4"
      width="300"
      height="200">
    Din browser understøtter ikke dette plug-in.
</video>

Det virker dog ikke.
eurositi Ekspert
11. oktober 2018 - 18:37 #9
Ligger din test2.mp4 video i en undermappe, der hedder "video"? Ellers skal du fjerne dette præfiks fra src.
<video controls
      muted
      src="test2.mp4"
      width="300"
      height="200">
Din browser understøtter ikke Video-tagget.
</video>

... Altså hvis du har videoen i de pågældende to formater. Safari understøtter ikke WebM. Alle andre browsere gør.

Prøv også dette (lav for testens skyld gerne både en mp4 og en webm version af din video) og læg dem i samme mappe som HTML'en. Så burde dette virke:
<video controls>
  <source src="test2.webm" type="video/webm">
  <source src="test2.mp4" type="video/mp4">
  <p>Din browser understøtter ikke HTML5 video-tagget. Her er et <a href="test2.mp4">link til videoen</a> i stedet.</p>
</video>

Ovenstående vil:
- Afspille WebM-versionen af videoen, hvis browserenunderstøtter det (det gør Internet Explorer og Safari ikke), ellers vil den afspille MP4-versionen.
- Give mulighed for at downloade videoen
- Controls-elementet vil loade de standard kontrolfunktioner som den aktuelle browser benytter til video.
- Afspille videoen i fuld størrelse (fordi der ikke er angivet højde og bredde)
lach Juniormester
12. oktober 2018 - 17:25 #10
Hm. næ det virker godt nok ikke.:-(
Den skriver "ugyldig kilde". og din browser understøtter ikke HTML5

Jeg tester i Windows 10 edge.
keysersoze Guru
12. oktober 2018 - 18:16 #11
Prøv at kom med et link så vi kan se hvad der foregår.
eurositi Ekspert
12. oktober 2018 - 21:50 #12
Min Edge browser afspiller MP4-filen uden problemer. Min helt simple HTML5-kode ser således ud. HTML-filen med denne kode samt de to videofiler ligger i samme mappe:

<html>
<body>
<video controls>
  <source src="New_record.webm" type="video/webm">
  <source src="Viana_crowd.mp4" type="video/mp4">
  <p>Din browser understøtter ikke HTML5 video-tagget. Her er et <a href="Viana_crowd.mp4">link til videoen</a> i stedet.</p>
</video>
</body>
</html>


Edge og Internet Explorer afspiller kun MP4-filen. Hvis din Edge ikke engang afspiller MP4-filen, er der noget galt med dit setup.
Firefox og Chrome afspiller WebM-filen. De kan selvfølgelig også afspille MP4-filen, men de vælger selvfølgelig den første video.

Tjek hvilken version af Edge, du har installeret ved at klikke på Indstillinger i Edge (scroll evt. ned i bunden). Den opdateres gennem Windows Update, som du også kan søge manuelt i.
Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links

Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester



Seneste spørgsmål Seneste aktivitet
I dag 00:58 Tæl dato i Excel Af ltp i Excel
I dag 00:31 msata størrelse Af cocococo i PC
I går 19:55 SQL database Af John i Visual Basic
I går 19:03 Finde e-mail adresser i sin G-Mail Af Ikke-ekspert i E-mail programmer
I går 18:06 Nedtælling Af prinsib i Excel


Premium
Nets risikerer at skulle betale bod efter stor forsinkelse af MitID Erhverv: Forhandler med Digitaliseringsstyrelsen
Kontrakten mellem Digitaliseringsstyrelsen og Nets rummer mulighed for, at Nets kan blive ramt af en bod på grund af forsinkelsen af MitID Erhverv.
Computerworld
Stein Bagger gør comeback i ny branche: "De lignede et mafiahold, førte sig frem som nyrige og plaprede løs om urealistiske drømme"
Stein Bagger har skiftet navn og fører sig nu frem i store biler i en helt ny branche, skriver en dansk avis.
CIO
Podcast: Her er seks gode råd om ledelse og digitalisering fra danske top-CIO'er
The Digital Edge: Vi har talt med 17 af Danmarks dygtigste digitale ledere - og samlet deres seks bedste råd om digitalisering og ledelse. Få alle rådene på 26 minutter i denne episode af podcasten The Digital Edge.
Job & Karriere
Se Waoos forklaring: Derfor har selskabet fyret topchef Jørgen Stensgaard med omgående virkning
Waaos bestyrelse opsiger fiberselskabets topchef, Jørgen Stensgaard, der fratræder med omgående virkning. Se hele forklaringen fra Waao her.
White paper
Sådan kan du arbejde effektivt uanset tid, sted og type af enhed
Hvad nu hvis dit arbejde, din information, dine processer og teknologien bag ved, var organiseret på en måde så det passede til din organisation – alt sammen guidet af en intelligent udgave af det digitale arbejdsrum? Det er visionen bag Atea og Citrix´s samarbejde med digital workspace – en smartere og mere effektiv måde at arbejde på. I dette whitetpaper kan du derfor læse om, hvordan du kan skabe et mere effektivt og brugervenligt arbejdsrum uanset tid, sted og enhed. En løsning der på en gang er både enkel og som sætter brugeren i centrum.