Search code examples
aemxsssightlytel

Rendering telephone links in HTL based on input from a Rich Text widget


I have a component using the Rich Text Edit widget (xtype="richtext") in my project that's used across the entire site as the default text component.

The users would like to be able to insert phone links using the tel URI scheme into the text entered using this component.

The dialog allows them to do so but when the contents of the Rich Text Edit are rendered in Sightly/HTL later on, the html context is used:

{$text @ context='html'}

Once this is done, the value of my attribute is ignored.

The HTML stored in the repository is:

 <a href="tel:04242424242">Call us!</a>

And what's actually rendered on the page on the author instance is:

 <a>Call us!</a>

on the publish instance, the tag gets removed altogether because of the link checker.

Changing the context to unsafe causes the href to render but it's not a solution I'm willing to accept. The component is used in a lot of places and I want to be sure the XSS protection is sufficient.

Is there a way I can affect the way the html context in HTL treats telephone links?

I tried adding an extra regular expression to the overlay of apps/cq/xssprotection/config.xml:

<regexp name="onsiteURL" value="([\p{L}\p{N}\\\.\#@\$%\+&amp;;\-_~,\?=/!]+|\#(\w)+)"/>
<regexp name="offsiteURL" value="(\s)*((ht|f)tp(s?)://|mailto:)[\p{L}\p{N}]+[\p{L}\p{N}\p{Zs}\.\#@\$%\+&amp;;:\-_~,\?=/!]*(\s)*"/>
<regexp name="telephoneLink" value="tel:\+?[0-9]+"/>

and further on:

<attribute name="href">
    <regexp-list>
        <regexp name="onsiteURL"/>
        <regexp name="offsiteURL"/>
        <regexp name="telephoneLink"/>
    </regexp-list>
    <!-- Skipped for brevity -->
</attribute>

but that doesn't seem to affect the way the Sightly/HTL escapes strings in the html context.

I've also tried overlaying the Sling xss rules located in /libs/sling/xss/config.xml but had no luck either.

How can it be done?


Solution

  • There are two xss protection config files:

    1. /libs/cq/xssprotection/config.xml
    2. /libs/sling/xss/config.xml

    Sightly is using the second one, which means that you need to overlay it at path /apps/sling/xss/config.xml

    What is worth mentioning is that new configuration seems to be applied only after restart of your aem instance.