У меня есть iframe в шаблоне angular2 + html, который встраивает видео, размещенное на vzaar. Видео отображается и воспроизводится нормально, и я могу использовать vzaar API
чтобы получить длительность, время воспроизведения и некоторые другие данные о воспроизводимом видео ... IFF атрибут src в iframe жестко задан.
Я понимаю, что проблема может быть в каком-то предположении, внутреннем для API vzaar, но я подозреваю, что средство очистки Angular DOM не отправляет простую строку, и API vzaar ожидает, что значение атрибута src iframe будет простая строка.
Вот жестко закодированный атрибут src, который прекрасно работает:
<iframe name="my_video" title="video player" id="my_video" src="//view.vzaar.com/11616962/player" frameborder="0" allowfullscreen="" allowtransparency="true"type="text/html" webkitallowfullscreen="" mozallowfullscreen=""></iframe>
Если я пытаюсь изменить атрибут src на строковое значение, сгенерированное в моем компоненте, я получаю «используемое небезопасное значение ...», поэтому я должен очистить URL-адрес от компонента:
this.iframe_src = this.sanitizer.bypassSecurityTrustResourceUrl('//view.vzaar.com/' + this.episode.video_id + '/player');
Затем я могу использовать очищенный URL для успешной загрузки iframe снова:
<iframe name="my_video" title="video player" id="my_video" [src]=iframe_src frameborder="0" allowfullscreen="" allowtransparency="true"type="text/html" webkitallowfullscreen="" mozallowfullscreen=""></iframe>
... но теперь метод ready () API vzaar никогда не срабатывает:
const vzp = new vzPlayer('my_video');
vzp.ready(function () { console.log('API is ready'); }
Опять же, я понимаю, что vzaar API - гораздо более узкая тема, чем Angular2, но я думаю, что это больше связано с тем, что DOM sanitizer делает ... что-то ... с атрибутом src iframe, не позволяя API vzaar работать. Функция vzPlayer (string) принимает id iframe, а затем автоматически находит этот элемент в DOM и подключается к нему, поэтому я думаю, что когда я даю этому iframe санированный URL, санированный URL выглядит «странно», так что этот класс никогда не инициализируется.
Вот еще одна подсказка: если я записываю значение из моего компонента в консоль, я получаю это:
iframe_src: SafeResourceUrlImpl {changingThisBreaksApplicationSecurity: "//view.vzaar.com/11616962/player"}
... определенно не простая строка. Может ли это быть тем, что сбивает с толку API vzaar? Есть ли способ обойти это? Должен ли я выполнять санитарную обработку другим способом, чтобы убедиться, что значение атрибута src является простой строкой? Я доверяю URL-адресам в базе данных, потому что я создаю их из идентификаторов видео, которые я сам загрузил.
Спасибо за любую помощь по этому вопросу.