I am but a meager systems guy and this seems to be a programmer's domain so be gentle. This is my first post on this site.
I work at a high school and for our presentation software for announcements and such we use XSplit. This is similar to OBS and allows us to use a green screen. To share it with the rest of the users on the network, XSplit has a built in webserver which lets users visit a persistent URL and view the the live stream in Flash.
Since Flash is now slowly being shunned by Chrome and will likely go that way with all browsers, the logical next step for anything using Flash seems to be to get to HTML5.
So here I am, trying to get from Point A (OBS/XSplit/presentation software), to Point B (HTML5 code on a website doing .
OBS and XSplit can be output to existing streaming services like Twitch, YouTube, etc. but these lack certain privacy requirements, or persistent url requirements we have. Alternatively you can output to RTMP, but this of course cannot be fed directly into HTML5.
I believe I have to get my RTMP stream somehow converted into something else before I can plug it into HTML5, but not sure what the best thing to use is, and how much coding I would have to do, as I am not a coder.
There is another thread on this, but doesn't have a whole lot of info for dummies like me. Has anyone here successfully accomplished what I'm describing? Or know of a tutorial for this adventure?
Thanks
This will be difficult to do without a coding background, or budget to use a commercial product. What you need to do however is set up and nginx server with the rtmp module, use that to convert rtmp to dash, then use something like dash.js, to build a web player. There are may places online that describe how to do this.
Alright, well, I figured it out. It's probably not the cleanest way to do it, but it's a 'for dummies' way of doing it without having to get into too much coding/command line. Here it is for anyone who lacks coding skill but would like to accomplish what I was asking about:
First of all follow this guide https://obsproject.com/forum/resources/how-to-set-up-your-own-private-rtmp-server-using-nginx.50/ to get to the point where you have your OBS/XSplit type software viewable as rtmp://yourip in VLC
In VLC, using the Stream feature where you pick your rtmp://yourip as your source, and HTTP as the destination, and Theora + Vorbis (OGG) as your selection for the stream to be transcoded to.
Simply take your new http://yourip:8080 stream and plunk it into a
video width="720" src="http://yourip:8080" autoplay
type="video/ogg; codes=theora" /video" or something similar and you should be able to play it in Chrome, at least. (Dunno how to post that with the < things)
I'm sure there's some optimization to be done but seems to play pretty well.
Again, probably better ways to do it especially if you're dealing with people using different browsers/mobile devices, etc. But for my purposes where I just need to get a bunch of people on a local network using Chrome to view a stream which isn't Flash based, this does the trick.
Related
I am working a website, and I'm trying to prevent the video file to be downloadable.
I've already prevented the right click function, and I've used a webiste called http://htmlobfuscator.com/ that allows the source code to be very difficult to decipher. The only issue I now have remaining is the inspect element feature on browsers. Does anyone know of any way to prevent this? I know that someone is always going to find a way to download or capture a video, but I'm just trying to limit the spread of my videos.
Thanks for your help,
Stephen
There is no actually way of completely stopping someone, you could however as some have mentioned use something like Vimeo or YouTube to minimize the downloading of your videos, or another way you could do it and have found from personal experience is either creating a login/register on your site to make someone signup to get your video thus minimizing how many can download it or you can encrypt the video with a password, i believe Vimeo has this option which requires someone to enter a password in before even viewing the video.
Yet these are just two ways to Minimize not completely stop.
There is no way to stop a browser's document inspector from finding your file's location. However, I am a recording musician, and I know of a few things you can do to make thieving more difficult.
Put your JS video location in an external file. Not a lot of protection here, but worthwhile enough to add.
Break up the video location into a few different JS variables. Your thief would at least need some basic JavaScript knowledge to get to the video location.
Use an obfuscater, like you did. (I LOVE HTMLObfuscator!)
You could use flash video. This is difficult to download, but slower viewing, and also a bit more difficult to create and host on your website.
The best thing to use is streaming video, but not everyone is able to do that either.
Good luck!
I'm working on an HTML5 radio player in Meteorjs. See http://radio.meteor.com/ or http://github.com/guaka/radio-meteor
I want to display the song that's currently playing. How can I do that?
I'm not sure if resorting to server side would be a great idea as the server would have to fetch metadata for a growing number of streams (I want to allow people to add more channels).
Browsers compatibility is not that much of an issue, as long as it will work in Phonegap. I don't care about all browsers (i.e. IE) as long as I can make it fails gracefully.
I think Pulling Track Info From an Audio Stream Using PHP might be an answer than can work for Meteor (server side).
It should be possible via filereader on the client end, browser compatibility would be a bit of trouble.
Have a look at:
http://ericbidelman.tumblr.com/post/8343485440/reading-mp3-id3-tags-in-javascript
Maybe not actual now, but can help somebody else. I use this one package to getting metadata about streaming audio
In the really cool video at http://www.thewildernessdowntown.com/, what exactly is being done here to keep all the videos/activity perfectly synchronized to the audio?
I'm having trouble finding good details on exactly what kinds of syncing are actually possible via HTML5. I would like to synchronize some videos, audio tracks, and HTML overlays together, and I'm wondering what the best approach is for getting a solid timeline that will drop frames, client-side.
I am guessing its in HTML5 and Javascript. In HTML5, you can use what are called "cuepoints" to trigger certain events. Basically, you say something like "at this timestamp in the video, trigger this event". At my place of employment, these cuepoints can be embedded as metadata in the media file, and read as they are decoded. This is a heavy approach, but could be doable if you had the time and the tools.
However, for most web applications, I would suggest using Javascript, specifically the libraries here(cuepoint.js; more for subtitles) or here(popcorn.js). Either might come in handy for your application.
In Regular HTML5, there is a spec for specifying cuepoint data, but that is still in flux and YMMV in different browsers and environments.
I have a custom multi-media player written in silverlight which displays both images and video. As you can guess, lot of people do not have silverlight and want us to use a better tech.
I am keen on HTML5, but then few concerns:
How do i avoid users to download content to their local machines? I just want them to stream from servers when they want to view it.
How do i avoid users to copy paste all the player code, as its just HTML/JS?
Is there a way we can do adaptive streaming in HTML5?
The answers to your concerns are:
You can't
You can't
If you mean like RTMP, there's no support currently
If these are your primary concerns, then HTML5 video is not the solution you are looking for. You may find this mailing list thread interesting, just one of many times the issue has been raised but with some nice long explanations.
Is it possible to make an mp3, that is embedded in a webpage, keep playing from where it left off if the page is reloaded? Perhaps into a cookie or with any other method.
<embed src="track1.mp3"></embed>
For example:
track1.mp3 is embedded in a webpage; it is 3 minutes long. A visitor loads the webpage and listens to the first 1 minute and 25 seconds of the track; then closes the webpage. Can I make track1.mp3 start playing from 1 minute and 25 seconds the next time that person visits the webpage?
I have seen one Flash-based MP3 player providing an approach to do this, with only a minimal disruption when switching between pages, but can't for the life of me find the project with any search term that comes to mind. (The big word was "seamless playback"). Anyway, it was a discontinued project, the last update being sometime in 2006 so it wouldn't probably be much use on the long term.
But nowadays, with every man and their dog having a JavaScript-enabled browser, maybe changing your page's architecture to making it fetch new pages using Ajax is the better approach. It can be made degrade gracefully for non-JS browsers, and would allow for seamless playing without any tricks for JavaScript users (because the page is never reloaded).
See discussion about the pros and cons of the approach here: Why not just using ajax for Page Requests to load the page content?
And some pointers how to get started: JQuery/AJAX: Loading external DIVs using dynamic content
how is it embedded? With just html?...probably not. If you are using Flash, then yes, you could keep track of the bytes, and write to a session or cookie.
You might need to expound on your question a little, ie, what is the process that you are using.
I don't know of anyway to do this other than with Actionscript. I can't think of any Javascript methods that would allow you to access an embedded object like that. My recommendations for this would be to do it with Flash. If you don't have access to it, you can do it with Flex, which the SDK is free to download from Adobe.
HTML5 specifications have some promising new features for handling video and audio. I have not paid that much attention to that portion of it yet. I really don't think you are going to find a quick answer to this one.