<video width="500" height="500" controls="contrlos">
<source src="hope.mp4" type="video/mp4">
</video>
this is the code I tried on vscode, the video file is stored in my drive c, but I don't know why when I run it, it doesn't work, and I cannot play the video. by the way I open it in Chrome. and when I google a video and copy the link address in src="" the same problem repeat. does the audio and video files we want to put in html need to be stored in a special place in my computer?? plz help me! I'm beginner.
There are 2 solutions of this problem:
Keep the video file in same folder where you have stored your html file or
Wrrite the full path of the video file where you have stored.
Related
I am using audio tag in my html code for playing the audio in my webpage ,i have one doubt without passing directly audio to the audio tag i want to use google drive link(link contains one audio).please help me to acheive this ...
<audio controls autoplay>
<source src="https://drive.google.com/file/d/11wfYWiukbIZJQnDL385jQs2SGQA5ESbL/view?usp=drivesdk"></audio>
What you are doing is correct only one problem you cant use the google drive link directly.
1.You should go to google drive and choose share file you will get something like the following link: https://drive.google.com/file/d/11wfYWiukbIZJQnDL385jQs2SGQA5ESbL/view?usp=sharing
Extract the id from URL 11wfYWiukbIZJQnDL385jQs2SGQA5ESbL
URL for playing the audio file https://docs.google.com/uc?export=download&id=11wfYWiukbIZJQnDL385jQs2SGQA5ESbL
URL for downloading the audio file https://drive.google.com/uc?authuser=0&id=11wfYWiukbIZJQnDL385jQs2SGQA5ESbL&export=download
your final code will be something like the following:
for playing:
<audio controls autoplay>
<source src="https://docs.google.com/uc?export=download&id=11wfYWiukbIZJQnDL385jQs2SGQA5ESbL">
</audio>
for downloading:
<a href="https://drive.google.com/uc?authuser=0&id=11wfYWiukbIZJQnDL385jQs2SGQA5ESbL&export=download"/>Download</a>
note: The auto play will not work on iPhone devices if saving power is enabled which is by default
Super green on some of this stuff so I apologize in advance.
I want host video files on my website and have them play in the browser. Currently, when going to the hosted file it just downloads the .mp4. Is there a way to set up a folder of videos to play the video in the browser automatically instead of downloading? I'm trying to avoid having to maintain html and embedding videos. I'd rather just send a url to the specific video and the end user only play that video in the browser.
I have the files hosted on Domain.com. Ideally, I would send a subscriber a link like "www.website.com/videofolder/video_name.mp4" and that video would just play in the browser. Is there a way to do this without making separate html files for each video?
You will have to send an html wrap with the link, this:
<video width="320" height="240" controls>
<source src="url/to/movie.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
Otherwise you'll just be sending a file stream, hence the download you're seeing.
I will also recommend you to explain:
How you're providing the file to the browser (Hosting),
Are you using NodeJS, Flask, Django, NGINX, AWS S3, etc.
So other contributors have more idea of how to help you out.
I want to make an on the go web server with a bunch of videos. I am using the Raspberry Pi to code this. I will download youtube videos and put them in a folder. How do you put a folder of videos into an html website?
You need to put them into a folder located on your web server. If its locally hosted, i.e, your html files are on the same system as your videos, you should have your file structure looking something like this:
--[FOLDER] - Videos
| -- [FILE] - yourvideo.mp4
-[FILE] - index.html
So your video will be located in /videos/yourvideo.mp4.
You can then call your video in the index.html file. If using HTML5, you can use <video></video>:
<video width="320" height="240" controls>
<source src="/videos/yourvideo.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
https://www.w3schools.com/html/html5_video.asp
Name the .html INDEX.html and make a folder called INDEX.html_files
that should work put the videos in the folder then type /INDEX.html_files/videoname.mp4 as the file name
I'm trying to create a movie player on my localhost but I have an issue, when I try to play a movie (.mp4) file it seems like my video is not loaded (movie size is 2.4gb) but when I try with another .mp4 file with less size (60mb) works perfectly! I'm using video html tag and I tried with videojs but I have the same issue.
This is a short example of what I'm using:
<video id="my-video" class="video-js" controls preload="auto" width="640" height="264"
poster="Images/Image1.jpg" data-setup="{}">
<source src="RootFolder/Pelicula2.mp4" type='video/mp4'>
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
supports HTML5 video
</p>
</video>
What could be the problem and what can I do to solve it? Maybe its a problem with my source src? Should I try it with another format?
UPDATE:
I change my Files folder to my desktop and now this is my code:
<video controls>
<source src="C:\Users\franc\Desktop\Movies\Pelicula2.mp4" />
</video>
With this I get the following error message Not allowed to load local resource: file:///C:/Users/franc/Desktop/Movies/Pelicula2.mp4 but when I click on that hyperlink it opens another window and the video is displayed properly.
using
C:\Users\franc\Desktop\Movies\Pelicula2.mp4
is allowing the browser to access content from the user local system which is not allowed to do directly in the browser you can host your video on any blob like amazon s3 or Microsoft azure or if you have to put that folder in your c:\ directory you will need to create a simple server that serves this file to the client maybe you can look into Node.js it will be your easiest solution specially if you have experience working with JavaScript
Edit :
After doing some research i found that you can disable this security feature in your browser manually just type the following in the Terminal
> "C:\PathTo\Chrome.exe" --allow-file-access-from-files
Make sure you replace PathTo with the current path of chrome on your system
source : http://www.chrome-allow-file-access-from-file.com/
I'm trying to play a MP4 video using video tag, but nothing is displayed. When I have my video in the same project directory the video plays, but I need to have the video in another directory. This is my code:
<div id= "show">
<video width="320" height="240" src="file:///F:/test.mp4" type="video/mp4" controls>
</video>
</div>
The problem is the path, so, what is the correct way to declare file's path?
Go to the mp4 when it's in the other directory and right click on the properties. copy the file path and then paste it in (and precede it by file://). make sure you turn the slashes to turn forward in the file path.
it should look something like this
file:///F:/Users/yourname/folder/subfolder/test.mp4