angularjs – 在ng-bind-html中没有呈现IFrame

发布时间：2020-12-17 17:38:53 所属栏目：安全来源：网络整理

导读：我有一个数据源,用于在页面上呈现博客文章.其中一个条目包含IFRAME.我看到IFRAME在数据源中返回但它永远不会呈现给ng-bind-html中的页面. 这是我的代码： div class="blog-post-content" ng-bind-html="entry.content" itemprop="text"/div 如果我将其切换为

我有一个数据源,用于在页面上呈现博客文章.其中一个条目包含IFRAME.我看到IFRAME在数据源中返回但它永远不会呈现给ng-bind-html中的页面.

这是我的代码：

<div class="blog-post-content" ng-bind-html="entry.content" itemprop="text">
</div>

如果我将其切换为以下内容,我会看到IFRAME标记已呈现出来,但当然现在它是RAW HTML.

<div class="blog-post-content" itemprop="text">
    {{entry.content}}
</div>

如何将此IFRAME呈现到页面.

解决方法

这里最好的方法是将您的数据源重构为仅包含URL,而不是完整的iframe标记,并使用< iframe ng-src =“entry.content”>< / iframe>.

ng-bind-html不适合您,因为清洁剂可以保护您免受潜在的XSS攻击.

如果您不控制数据源,但完全信任它,您可以查看使用例如scope.trustedContent = $sce.trustAsHtml(entry.content);在你的指令中,< div ng-bind-html =“trustedContent”>< / div>在DOM中.

(当然,不控制它,但完全信任它是一个矛盾,所以你可能最好解析你的指令中的数据源来提取url,而不是信任整个字符串.)

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!