The CreatorCon Call for Content is officially open! Get started here.

HTML Sanitizer configuration whitelist and blacklist

Rhodri
Tera Guru

I'm looking at configuring the HTML sanitizer script include. Due to a couple of issues that have arisen I am trying to:

Blacklist "font-family"

Whitelist "background"

The issue that I'm having is that most of the time the font is set using "style" within say a <span> tag. As a consequence of this I can only blacklist the whole "style" attribute removing "background" styling (which I would like to display as often clients use "highlight" in their emails).

var HTMLSanitizerConfig = Class.create();
HTMLSanitizerConfig.prototype = {
	initialize: function() {
	},
	
	HTML_WHITELIST : {
		globalAttributes: {
			attribute:["background"],
			attributeValuePattern:{}
        },
        
		
		style:{
				attribute:["background"],
			  },
		span:{
			attributeValuePattern:{style:".*background"}
		},
		
	},

	HTML_BLACKLIST : {
		globalAttributes: {
			attribute:["font-family"],
			attributeValuePattern:{}
		},

		style:{
				attribute:["font-family"]
			  },
		span:{
				 attribute:["style, font-family"],
			 },
		font:{
				attribute:["style", "font-face"]
			  },
	},
	
	getWhiteList : function() {
		return this.HTML_WHITELIST;
	},
	
	getBlackList : function() {
		return this.HTML_BLACKLIST;
	},
	
	type: 'HTMLSanitizerConfig'
};

My usage of "attributeValuePattern:{style:".*background"}" in the span whitelist doesn't seem to do anything, but this is possibly due to my formatting (I've tried the same thing in reverse for blacklisting font-family).

Any help much appreciated!

1 REPLY 1

Lom
Tera Contributor

Hello,

Have you tried to remove span and font tags like this:

HTML_BLACKLIST : {

globalAttributes: {

      attribute:["font-family"],

      attributeValuePattern:{}

},

style:{

     attribute:["font-family"] },

 

},