部分HTML字符串中Angular.js

逃避我看了一下逃避一切默認和$sce的角度的方式，所以通過過濾器$sce.trustAsHtml()我白名單中的數據（因爲$sce服務無法正常工作），就像這樣：部分HTML字符串中Angular.js

<sup class="ng-binding" ng-bind-html="row|logEntry"></sup>

但問題是，我不相信HTML的某些部分。

要深入細節 - 我有translations其中有HTML，但它們中有可替換的標記/變量。所以translations support HTML，但我不想提供令牌來包含HTML。

我的過濾器logEntry內部看起來是這樣的：

var translated = $translate('Log.' + msg.context.entity_type) + '.' + msg.context.action, { 
     'object_name': msg.context.object_name, 
     'user': msg.context.user_name 
}); 
return $sce.trustAsHtml(translated);

例如，我可以有關於用戶X改變文章的翻譯，但我不希望結果文本觸發警報（）如果用戶名包括<script>alert('evilname')</script>

$translate本身是不相關的，它可以是任何HTML字符串，我想某些部分與普通JS .replace()與內容停留替換爲「文本」。

所以我的問題是 - 我該如何逃避部分HTML？我是否必須求助於在視圖內部分切片？或者我必須訴諸自定義轉義（ Fastest method to escape HTML tags as HTML entities?）？有這樣的事情的首選做法嗎？通過重組你的logEntry分離出interpolateParams

var translationId = 'Log.' + msg.context.entity_type) + '.' + msg.context.action; 
var interpolateParams = { 
     'object_name': msg.context.object_name, 
     'user': msg.context.user_name 
}; 
var translated = $translate(translationId, interpolateParams); 
return $sce.trustAsHtml(translated);

要從interpolateParams逃避所有的HTML，但在你的機器翻譯模板留下任何HTML

來源

2014-11-21 Artjom Kurapov

讓我們開始。使用此代碼複製對象，遍歷其值並用轉義的HTML代替。

var safeParams = angular.copy(interpolateParams);  
angular.forEach(safeParams, function(value, key, obj) {  
    obj[key] = encodeEntities(value) 
    // if you want safe/sanitized HTML, use this instead 
    // obj[key] = $sanitize(value); 
}); 
var translated = $translate(translationId, safeParams);

最後，角的encodeEntities功能不外露，所以我們不得不從angular-sanitize.js

var SURROGATE_PAIR_REGEXP = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g, 
    // Match everything outside of normal chars and " (quote character) 
    NON_ALPHANUMERIC_REGEXP = /([^\#-~| |!])/g; 
function encodeEntities(value) { 
    return value. 
    replace(/&/g, '&amp;'). 
    replace(SURROGATE_PAIR_REGEXP, function(value) { 
     var hi = value.charCodeAt(0); 
     var low = value.charCodeAt(1); 
     return '&#' + (((hi - 0xD800) * 0x400) + (low - 0xDC00) + 0x10000) + ';'; 
    }). 
    replace(NON_ALPHANUMERIC_REGEXP, function(value) { 
     return '&#' + value.charCodeAt(0) + ';'; 
    }). 
    replace(/</g, '&lt;'). 
    replace(/>/g, '&gt;'); 
}

更新借來源：更新到角轉換2.7.0此消息出現：

pascalprecht.translate。$ translateSanitization：No sanitization 策略已配置gured。這可以具有嚴重的安全性的影響。請參閱 http://angular-translate.github.io/docs/#/guide/19_security的的詳細信息。

SP的不是以上trustlate答案，角轉換可以實現同樣的結果：

$translateProvider.useSanitizeValueStrategy('escapeParameters');

查看文檔的更多消毒價值策略

來源

2015-05-31 14:02:54

在應用程式中加入

$translateProvider.useSanitizeValueStrategy('escapeParameters');

因此，你的代碼看起來像這個：

myApp.config(function ($translateProvider) { 

    //...whatever 

    $translateProvider.useSanitizeValueStrategy('escapeParameters'); 

});

來源

2016-07-19 12:37:56 Guest

部分HTML字符串中Angular.js

回答

相關問題