iframe 的 src 中的硬編碼綁定到 Kaltura 視頻作品。 但是，將其綁定到變量在 IE 中不起作用

Question

我有一個加載 angularjs 的 SharePoint 站點。 在我的一個網站上，我試圖展示一個帶有來自 Kaltura 的嵌入式視頻的 iframe。 請參閱下面的代碼片段。

注意：出於保密原因，下面的嵌入視頻不是實際視頻。

JavaScript 文件：

var embedVideoLink = 'https://mediaspace.company.com/embed/secure/iframe/entryId/0_dfnoklj0/uiConfId/12345678'; 
$('<iframe>')
    .attr('id', 'cf_iframe_video')
    .attr('src', embedVideoLink)
    .attr('frameborder', 0)
    .attr('allow', 'autoplay *; fullscreen *; encrypted-media *')
    .attr('allowfullscreen', 'allowfullscreen')
    .attr('width', '100%')
    .attr('height', '350px')
    .appendTo('#cf_iframe_video_container');

HTML 文件：

<div id="cf_iframe_video_container" class="row embed-responsive embed-responsive-16by9">

上面的代碼在 Chrome 和 Edge 中運行良好，但在 IE 中不行。 我一直在 IE 上看到“錯誤 kWdiget 從未准備好”。

為了使其在 IE11 中工作，我將 src 與硬編碼值綁定，如下所示：

.attr('src', 'https://mediaspace.company.com/embed/secure/iframe/entryId/0_dfnoklj0/uiConfId/12345678')

但我不能這樣做，因為嵌入鏈接存儲在其他地方，用戶可以自由替換它。 我在這里錯過了什么嗎？ 你能建議我做什么，這樣我也可以讓它與 IE11 一起工作？

Answer 1

我重構了我的代碼。 相反，我從用戶輸入中獲取了整個 embedCode。 樣本預期輸入：

<iframe src="https://mediaspace.company.com/embed/secure/iframe/entryId/0_hx1rzwia/uiConfId/12345678" frameborder="0" class="kmsembed" width="100%" height="350px" allow="autoplay *; fullscreen *; encrypted-media *" allowfullscreen="allowfullscreen"></iframe>

然后，我的 js 代碼如下所示：

var embedCode = curItem.checklist; //Taken from User Input in a SharePoint List
embedCode = embedCode.replace(/&gt;/g, ">").replace(/&lt;/g, "<").replace(/&quot;/g, '\\"').replace(/&#58;/g, ':').replace(/\\/g,'');
var embeddedIframe = '';
embeddedIframe = common.decodeHTML(embedCode);
$scope.embeddedVideo = $sce.trustAsHtml(embeddedIframe);

最后，HTML 文件如下所示：

<div id="cf_iframe_video_container" class="row embed-responsive embed-responsive-16by9" ng-bind-html="embeddedVideo">

它現在按預期工作。