分类导航
HTMLHTML5JavaScriptCSSjQueryBootstrapAngularjsVueDojoJsonElectronNode.jsExpressXMLAjaxUnityReactFlexWeb前端微信小程序支付小程序百度小程序

详解AngularJs中$sce与$sceDelegate上下文转义服务

JavaScript   发布时间：2022-04-16  发布网站：大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了详解AngularJs中$sce与$sceDelegate上下文转义服务，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

一、严格的上下文转义服务@H_616_2@

严格的上下文转义(SCE)是一种需要在一定的语境中导致AngularJS绑定值被标记为安全使用语境的模式。由用户通过ng-bind-html绑定任意HTML语句就是这方面的一个例子。我们称这些上下文转义为特权或者SCE。

二、$sce@H_616_2@

$sce 服务是AngularJs提供的一种严格上下文转义服务。

下面代码是简化了的ngBindHtml实现（当然，这不是完整版ngBindHtml源码）：

E) { return function(scope,element,attr) { scope.$watch($sce.parseAsHtml(attr.ngBindHtml),function(value) { element.html(value || ''); }); }; }];

支持哪些信任的上下文类型？@H_616_2@

$sce.HTML 将HTML代码安全的绑定到应用程序中。

$sce.CSS 将CSS样式代码安全的绑定到应用程序中。

$sce.URL 将uRL安全的绑定到应用程序中并保证其可用。比如（href，src）

$sce.resourcE_URL 将resourcE_URL安全的绑定到应用程序中并保证其可用。比如（ng-href，ng-src）

$sce.JS 将JAVASCRIPT代码安全的绑定到应用程序中。

如何使$sce服务可用或者不可用？@H_616_2@

{ $sceProvider.enabled(true/falsE); }]);

使用：@H_616_2@$sce();

方法：@H_616_2@

isEnabled();@H_616_2@

返回一个Boolean，指示是否可启用SCE。

parseAs(type,expression);

将Angular表达式转换为一个函数。这类似$parse解析并且当表达式是常量时是相同的。否则，它将调用$sce.getTrusted(type,result)将表达式包装。

type：在SCE的上下文的使用的结果的类型。

expression：被编译的字符串表达式。

trustAs(type,value);

代表$sceDelegate.trustAs。

type：上下文中能安全的被使用的值，如url，resourceUrl，html，js和css。

value：需要被认为是安全或者值的信赖的值。

trustAsHtml(value);

$sceDelegate.trustAs($sce.HTML,value)的快捷方式。

value：被信任的值。

trustAsUrl(value);

$sceDelegate.trustAs($sce.URL,value)的快捷方式。

value：被信任的值。

trustAsresourceUrl(value);

$sceDelegate.trustAs($sce.resourcE_URL,value)的快捷方式。

value：被信任的值。

trustAsJs(value);

$sceDelegate.trustAs($sce.JS,value)的快捷方式。

value：被信任的值。

getTrusted(type,maybeTrusted);

代表$sceDelegate.getTrusted。因此，得到了$sce的结果。如果查询的上下文类型是一个创造型的类型，则调用trustAs()并且返回原来提供的值。如果这个条件不满足，则抛出一个异常。

getTrustedHtml(value);

$sceDelegate.getTrusted ($sce.HTML,value)的快捷方式。

value：通过$sce.getTrusted执行后的值。

getTrustedCss(value);

$sceDelegate.getTrusted ($sce.CSS,value)的快捷方式。

value：通过$sce.getTrusted执行后的值。

getTrustedUrl(value);

$sceDelegate.getTrusted ($sce.URL,value)的快捷方式。

value：通过$sce.getTrusted执行后的值。

getTrustedresourceUrl(value);

$sceDelegate.getTrusted ($sce.resourcE_URL,value)的快捷方式。

value：通过$sce.getTrusted执行后的值。

getTrustedJs(value);

$sceDelegate.getTrusted ($sce.JS,value)的快捷方式。

value：通过$sce.getTrusted执行后的值。

parseAsHtml(expression);

$sce.parseAs ($sce.HTML,value)的快捷方式。

value：被编译的字符串表达式。

parseAsCss(expression);

$sce.parseAs ($sce.CSS,value)的快捷方式。

value：被编译的字符串表达式。

parseAsUrl(expression);

$sce.parseAs ($sce.URL,value)的快捷方式。

value：被编译的字符串表达式。

parseAsresourceUrl(expression);

$sce.parseAs ($sce.resourcE_URL,value)的快捷方式。

value：被编译的字符串表达式。

parseAsJs(expression);

$sce.parseAs ($sce.JS,value)的快捷方式。

value：被编译的字符串表达式。

使用方式：@H_616_2@

TESTCtrl as ctrl">