$sce in ng

[fnjoe]

场景

当我使用iframe将一个另一个独立开发的web网页嵌入到ngApp中时，ng向我抛出了一个错误，它认为使用iframe来引入一个陌生的url所指引的web网页是不安全的，但开发者判断这是个安全的来源。我们需要告知ng。精确来说，我们需要告知ng中负责安全限制的 $sce。

$sce是什么

$sce is a service that provides Strict Contextual Escaping services to AngularJS.

Strict Contextual Escaping (SCE) is a mode in which AngularJS requires bindings in certain contexts to result in a value that is marked as safe to use for that context.

1. 首先，$sce是一个全局可见的服务。
2. 其次，它用来执行“严格上下文控制”这个用来确保数据绑定安全的模式，保证整个页面上下文安全。
3. 在ng以数据为驱动的设计模式中，我们需要确保数据的来源是安全的，相对于JavaScript代码直接暴露在客户端的特定来说，增加对于数据来源的验证是十分有必要的。

所以，ng设计了$sce来管理可能出现不安全来源数据的场景，上文中提到的iframe的url便是其中之一。

$sce怎样工作

1. 总体来说，需要引入数据的地方都是需要确保数据的来源是安全的，不过，很多情况下，数据类型与来源本身就是安全的，所以我们不需要进行安全性控制，自然，也就没有$sce的用武之地了。
2. 当我们的数据类型存在安全性方面的风险，ng在不被特意通知的情况下便会启动$sce来处理数据，对应的场景包括

• Directive 中 attribute 的绑定，如ng-bind，{{}} 插值表达式等会转译html代码。
• 载入html模板时，如ng-include，Directive中的 templateUrl；默认下，ng只从当前域名与端口下加载模板，这些都是基于js的同源策略实施的。
• 对于iframe与object等url的限制。

$sce 支持的安全上下文

当我们能明确判断数据安全性的时候，我们不需要ng对上述的情况作出转译以及限制，于是我们需要明确告知ng，这时我们就可以使用$sce来设置，甚至，我们可以在全局中关闭$sce功能，不过，这个并不被提倡。

具体的$sce提供的安全上下文及设置方法请参考 $sce doc