I'm using Sightly and while investigating a bug in my application I noticed a behaviour I didn't expect.
Some of the links would render with ampersands in the query string escaped twice. Example:
<a href="http://www.google.com?a=1&amp;b=2&amp;c=3">
link with explicit attribute context
</a>
Upon closer inspection, it turned out we had an org.apache.sling.rewriter.Transformer
implementation escaping special characters in all href
attributes running in AEM.
Coupled with Sightly XSS protection, this resulted in double escapes.
While investigating this further, I disabled the transformer and noticed a strange behaviour in Sightly itself.
Given the following three elements, I'd expect them to render the href
value in the same way (with the query string escaped, consistent with W3C standards)
<a href="${'http://www.google.com?a=1&b=2&c=3'}">no explicit context, expression used</a>
<a href="http://www.google.com?a=1&b=2&c=3">no explicit context</a>
<a href="${'http://www.google.com?a=1&b=2&c=3' @ context='attribute'}">
explicit attribute context
</a>
However, only the last one performs the escaping and I get
<a href="http://www.google.com?a=1&b=2&c=3">no explicit context, expression used</a>
<a href="http://www.google.com?a=1&b=2&c=3">no explicit context</a>
<a href="http://www.google.com?a=1&amp;b=2&amp;c=3">
explicit attribute context
</a>
For some reason, the the last one, using context='attribute'
(the only one that does something with the &
characters) escapes the ampersands twice, yielding invalid links.
This can be achieved with arbitrary element and attribute names so I think I can safely assume this is not some rewriter kicking in.
<stargate data-custom="${'http://www.google.com?a=1&b=2&c=3' @ context='attribute'}">
attribute context in custom tag
</stargate>
Outputs:
<stargate data-custom="http://www.google.com?a=1&amp;b=2&amp;c=3">
attribute context in custom tag
</stargate>
Furthermore, the Display Context Specification gave me the impression that the context, when rendering an attribute, would be picked up automatically as attribute
To protect against cross-site scripting (XSS) vulnerabilities, Sightly automatically recognises the context within which an output string is to be displayed within the final HTML output, and escapes that string appropriately.
Is the observed behaviour here to be expected or am I looking at a potential bug in Sightly?
Which context should I be using here? All contexts apart from attribute
ignore the fact that query strings should be escaped in href
. attribute
on the other hand appears to be doing this twice. What's going on?
I'm using Adobe Granite Sightly Template Engine (compatibility)io.sightly.bundle 1.1.72
I did also try using
<a href="${'http://www.google.com?a=1&b=2&c=3' @ context='uri'}">explicit uri context</a>
But it fails to escape the &
chars, resulting in invalid HTML5.
<a href="http://www.google.com?a=1&b=2&c=3">explicit uri context</a>
Result of validation as HTML5:
Error Line 70, Column 35: & did not start a character reference. (& probably should have been escaped as &.)
<a href="http://www.google.com?a=1&b=2&c=3">explicit uri context</a>
It seems the only context I could possibly use here at the moment is html
(text
escapes &
twice, just like attribute
)
<a href="${'http://www.google.com?a=1&b=2&c=3' @ context='html'}">explicit html context</a>
yields
<a href="http://www.google.com?a=1&b=2&c=3">explicit html context</a>
Changing to this context would allow me to get the right value in the href, as rendered by the browser. However, it doesn't seem to have the correct semantics.
To quote the description of the html
context from the Sightly spec:
Use this in case you want to output HTML - Removes markup that may contain XSS risks
To protect against cross-site scripting (XSS) vulnerabilities, Sightly automatically recognises the context within which an output string is to be displayed within the final HTML output, and escapes that string appropriately.
data-sly-element attribute with example in AEM: data-sly-element is a sightly/htl attributes which replaces the element name of the host element. In this video I have created a template called newtemplate which points to demo component which is a page rendering component.
data-sly-use "is used to add js/java". You declare component-beans with this statement for instance. data-sly-resource you can override a resource-type for a included file. data-sly-include includes other html files as the name suggests.
The href
attribute uses the uri
context rather than the attribute
context. The attribute
context is meant to be used for HTML attributes such as title
, id
, data-*
, etc... Concerning your three examples:
<a href="${'http://www.google.com?a=1&b=2&c=3'}">link without explicit context, expression used</a>
<a href="http://www.google.com?a=1&b=2&c=3">link without explicit context</a>
<a href="${'http://www.google.com?a=1&b=2&c=3' @ context='attribute'}">link with explicit attribute context</a>
The first is using the uri
context. The seconds isn't using Sightly at all. The third is misusing the attribute
context.
The unsafe
context should be avoided if at all possible.
Sightly doesn't currently escape the ampersand in the uri
context as you would like. You should submit an Adobe Daycare ticket or contact the Apache Sling distribution list with your request.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With