使用Wistia Player API构建Ionic应用程序不适用于iOs。

因此，我正在使用Wistia播放器API构建一个Ionic/AngularJS应用程序。我最终尝试了一切，并且在浏览器测试模式下一切正常。但是当编译到iOs上时，它只显示白屏。下面是详细：使用Wistia Player API构建Ionic应用程序不适用于iOs。

视图 - HTML页面：

<!-- Wistia Embed --> 
<div id="{{ 'wistia_' + mediaHashId }}" class="wistia_embed" style="width:398px;height:224px;" ng-if="mediaHashId"></div>

控制器：

$timeout(function() { 
        var wistiaEmbed = Wistia.embed($scope.mediaHashId, { 
         videoFoam: true, 
         playerColor: "3B97D3" 
        }); 

        wistiaEmbed.bind("end", function() { 
        alert ("Video is finished"); 
        }); 
}, 100);

所以它完全加载到浏览器。但是，当我编译到Xcode并运行它在我的手机上。它只是显示一个白色的屏幕（没有JS错误！）

第二选项：iframe - 因为iframe加载好iOs（http://wistia.com/doc/player-api#using_iframes_and_the_player_api）。第二个选项是将wistiaApi附加到iframe上。但是代码不起作用。

视图 - HTML页面：

<div class="video-container"> 
       <iframe id="wistia_player" ng-src="{{ mediaHashId | wistiaEmbedUrl }}" allowtransparency="true" frameborder="0" scrolling="no" class="wistia_embed" name="wistia_embed" width="640" height="360"></iframe> 
</div>

控制器：

$timeout(function() { 

        var wistiaEmbed = document.getElementById("wistia_player").wistiaApi; 

        console.log (wistiaEmbed); 

        wistiaEmbed.bind("end", function() { 
        alert ("Video is finished"); 
        }); 

}, 100);

的wistiaEmbed控制台登录一个未定义的。和错误日志：

TypeError: Cannot read property 'bind' of undefined 
    at lesson-detail-ctrl.js:46 
    at ionic.bundle.js:24922 
    at completeOutstandingRequest (ionic.bundle.js:13604) 
    at ionic.bundle.js:13984

所以很明显.wistiaApi不工作...

我确实包括这在我的index.html：

我会爱一个AngularJS库这样https://github.com/brandly/angular-youtube-embed与Wistia球员...但没有运气...

来源

2015-05-28 Hugh Hou

哇，我发现了这个问题。在iOs和/或Android上构建离子应用程序时，这实际上是一个非常常见的问题。当您在您的index.html中包含<script>标签时，请始终填写完整的http://....而不是仅使用//。

就我而言，我包括通过他们的官方文档，如Wistia API：

<script src="//fast.wistia.com/assets/external/E-v1.js"></script>

它适用于浏览器，因为浏览器是聪明的。设备并不像浏览器那么聪明，所以通过像这样包括http：

<script src="https://fast.wistia.com/assets/external/E-v1.js"></script>

解决它！

来源

2015-05-29 07:37:50

默认情况下，您可能希望包含“https”，否则注入恶意JS太容易了（这对移动应用程序尤其重要）。 – CaringDev

使用Wistia Player API构建Ionic应用程序不适用于iOs。

回答

相关问题