Iframe is not working in Ios


#1

I am trying to show video in iframe its working fine on ionic lab but in device its not showing the frame. I have tried many directives and solutions but nothing worked for me.
Solution 1
<iframe width="560" height="315" src="http://www.youtube.com/embed/ZjPRj2Vp74U" frameborder="0" allowfullscreen></iframe>

`app…config(function ($sceDelegateProvider) {
$sceDelegateProvider.resourceUrlWhitelist([‘self’, new RegExp(’^(http[s]?)://(w{3}.)?youtube.com/.+$’)]);
});

There is no error in console and nothing show on iframe place.`

I also tried with another solution.
Solution 2

<embed-video iframe-id="{{featuredVideo.PostMediaId}}" ng-href="{{featuredVideo.Url}}" class="ng-isolate-scope" controls=0> <a href="{{featuredVideo.Url}}">Watch</a> </embed-video>

Directive
app.directive(‘embedVideo’, [ ‘$filter’ , ‘RegisteredPlayers’, ‘$sce’, ‘$window’, function ($filter, RegisteredPlayers, $sce, $window) {
‘use strict’;
return {
restrict: “E”,
template: ‘<iframe data-ng-attr-id="{{id}} “width=”{{width}}" height="{{height}}" data-ng-src=" {{trustedVideoSrc}}" allowfullscreen frameborder=“0”>’,
scope: {
height: ‘@’,
width: ‘@’,
onChange: ‘&’
},
link: function ($scope, $element, $attrs) {
var currentHref = undefined;

         $attrs.$observe('width', function(w) {
            $scope.width = w;
         });

        $attrs.$observe('height', function(h) {
            $scope.height = h;
        });

        $attrs.$observe('iframeId', function(id) {
            $scope.id = id;
        });

        //handle the use of both ng-href and href
        $attrs.$observe('href', function(url) {
            if (url === undefined || url === currentHref) {
                return;
            }
            currentHref = url;
            var player = null;
            log(url)
            log(RegisteredPlayers)
            //search for the right player in the list of registered players
            angular.forEach(RegisteredPlayers, function (value) {
                if (value.isPlayerFromURL(url)) {
                    player = value;
                }
            });

            if (player === null) {
                //haven't found a match for a valid registered player
                $scope.onChange();
                return;
            }

            var parameters = url.match(player.playerRegExp);

            var videoID = parameters[2],
                protocol = parameters[1],
                time = url.match(player.timeRegExp),
                config = player.config;

            //overwrite playback options
            angular.forEach($filter('whitelist')($attrs, player.whitelist), function (value, key) {
                var normalizedKey = player.transformAttrMap[key] != undefined ? player.transformAttrMap[key] : key;
                player.settings[normalizedKey] = value;
            });

            player.settings.start = 0;

            if (time) {
                switch (player.type) {
                    case "youtube":
                        player.settings.start += (parseInt(time[2] || "0") * 60 * 60 );
                        player.settings.start += (parseInt(time[4] || "0") * 60 );
                        player.settings.start += (parseInt(time[6] || "0"));
                        break;

                    case "dailymotion":
                        player.settings.start += (parseInt(time[1] || "0"));
                        break;

                    default:
                        break;
                }
            }

            //check if there is a need to add additional resources to the page...
            if(player.isAdditionaResRequired()) {
                var body = angular.element($window.document.querySelector('body'));
                for(var r = 0; r < player.additionalRes.length; r++) {
                    var res = player.additionalRes[r];
                    if($window.document.querySelector('#'+res.id) == null) {
                        body.append(res.element);
                    }
                }
            }

            // Call callback
            $scope.onChange({videoId: videoID, provider: player.type});

            //build and trust the video URL
            var untrustedVideoSrc = player.buildSrcURL(protocol, videoID);
            $scope.trustedVideoSrc = $sce.trustAsResourceUrl(untrustedVideoSrc);
        });
    }
  }
}]);`