I need to play large audio file starting at different parts. But it starts to load completely anyway.
tried to #t=01:00:00, audio.currentTime , set many headers for partial content like "Content-Range"
Is this generally possible or do I need to use third-party libraries like howler js?
Related
I have a very simple site and all the CSS for it is written in one file, so whenever any page is requested the CSS file is loaded. So I was wondering if there is someway, that I can tell the browser to use the same file it loaded a second ago instead of requesting it again.
I assume you have the css loaded externally then? I don't believe there is a way to natively do that unfortunately. But, if you're proficient in javascript, I suppose you could save all of the css file as a string using the localStorage property in the browser. Then request the data you want loaded specifically per site.
Local storage persists after the browser is closed, so it would only need to be loaded once!
I want to display videos stored on Amazon S3, but I don't want to make the video files publicly available. To do this I plan to use pre-signed, temporary link URLs with a standard video element. If there is a better way to play auth-protected videos I would be interested to hear it, but the rest of my question is predicated on this approach.
I can refresh the pre-signed URL when it expires, but I can't change the src attribute without the video element thinking that I am giving it a whole new video to load. Is there a way to change the src but specify that the new URL points to the same video file?
In case it makes a difference, I only need to change the URL's query string.
This question deals with an almost identical problem but the proposed solution (setting the starting offset time of the video before reloading) is unsatisfactory to me. That still requires reloading the video file and the transition is very noticeable.
I am playing with the idea of reading an MP3 file from the hard drive and playing it in the browser. I know one way of doing it - get list of File objects from <input> tag, then get their object URL and assign it to src of <audio>. However there are some drawbacks of this technique (for one, it has to be repeated on every page refresh).
Therefore I am exploring if I can use an NPAPI plugin to read the music file from the HDD and then give it to <audio> element somehow. However, I can't figure out how to convert the binary contents of the tile into a File object that javascript can use. Any suggestions?
The only option I can think of would be to use a data: url. I don't know for sure if these are supported in audio tags or not, but they are definitely supported in img tags.
BTW, you are aware that a NPAPI plugin has to be injected into the page in an object tag before it does anything, right? Make sure you know the difference between an extension and a plugin, because what you're talking about sounds more like an extension problem.
Also take a look at FireBreath; if you do decide to use a NPAPI plugin, that'll simplify your life a lot.
I've been able to play media with a html5 audio element but the duration of the song never displays correctly, and when it plays the progress bar just fills up, although it does play fine. This is what I've been doing. I'm using ogg vorbis files.
Started with jPlayer, had this problem.
Heard the problem might be related to my Jetty server so I switched to Tomcat, but I still had this problem.
Tried using the plain html5 audio element and the problem persisted.
Put a video in my page with an html5 element, and that had the correct duration.
I imported all my audio from CDs using the same program, so although I can see the duration any number of other ways I thought I might try files from some place else. So far every file I try has the problem.
I've been hearing about an Accept-Ranges header but I don't know how to see if I'm using that header, how I would make sure to use the header, or when I would use the header(do I send it with the html page, do I send with with the audio itself? Can I add a header to a file?)
I'm very new to web programming and figuring out the ropes have been tough. In the end I just added the "Accept-Ranges" : "bytes" to every response my server returned. I thought I would have to be careful what responses I added headers to but this is working out. In clojure with compojure which is the language and framework I'm working in I just use a middleware that adds "Accept-Ranges" : "bytes" to the response map under :headers and it looks like there is a setHeaders function in the response object in Java.
I would like to know whether it a possible to detect whether a HTML page contains a video.
I know that one possible way is to look for ".swf" in the HTML source code. But most of the pages do not contain the file name.
For example, given following URL and possibly its source code, is it possible to find out whether it contains a video:
http://www.cnn.com/video/
There are many ways to embed Video into a HTML page - as Flash Video or instances of Platform-Specific players through <object> and <embed> tags (but not every one of those tags is a video! The same holds true for .swf - it's just the file extension of Flash files, Video or not), the new HTML 5 <video> tag... They are not impossible to find out but it's a lot of work to catch all possible player types, formats and embed codes, and will result in a lot of false positives / negatives.
Then, there are JavaScript libraries that initialize players after the containing page has loaded - those are almost impossible to detect.
It's still a very complex issue to get video into a web page reliably, and subsequently, it's even more complex to find it out. Depending on what you are trying to achieve, I would consider dropping it.
For your case (CNN site) you can parse Open Graph micro-markup for a video information.
Meta tags such as og:video:type, og:image will help you.
Video hosting services usually support micro-markup, e.g. open graph or scheme.org.
So you can parse these markups.
Check if an <object> tag exists in the DOM and check its content type and parameters. You will find the pattern by yourself.
You can also search for .flv, or .mp4 in the source code.