我正在尝试使用iframe将MP3媒体播放器从外部服务添加到我的应用程序中(我的问题是Krakenfiles网站)。我想使用变量将链接传递给src。
我使用SafeResourceUrl和DomSanitizer来处理安全性,这是angular所要求的。
safeSrc: SafeResourceUrl;
constructor(private sanitizer: DomSanitizer) {
this.safeSrc = this.sanitizer.bypassSecurityTrustResourceUrl(
'https://krakenfiles.com/getEmbedPlayer/1f02d877ff?width=450&autoplay=false&date=18-08-2020');
}
声明变量后,我将变量转换为html代码(在iframe声明中):
<iframe [src]="safeSrc" width="450" height="100" frameborder="0"></iframe>
image of broken media player from krakenfiles service
正如您在上面看到的,iframe显示在页面上,但内容不可见,播放器不会对任何内容做出反应。
我怀疑错误出在链接中,所以我尝试在不向iframe src传递变量的情况下调用链接,令人惊讶的是它工作正常(下面的代码工作正常)。
<iframe src="https://krakenfiles.com/getEmbedPlayer/1f02d877ff?width=450&autoplay=false&date=18-08-2020" width="450" height="100" frameborder="0"></iframe>
我想,也许在传递给变量的角度上还存在一些限制。
image of media player working correctly
你有什么想法吗?
转载请注明出处:http://www.wxmcsj.com/article/20230331/1193512.html