0

Since not all browsers support MPEG DASH for live video (safari), I am looking for a way to display 3 iframes based on the client. I think client sniffing is needed in this case because I want one page for all.

Is there a way to show a specific iframe based on the client (or iframe wrapped in a div).

  • iframe 1 - display on safari only
  • iframe 2 - display on IE 7 only
  • iframe 3 - display on all others

===========

  • 1 will output HLS video
  • 2 will output rtmp flash
  • 3 will output MPEG Dash
Rodney
  • 1
  • 1
  • Why 3 iframes? Use one iframe with one page, that either renders/shows the correct version or redirects to the correct version. You can do this (both approaches) either with JS or on the server. But don't start messing around with multiple iframes. – Thomas Nov 01 '17 at 16:12

2 Answers2

1

You can use some javascript to detect the browser and then change the iframe 'src' attribute. One library is bowser: https://github.com/lancedikson/bowser

Html:

<iframe id="iframe_id"></iframe>

Javascript

const iframe = document.getElementById('iframe_id')
// do here your logic
if (bowser.msie && bowser.version == 7) {
  iframe.setAttribute('src', 'ie7url');
} elseif(bowser.safari) {
  iframe.setAttribute('src', 'safariurl');
} else {
  iframe.setAttribute('src', 'defaulturl');
}
Christian Benseler
  • 7,907
  • 8
  • 40
  • 71
0

Following this question, you can detect the user agent:

var is_chrome = navigator.userAgent.indexOf('Chrome') > -1;
var is_explorer = navigator.userAgent.indexOf('MSIE') > -1;
var is_firefox = navigator.userAgent.indexOf('Firefox') > -1;
var is_safari = navigator.userAgent.indexOf("Safari") > -1;
var is_opera = navigator.userAgent.toLowerCase().indexOf("op") > -1;
Mojo Allmighty
  • 793
  • 7
  • 18