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.
Related
I'm looking for best solution to throttle image download in SPA application.
Problem:
On slow network, when entering details page there's a lot of image downloads happening that are maxing-out browser connections, which breaks(makes unresponsive) UI that requires connections to do AJAX request on button clicks.
I'm looking for some HTTP/browser API to throttle image downloads at given time. Do you know is something like this exists?
Other approach I would like to have is ability to kill all GET request on button click (that could also solve this issue).
I cannot find such APIs. Maybe inserting these images as 'prefetch' could be good idea?
Or I have to "lazy" load these images as <img data-src="url"> and then put them to custom fetcher that does up to 3 request at the time?
EDIT: found some related issues:
javascript: cancel all kinds of requests
How do I abort image <img> load requests without using window.stop()
Best is using a Lazy loading Module/Library of your SPA Framework . For example this library for React seems to be widely used: https://github.com/twobin/react-lazyload. I would defenitely use this approach.
Build an lazy image loader yourself. Insert a placeholder image (or low quality image) that you then replace with the final image.
Yes. Parallel downloads per Domain are limited. But you can create a second Domain (=Subdomain) where you host your images so this can effectively increase the amount of parallel downloads. (But of course not the total bandwith).
Preloading: Just as a note: If you have a large app with lots of navigations paths/screens, it might be a waste of ressources if you download images of pages (or section of the page) the user then will not visit... I would not rather do this, as mobile traffic is quite costly!
Have a look at the "importance" Attribute of an img Tag: importance
Indicates the relative download importance of the resource. Maybe this helps? But never used this before...
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img
importance
Indicates the relative download importance of the resource. Priority hints allow the values:
auto: no preference. The browser may use its own heuristics to prioritize the image.
high: the image is of high priority.
low: the image is of low priority.
I know this question is simple and kind of silly but I really need to get an answer. I am doing some kind of family videos put together and I want that to be on one page or like an HTML file. but when I embed/link a directory file of video to the html it will play on the browser. Is there any way that when I embed a link it will just ask what application to open and will open on that video player that I selected? I'm not really that techie but I really need to make an offline HTML to organize my stuff. thank you so much in advance.
is there any way that when i embed a link it will just ask what application to open and will open on that videoplayer that i selected
Not all browsers do this, but many will. One way to look at this is that the browser in this case is the desired application for viewing that video. (Often times, the user didn't make this choice of course, it was made for them.)
There are a couple ways around this. One way is to add the download attribute to your anchor element:
<a href="video.webm" download>Download the video</a
This will suggest to the browser that the video should be saved to local disk, and not just immediately opened.
A second method is to use an M3U file. All you need in your file is something like this:
#EXTM3U
https://example.com/video.webm
These tend to open up in the default player. Just keep in mind that not everyone has such a player installed.
You have to make your video files downloadable by creating a download link to it. This will give the option of either open in browser or save to local disk.
I have some copyrighted audio files that I would like to protect from download, but show them on the website(drupal).
I have a player that works with flash and css on a link, but if you view the page source the href of the link is visible, and it is very easy to get the URL and get the files locally.
I understand that it's not possible to prevent it 100%, but what I would like to do is just to make it more difficult than seeing the url in the page source.
How can I do it?
I would like to avoid to write myself a player, because my flash knowledge is quite limited...
I'm already hidding with Javascript the link while hoovering with the mouse of the player(which is acctually a link in terms of HTML).
I've tried an HTML obfuscator(http://htmlobfuscator.com), but it does not work properly, for one link it works, for the second and third one it doesn't...
Many thanks
Ultimately, any file which is simply embedded has to be downloaded to the user's computer in order to be played (usually it is downloaded to a temporary location then removed, but a savvy user will be able to capture the download and save it.
If you want any real protection, you'll have to use a streaming server like Helix Streaming Server. With these, the file is not downloaded by default and the user's only real capture option is an audio cable from LineOut to LineIn. Most don't have access to this.
I know that I can use embed parameters such as &start=10, but I would like to know if there is an option that could load the iframe showing a different time in the video for image purpose, and possibly still start at the beginning.
YouTube doesn't allow you to set custom frames as stills - I think it gives you some options to choose from when you upload your video, see more info here: http://www.squidoo.com/youtubeframe
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.