angular – 如何检查带有iframe的html是否安全？

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

导读：我从html代码的API字符串获取,其中可能包含来自以下服务的嵌入视频： youtube.com, vimeo.com, dailymotion.com, prezi.com 如果我确定它足够安全,我可以将它们转换为可信的SafeHtml(绕过Angular的消毒剂)： this.safeHtml = this._sanitizer.bypassSecurity

我从html代码的API字符串获取,其中可能包含来自以下服务的嵌入视频：

> youtube.com,
> vimeo.com,
> dailymotion.com,
> prezi.com

如果我确定它足够安全,我可以将它们转换为可信的SafeHtml(绕过Angular的消毒剂)：

this.safeHtml = this._sanitizer.bypassSecurityTrustHtml(this.htmlFromApi);

然后将它放在这样的页面上：

<div [innerHtml]="safeHtml"></div>

问题：

>我必须执行哪些检查以确保此字符串足够安全？ (它不包含嵌入式脚本,只导致这四个站点中的一个没有任何棘手的重定向)？
>以某种方式将这些网站添加到Angular的消毒剂的例外中是否有意义？如果是的话怎么做？

提前致谢！

附：我看到了类似的问题：How to check if string of HTML is safe?但我希望有一些更新鲜和与Angular最佳实践相关的东西

解决方法

虽然不是特定角度的答案;你想在你的网站上有一个 Content Security Policy标题,只允许通过(i)框架访问cerain网站.

例：

Content-Security-Policy: 
         default-src 'self' https:; 
         script-src 'self' https:; 
         frame-src: https://*.youtube.com https://*.vimeo.com 
                    https://*.dailymotion.com https://*.prezi.com;

(标题是多行的,仅用于阅读清晰度)

此CSP为您的网站设置了一些规则,以便：

>默认仅允许引用网站本身(“自我”)并且仅通过https.
>脚本只能是[安全访问]文件而非内联脚本,并且必须从同一网站调用这些文件.
>(i)网站上的帧只能调用指定的域名.我已将Https地址类型放在此处作为最佳做法,并且您必须注意,这将*拒绝访问占位符URL,例如https://y2u.be,但您可以根据需要添加这些变体.

上述CSP声明完全符合您在问题中的要求,因此无需过滤SafeHtml清理程序之外的某些域.

清洁剂仍然可能需要通过 – 不知何故 – 但我不知道角度所以无法回答这个细节.

Read more about the frame-src CSP directve.

编辑

如果用户使用非TLS连接或您的网站不是TLS安全的更灵活的示例,还包括短URL的示例：

Content-Security-Policy: 
         default-src 'self'; 
         script-src 'self'; 
         frame-src: https://*.youtube.com https://*.vimeo.com 
                    https://*.dailymotion.com https://*.prezi.com
                    http://*.youtube.com http://*.vimeo.com 
                    http://*.dailymotion.com http://*.prezi.com
                    https://youtu.be;

（编辑：李大同）

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