I have my web application which has many audio files. I have kept these files on my Nginx server.
On my HTML page, I am using audio tag.
My question is when my HTML page loads on the web browser then do all the audio files will get downloaded at the same time? Or when the user plays particular audio file, then only that audio get streamed and downloaded.
Since my page has many audio files, so I need only that audio gets streamed/downloaded to the user which he plays.
A given media file will only get downloaded after you have clicked on a link
You can confirm this yourself by getting onto your page in question then hit F12 or ctrl-shift-i in your browser (firefox/chrome/opera) to open up your developer tools then hit the Network tab which will display network traffic ... once there do a page refresh and observe traffic ... next to none since no media files have been requested
Now click on a media link to request a download and only then will you see significant network traffic as the media packets come tumbling into the browser
By default above setup will just download the mp3 not stream ... to stream an mp3 file create on server side a text file called mysong.m3u which contains URL of actual mp3 file
http:///sorabhdomain.com/mymedia/mysong.mp3
then have the browser link use the m3u URL not the mp3 URL and the browser should now stream not download
Related
I want to find out where in a webpage's source code does a sound effect play. That'd allow me to better understand the code and obtain the audio file as well. I searched in the "Sources" and "Network" tabs of the Chrome Inspector, but there are no audio files there. The sound is probably fetched by an AJAX request or generated using the HTML5 Web Audio API. How do I set a breakpoint in the Chrome Debugger to pause when a sound plays?
As suggested in Abarnett's comment:
Use a browser add-on/extension/plug-in such as Chrome Audio Capture to record internal sounds in the browser.
I am recording MP3 using phonegap in an app. Storing the MP3 in a database Base64 Encoded. I can retrieve those records, save them to an MP3 file on phone or computer and play them. Media in phonegap works as well as the local players. What does not work is either
1) playing them directly as base64 on a windows computer in a browser or
2) saving to an MP3 file on the server and playing through the browser.
I gave up and switched to a download button, which works, by storing the MP3 file locally and playing it using the local audio player.
the HTML format I used is
for the file the source was the file path relative to the web root
For the base64 it was "data:audio/mpeg;base64,..."
In all cases it did not work, and the controls were either grayed out or had an error on them.
The solution that works for browser, android, and ios is to use m4a format. In cordova phonegap I used cordova-media-with-compression
Im trying to make video files playable from web browser. I upload the files in different repositories but when I click the videoFile it starts to download instead of be played.
This is my resource, when I put this url on the browser the video starts to download.
https://s3-us-west-2.amazonaws.com/awsampledatabucket/Media/SampleVideo.mp4
What I want is that when I put the url the video starts playing like this:
https://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4
Anybody know how to do it?
I have an Apache server with a webpage written in HTML5 that has a video tag to play video from a webcam. I use VLC to stream the video over HTTP in OGG. My problem is that I can play the video in a browser from the computer where the server is allocated, but from another computer the video window is blank.
I have done some tests to try to solve my problem:
if I put a video file in htdocs and the corresponding line in the html file, the video is played.
If the stream is a video file instead of video from the webcam, there is the same problem.
With VLC option Open Network Stream the video is played successfully from another computer.
When I have the blank window problem, with wireshark I don't see the stream being downloaded.
This is how I use the video tag:
<video id = "myVideo" src="http://localhost:8081/stream.ogg" type="video/ogg; codecs=theora" autoplay="autoplay"></video>
I would appreciate any suggestion, thank you in advance!
Kiko
http://localhost
Localhost will always point to your local computer. So if you run the application on the server the video file will actually resides on, it will find the file.
But if you are running the script on another computer, this computer will actually look locally, where the video file does not resides.
Try replacing http://localhost with the external IP-adres of your server.
I have a VIDEO tag loaded with a "src" attribute set to a particular filepath to a video asset. I have an array that stores some number of other filepaths to different video assets. I have a button that, when clicked, instructs the VIDEO tag to load one of the filepaths in the array.
If the VIDEO tag loads an asset that it has already loaded in the past (during this same page session) does it have to go back out to the network and redownload that asset as if it never downloaded it before or will it realize that it has cached this file and just pull the data from the cache?
You should be able to use HTML5's caching manifest to instruct the browser to load from cache. Read more about it here:
http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html#manifests
Basically, you specify:
<html manifest="manifest.cache">
and then define what resources are cached in a manifest.cache file:
CACHE:
path/to/your/video/file