Video and Audio automatically starts downloading in html5 - javascript

I am new to web programming. I have a question. why do the audio and videos from the background start downloading automatically(download dialog pops up from IDM) when my index.html page opens? I am using Aframe's videosphere in the background.
<video id="video2" loop="true" autoplay src="/vid/waterfall.mp4"></video>
<a-videosphere id="video-360" src="#video2"></a-videosphere>
Thank you.

This May Help You. preload='none' prevent pre download
<video preload='none'
id="video2"
loop="true"
autoplay src="/vid/waterfall.mp4">
</video>
<a-videosphere
id="video-360" src="#video2">
For Audio
<audio preload="none">
<source src="audio.mp3" type="audio/mpeg" />
Audio Type
</audio>

Related

video tag only playing audio of local .MOV files AirDropped from iPhone

My code roughly looks like <video src={URL.createObjectURL(videoFile)} /> where videoFile is a local file from a file input. I have .mov files created from a Quicktime screen recording and the video tag will play the video and audio part of the file, but when I AirDrop a video recording from my iPhone (.MOV file) and try to play them, only the audio plays and the video tag is a black screen. There's something about iPhone video recordings that makes the video tag not play the video and only the audio.
<video width="320" height="240" controls>
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
<source src="video.ogv" type="video/ogg">
<source src="video.ogv" type="video/mov">
</video>
here width and height depends on your requirements

download video of type mp4 without url ending in mp4

I am a newbie at web development, my question is, as I understand this code below, it will open the Chrome Video Player, which also has a download button which can download the video.
How can I get the real url for the video which end in an extension of mp4?
<video loop muted playsinline autoplay="autoplay" preload width="640" height="360">
<source src="https://r4---sn-nv47lney.googlevideo.com/videoplayback?lmt=1517456704789231&key=cms1&dur=386.240&ipbits=0&requiressl=yes&mime=video%2Fmp4&source=youtube&pl=20&itag=18&ei=hudyXP-4OIXlwQHBsaOwAw&gir=yes&expire=1551055847&ratebypass=yes&c=WEB&fvip=4&id=o-AHZWBPA4mUtFjI305r97oXdDZELtWbNS5dJeuwGAqirn&clen=23249888&ip=2600%3A3c00%3A%3Af03c%3A91ff%3Afe52%3Af0d3&sparams=clen,dur,ei,expire,gir,id,ip,ipbits,ipbypass,itag,lmt,mime,mip,mm,mn,ms,mv,pl,ratebypass,requiressl,source&signature=41173E731E2CFF1D3BB61936B8A78716C9515442.358D2657A715DA85E175DB497BC6D211489DA79E&title=Very+Powerful+Motivational+Video+For+Medical+Students.+Goosebumps+Guaranteed!!!&redirect_counter=1&rm=sn-q4fels76&req_id=4c1bf6c1b1eb36e2&cms_redirect=yes&ipbypass=yes&mip=192.123.1.4&mm=31&mn=sn-nv47lney&ms=au&mt=1551034152&mv=m#t=0.9" type="video/mp4" />
</video>

Disable second audio player when the other is playing in chrome

I have two audio files on the page and I would want the user to listen to just one audio at once while disabling the other. I think some kind of javascript needs to be inserted.
<audio controls="" controlsList="nodownload">
<source src="audio/audio1.mp3"
type="audio/mpeg">
Your browser does not support the
audio element. </audio>
<audio controls="" controlsList="nodownload">
<source src="audio/audio2.mp3"
type="audio/mpeg">
Your browser does not support the
audio element. </audio>
Thanks in advance

Autoplay video on mobile device

I've seen posts complaining that you cannot autoplay a video on mobile device.
But, this CAN be done. I've visited youtube website on android and iOS and video does indeed start to play without any user interaction. How can I mimic this behaviour?
EDIT: if you visit direct link, it does not work. If you first visit youtube.com and than click on some video, it works. No idea why.
<video id="mobilevideo" name="Mobile video" onLoad="play()" onClick="play()" preload="auto" autoplay preload muted playsinline webkit-playsinline>
<source src="file.webm" type="video/webm">
<source src="file.ogg" type="video/ogg">
<source src="file.mp4" type="video/mp4">
Your browser does not support this file type.
</video>
<!--Javascript autoplay video -->
<script>
document.getElementById('mobilevideo').play();
</script>
You can use autoplay in video tag. like this:
<video width="320" height="240" controls autoplay>
For more information, you can learn from here:
https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_video_autoplay
For mobile, you should not do auto play because it will cost user's bandwidth(money). See this post for more detail:
Can you autoplay HTML5 videos on the iPad?

Display Video in html5 web

I need to play a video in my web page. I used following code for test it. Result display player but won't play the video. I used updated chrome as my web browser.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<video controls=controls>
<source src = "q.mp4" type="video/mp4"/>
</video>
</body>
</html>
Note- my video and the web page is contain in same folder.
I change the source as following
<video width="400" height="300" controls>
<source src="video.m4v" type="video/mp4">
<source src="video.webm" type="video/webm" />
<source src="video.ogg" type="video/ogg" />
</video>
Now webm file plays in my waterfox browser but same result on chrome and IE
Try providing appropriate codecs for all the video files. Like this:
<video width="400" height="360" controls>
<source src="video.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
<source src="video.webm" type='video/webm; codecs="vp8, vorbis"'>
<source src="video.ogv" type='video/ogg; codecs="theora, vorbis"'>
Your browser does not support the video tag.
</video>
There are two ways you can do this
use a J query Plugin Like video.js or go with HTML5
here's the link
Playing video is tricky, you can try this
<video width="400" height="300" controls>
<source src="q.mp4" type="video/mp4">
<object data="q.mp4" width="400" height="300">
</object>
</video>
The encoding of your mp4 file might not be supported by chrome
chrome could play html5 mp4 video but html5test said chrome did not support mp4 video codec
If above doesn't work you can try flowplayer It will try to play the video with html5 first then fall back to flash player.

Categories