如何播放在另一台服务器上以ionicApp格式托管的视频

Question

我正在尝试将视频流到一个远程服务器上，该服务器的URL在JSON数组中提供。我设法使用ngSanitize将视频带到帧中，并且它在我的浏览器上工作得很好。当我为Android构建时，我的问题就出现了:它不工作，只有一个片段帧是可见的。

如何使用基于Ionic框架的应用程序在远程服务器上播放我的视频？

这就是我在做的。

控制器：

.controller("myCtrl",["$scope","$sce","$ionicLoading",function($scope,$sce,$ionicLoading){
    $scope.trustSrc = function(src) {
    return $sce.trustAsResourceUrl(src);
  }
    $ionicLoading.show({
        content     : 'Loading...',
        animation   : 'fade-in',
        showBackdrop: true,
        maxWidth    : 200,
        showDelay   : 0,
        duration    :10000
    });

    $scope.videos=[
                    {
                      "title":"video1",
                      "source"  :"http://player.vimeo.com/external/85569724.sd.mp4?s=43df5df0d733011263687d20a47557e4"
                    },
                    {
                      "title":"video2",
                      "source"  :"http://player.vimeo.com/external/85569724.sd.mp4?s=43df5df0d733011263687d20a47557e4"
                    }, 
                    {
                      "title":"video3",
                      "source"  :"http://player.vimeo.com/external/85569724.sd.mp4?s=43df5df0d733011263687d20a47557e4"
                    },
                    {
                      "title":"video4",
                      "source"  :"http://player.vimeo.com/external/85569724.sd.mp4?s=43df5df0d733011263687d20a47557e4"
                    },
                    {
                      "title":"video5",
                      "source"  :"http://player.vimeo.com/external/85569724.sd.mp4?s=43df5df0d733011263687d20a47557e4"
                    },
                    {
                      "title":"video6",
                      "source"  :"http://player.vimeo.com/external/85569724.sd.mp4?s=43df5df0d733011263687d20a47557e4"
                    }
                  ];


}])

视图：

<div class="card" ng-repeat="video in videos">

         <video controls style="width:100%"> 
            <source ng-src="{{trustSrc(video.source)}}" type="video/mp4"/>
         </video> 

    </div>

我也使用iframe (没有构建apk)，但在这里，我没有找到方法来停止我的视频形式自动播放。

 <div class="card" ng-repeat="video in videos">

                 <iframe src="" dynamic-url dynamic-url-src="{{video.source}}" frameborder="0" width="100%"  controls autoplay="false"></iframe>

            </div>

Answer 1

您可以使用安装了video的HTML标记来嵌入一个视频：

示例：

<video controls="controls" preload="auto" webkit-playsinline="webkit-playsinline" class="videoPlayer"><source src="http://player.vimeo.com/external/85569724.sd.mp4?s=43df5df0d733011263687d20a47557e4" type="video/mp4"/></video>