Load a video from an external resource in my web hosting - html

I have a simple web page written in HTML for testing video streaming.
<video controls name="media">
<source src="external_url.mp4" type="video/mp4">
</video>
That's work in local, but when I upload the page on my free web hosting, the page doesn't load any video. Is there a workaround? Maybe using an embedded player?
update
I've discovered that's a problem related to video. Unfortunately I cannot link it because it's for a private presentation, but I've tried with other videos and that works well. Any idea why my video doesn't play?

Please check that the URL is intact.
Check if there might be some file discrepancies. The control currently supports mp4, ogg, and webm as seen here.
Use the canPlayType() method to test the site AFTER the upload - just to be sure we're covered on that front. See here for the DOM reference.
You can fiddle around here if you don't want to have to upload the site first before live-testing it.
Hope that helps.

How do you upload the video? If FTP, text transfer mode may have ruined the file. The hosting (especially, a free one) can impose a limit on the file size (uploaded or served) too. Or even on content types (e.g. narod.ru didn't allow to read files directly, serving a "download page" on an attempt instead).
Try to download the video file directly and compare it with the reference one.

Related

My video is not playing in both Brave browser nor Firefox

I am new to HTML and CSS (So that may be the issue). I entered the following code into my html doc:
<video controls width="700">
<source src="video/PristineCustomCleansVideo.mp4" type="video/mp4">
</video>
The video I want to play is inside a folder called video. The index.html and the video folder are nested inside a folder together.
The video shows up on the site I'm making as a gray rectangle with controls (in a Brave browser). When I press play nothing happens. I also tried opening my page in Firefox and within the gray rectangle it says "No video with supported format and MIME type found."
I looked up this question and have found so many confusing suggestions. Whatever you recommend, please do it as if I know very little about computers (I thought I knew a good amount until reading some of the responses and can't follow what I should do. lol)
Another issue I am considering is if I have to do a lot of work to get the video to play, will others that I send my website URL to have issues as well? This is for a class project. I have to put everything on the school's server and share the URL with the teacher.
If your index page and the video are located in exactly the same place you do not need the video folder in the path to your file. The following should work.
source src="PristineCustomCleansVideo.mp4" type="video/mp4"

Can I link audio thats not local into my html file?

My hosting doesn't allow me to upload mp3 or any audio files, so is there any way I can link audio in some other way? I know we can embed soundcloud and stuff but just wondering if there was any other alternative.
I’ve found this very useful guide that covers some alternatives:
Linking to a sound file using a href allows a browser to open and play
an audio file if the viewer of your web page has properly configured
their Internet browser. You can also use the tag or the newer
tag to insert a sound file directly into a web page.
<a href> tag
<a href="https://www.computerhope.com/jargon/m/example.mp3">Play sound
file</a>
<audio> tag
The tag can create a media player as part of the web page. It allows the visitor to play, stop, pause, or download an audio file. The element is compatible with all modern web browsers.
<audio controls>
<source src="https://www.computerhope.com/jargon/m/example.mp3" />
</audio>
<embed> tag
An older method of including audio files is to use the tag. While this method certainly works, it is less efficient than those which were mentioned above. As such, we recommend using one of the solutions demonstrated above.
<embed src="https://www.computerhope.com/jargon/m/example.mp3">
I figured the best way to do it without uploading your audio/music, BASE64 ENCODING!!
Very easy, kinda messy and supposed to be used for images I guess but works fine with audios and should work with videos as well (haven't tried videos)
Here a base64 encoder: https://omatsuri.app/b64-encoding
WARNING THOUGH! IT MIGHT GET LAGGY & MESSY

Preventing downloading file from a webpage

I have a webpage with an audio player - normally the code would look like this
<audio controls="controls" preload="auto">
<source src="http://the_full_path/file_name.mp3" type="audio/mpeg" />
Your browser does not support the audio element.
</audio>
I want people to be able to listen to the file using the player without being able to download the file its playing. These are the first steps I took:
was adding controlsList="nodownload" to the player
disabling right click oncontextmenu="return false"
The problem: from any browser going to menu 'view-> page source' or clicking F12/Cmd+u will show the code thus the link will be reviled.
How can I achieve my desired outcome?
'and obviously there is a way to do it'
No there's not !
#zero298 answer is perfectly right(any resaerch you will do will said the same and you see your question is commonly asked for years with same answer.
All stuff you can do can easily be override because in order to use a file client side the file is download on client(cache) in order to be use by browser in local place.
Look to how WWW work and you'll understand better i think:
web server send(upload) HTML and others files related to client who get it(download) for use.
That's root of a network and can't be otherwise. If you need anything to be shared on a network you've to send it. So you can see/use(an get) a file who is not shared nor block a file once it is send.

Upload video and use its URL

I have a short video that I want to upload and use in the following code:
<video>
<source src="video_url.mp4">
</video>
It's very simple but my problem is: I have no own file server. That's why I have to find a file-hosting provider where I can upload my video and use it from there.
But all they give me is just a download link for the video which is not what I need. What I need is a video-URL that directly plays the video.
For example like this one: http://clips.vorwaerts-gmbh.de/VfE_html5.mp4
I have actually found a site that does what I need. This is the site: https://pomf.se
But unfortunately, that site is not available anymore.
Can anyone help me? How or where can I upload my video to get the required link-format? (I have the same problem with audio files)
Could you use YouTube? You can create unlisted videos so they don't show up to the general public (they aren't public though). Other options could be Dropbox or S3 for inexpensive ways to host the videos yourself. Fact is, its storage space.. and that isn't free.

User uploaded videos. How to view them?

I am making a kind of a social network. I am now in this part where I allow users to upload their videos and allow others to watch them. I have been researching on the HTML 5 video tag. People say that it would be better to give multiple sources for a video with three different formats namely ogg, mp4 and webm for different browser compability. But the user may upload any kind of video. It may be an avi or an flv or whatever. I am sure that there is a possible work-around. I know that facebook and youtube use flash. But I have exactly no idea on how to get started with flash on HTML. Is there any way around or any guide for flash ? Please Help me out.
I know that facebook and youtube use flash.
They do, but not as a work around for limited browser support for arbitrary uploaded videos.
They transcode the videos (you could do this with ffmpeg) on a server into all the formats that they support.
I'd suggest using an existing Flash video player, such as JWPlayer or FlowPlayer.
Their integration is very easy, as you'll just have to include some JavaScript and CSS files in your HTML page header. Then for every video you want to display you're putting a small HTML snippet at the position where you want to show the player.
This is the default snippet for FlowPlayer:
<div class="flowplayer">
<video>
<source type="video/mp4" src="/path/to/intro.mp4">
</video>
</div>