I have a business web app which is served using SSL only. One of the pages has a video served from screencast.com. Screencast.com doesn't seem to support SSL and the video is streamed using http and therefore I get a mixed content IE warning.
The video is showing using a lightbox type window using an iFrame.
Are there any workarounds or solutions to avoid the warning? Other than serving the page without SSL.
I might have to switch from screencast.com. Any video streaming hosts which support streaming over SSL and support iPads?
You could serve the video yourself but I am not sure that this worth the trouble.
One option would be to use http://sproutvideo.com/features - they can serve via SSL and support among other things iPad etc. (not affiliated, not even a customer)
Instead of using a Lightbox where the html is on the same page, I opted to launch another browser window and made it look like a lightbox popup as much as possible.
Related
I'm trying to figure out if web based audio streaming sites use the Web Audio API for playback or if they rely on the audio element or something else.
Since the user of an audio streaming service typically doesn't need more functionality than starting and stopping the audio, then I guess that the audio element is enough. If a VU-meter is required then I would guess the Web Audio API would be used since it has an built in analyser node. But since IE doesn't support the API then I suppose you'd rather use the audio element and reach the IE users than using fancy extras such as an VU-meter.
I've been looking at the source code for Spotifys web player, Grooveshark, BBC radio and the Polish public radio but I find neither audio elements or use of the Web Audio API. I did find that the Swedish public radio (sr.se) makes use of the audio element though.
I'm not asking for anyone to go through the JavaScript source code for me, but rather if someone who is familiar with the subject could point me in the right direction.
I don't know of any internet radio services playing back their streams with the Web Audio API currently, but I wouldn't be surprised to find one. I've been working on one myself using Audiocog's excellent Aurora.js library, which enables codecs in-browser that wouldn't normally be available, by decoding the audio with JavaScript. However, for compatibility reasons as you have pointed out, this would be considered a bit experimental today.
Most internet radio stations use progressive HTTP streaming (SHOUTcast/Icecast style) which can be played back within an <audio> element or Flash. This works well but can be hard to get right, especially if you use SHOUTcast servers as they are not quite 100% compatible with HTTP, hurting browser support in some versions of Firefox and a lot of mobile browsers. I ended up writing my own server called AudioPump Server to get better browser and mobile browser support with HTTP progressive.
Depending on your Flash code and ActionScript version available, you might also have to deal with memory leaks in creative ways, since by default Flash will keep all of your stream data in memory indefinitely as it was never built to stream over HTTP. Many use RTMP with Flash (with Wowza or similar on the server), which Flash was built to stream with to get around this problem.
iOS supports HLS which is basically a collection of static files served by an HTTP server. The encoder writes a chunk of the stream to each file as the encoding occurs, and the client just downloads them and plays them back seamlessly. The benefit here is that the client can choose a bitrate to stream and, raising quality up and down as network conditions change. This also means that you can completely switch networks (say from WiFi to 3G) and still maintain the stream since chunks are downloaded independently and statelessly. Android "supports" HLS, but it is buggy. Safari is the only browser currently supporting HLS.
Compatibility detection is not something you need to solve yourself. There are many players, such as jPlayer and JW Player which wrangle HTML5 audio support detection, codec support detection, and provide a common API between playback for HTML5 audio and Flash. They also provide an optional UI if you want to get up and running quickly.
Finally, most stations do offer a link to allow you to play the stream in your own media player. This is done by linking to a playlist file (usually M3U or PLS) which is downloaded and often immediately opened (as configured by the user and their browser). The player software loads this playlist and then connects directly to the streaming server to begin playback. On Android, you simply link to the stream URL. It will detect the Content-Type response header, disconnect, and open its configured media player for playback. These days you have to hunt to find these direct links, but they are out there.
If you ever want to know what a station is using without digging around in their compiled and minified source code, simply use a tool like Fiddler or Wireshark and watch the traffic. You will find that it is very straightforward under the hood.
We use Web Audio for streaming via Aurora.js using a protocol very similar to HTTP Live Streaming. We did this because we wanted the same streaming backend to serve iPhone, Android and the web.
It was all a very long and painful process that took over 6 months of effort, but now that its all finished, its all good.
Have a look at http://radioflote.com and feel free to shoot questions or clarifications regarding anything. Go ahead and disassemble the code if you want to. Not a problem.
I am trying to make a site available offline in a web browser (specifically: Mobile Safari and/or Google Chrome), using a manifest file to load the offline content into the application cache.
This works just fine for images, html content and even font files. But not so for the videos I am trying to store. Mobile Safari is asking to increase storage to 50MB (just as it should) to accomodate the videos, but when going offline the videos are not displayed. All in all the cached content amounts to 37MB.
I am using JWPlayer to show the videos (setting the HTML5 player version as the preferred player), but I have also tried the HTML5 video tag on its own to no avail. The JWPlayer is returning the "Could not load video file" message, just as if the URL was invalid, when going offline (but they work fine online). The videos are H264 encoded in MP4 containers.
Is Mobile Safari on iPad at all capable of storing and retrieving MP4 (or other video) files? Is there any special trick that needs to be employed?
The problem is that Safari itself doesn't play the videos. They're played by the QuickTime plugin, which ignores the browser's caches. See this article.
I don't know of any workaround (other than PhoneGap etc.), but I would certainly love to have one!
You could not use the JWplayer in offline (at least with your current version). In their script (swf), it is fetching some external script from their server (include their logo) such as
http://p.jwpcdn.com/ ... /jwpsrv_frq.js
http://p.jwpcdn.com/...../jwpsrv.js
http://p.jwpcdn.com/...../logo.png (JwPlayer text)
I think it's all about their authorization and license checking. It would take you an amount to get away that logo for the paid version, they may ask your domain and they will add it into their list of the customer's valid website domain, and they also give you a script in the static link and you can add it into your cache file.
I would like to clarify certain things with what I found and raise certain questions with things that I dont know,
Capturing cam/mic through browser could be done through getusermedia();
Is there anything for i devices? because getusermedia() doesn't seem to work in i devices
How could I trap actual audio from web browser application (eg. if I play an audio file and forward it 2mins, I would like to capture the actual audio stream from the html5 player so that I hold the actual audio data)
You need to use Flash, if you are not going to support mobile devices. One best solution is to use wami-recorder.
From their website:
The Problem
As of this writing, most browsers still do not support WebRTC's getUserMedia(), which promises to give web developers microphone access via Javascript. This project achieves the next best thing for browsers that support Flash. Using the WAMI recorder, you can collect audio on your server without installing any proprietary media server software.
The Solution
The WAMI recorder uses a light-weight Flash app to ship audio from client to server via a standard HTTP POST. Apart from the security settings to allow microphone access, the entire interface can be constructed in HTML and Javascript.
Hope this helps.
I'm not sure why I thought the file should be handled by the browser (chrome in my case) and then do something (for chrome I think its use QuickTime to play) but instead I just get an untitled browser title, and the page doesn't actually load, as if its loading an empty html page
anyway the address is:
www.motionvideos.tv/video/1022_market_review_february_2012_taylors.mp4
Other details which may effect it:
The site uses WordPress, which is currently not functioning, due to someone's fiddling, and will be down for a day or so (stupid zeus server redirects)
The video is just under 9MB.
Possible causes?
This link is for video download.
Do you want it to show on page?
If so you need to open a HTML page to embed this in.
This is how you embed it via code:
http://www.mediacollege.com/video/format/mpeg4/streaming/example.html
For WP you`ll need to open up a post and use a dedicated plugin for embedding.
Also, you should know that :
MP4 is not a universally common codec - some users (many?) will not be able to view it
The file itself will load directly from the server, thus noticeably effecting total bandwidth usage (can reflect on site speed, hosting costs and etc)
Also not all hosters support (by default) media hosting. This got a lot to do with above mentioned bandwidth issue.
I would suggest re-coding to more common codec + using 3-rd party provider
(I.E. Flash + Youtube for one is a popular choice but you can also go with AVI + Media Hosting Provider X)
Hope this helps.
I am wondering if it is possible to embed a YouTube video on a https website. As far as I can tell YouTube videos can only be embedded with the http:// protocol. Is there a way to embed them on a page without Firefox throwing an error?
I really do not know if this works, but you should give it a try:
Instead of the YouTube player you use your own custom player (made by youself or take from the web, there are a lot out there. e.g.: JW Player) This player is served by your secure server.
Before you play a video you have to call the Youtube API the recieve the source of you video:
http://gdata.youtube.com/feeds/api/videos/VideoID
Get you player streaming this video.
Within your player you should be able to allow recieving unsecure content from a secured website. You probably have to a little bit reading on the Flash Players security sandbox.
Unfortunately, Youtube doesn't have a valid SSL certificate installed on the main part of its site. You can try using a proxy such as https://browseunblocked.com/
Since Youtube doesn't have a valid SSL certificate, this won't be possible. Perhaps you could instead embed a HTTP iFrame containing a YouTube video inside your https webpage? Streaming a video over SSL would be slow, so unless the video itself needs to be encrypted, you shouldn't use it. Since you're talking about streaming YouTube videos, I doubt you care about encrypting the actual video stream, just the request to view it.
You could proxy the youtube stream through a secure server. What I mean is have a middle tier application that fetches the video feed from youtube and passes it through a secure connection back to your flash app.