- Print
- DarkLight
Always leave the SigSlo parameter Sanitize Value at its default value true
or use Hives encodeHtml() when displaying user text input in the configurator!
SigSlo parameter Sanitize Value
To prevent Cross-Site Scripting (XSS) attacks we've introduced a new paramter Sanitize Value
for a wide range of SigSlo
slots like Button.setValue
, Label.setValue
, DataView.setEntries
etc.
This parameter comes with a default value of true
which ensures that HTML code which is given to the slot is not rendered as such but only shown as raw text.
Imaginary XSS attack scenario
- Imagine a configurator where the user can enter some text which is then shown in a label.
E.g. a custom name for his configuration. - This configuration name is saved to a component
CfgnName
via the followingSigSlos
:CfgnNameTxtbox.ValueChanged -> CfgnName.setValue(CfgnNameTxtBox.Value)
CfgnName.ValueChanged -> CfgnNameLbl.setValue(CfgnName.Value, false)
Note that the second parameterSanitize Value
isfalse
here!
- A user can now enter HTML in the
CfgnNameTxtbox
which is saved in theCfgnName
component and in turn rendered to theCfgnNameLbl
via itssetValue
slot. This HTML code can potentially include JavaScript that is executed on rendering. - An evil user could do the following:
- Create a new configuration in the published & embedded configurator.
- Enter some HTML in the
CfgnNameTxtbox
which renders an unsuspiciously looking name but also executes some JavaScript. The JavaScript could add a dialog to the configurator that asks users for credit card information before checkout and sends it to the evil user. - This HTML is saved in the
CfgnName
component by theSigSlos
shown above. - The evil user can now send a copy link to this configuration to anyone, promising a fake discount of 80% to anyone who buys a product via this link.
- Everyone who performs checkout via this copy link is presented with the malicious credit card dialog and unknowingly sends his credit card information to the evil user...
Mixed content
If you have to write HTML in Hive which includes text from user input AND shall be rendered as HTML you can use Hives
encodeHtml method to sanitize the user input.
Example
Imagine that the configuration name from the imaginary attack scenario above shall be shown in a "configuration overview" label whose content contains complex HTML to allow some fancy styling via custom CSS:
/* Component "CfgnOverview" */
"""
<div class="CfgnOverview">
<div class="CfgnOverview__name">{=CfgnName}</div>
<div class="CfgnOverview__text">{=CfgnOverviewText}</div>
<div class="CfgnOverview__price">{=CfgnPrice.toText("€ 0.00")}</div>
</div>
"""
/* SigSlos */
CfgnOverview.ValueChanged -> CfgnOverviewLabel.setValue(CfgnOverview.Value, false)
You can't set the Sanitize Value
parameter to true
here since that would destroy the beautiful HTML rendering that you actually require here, which leads to this code being open to XSS attacks.
Solution: Encode the user input via Hives encodeHtml method when embedding it in the HTML code:
/* Component "CfgnOverview" */
"""
<div class="CfgnOverview">
<div class="CfgnOverview__name">{=CfgnName.encodeHtml()}</div>
<div class="CfgnOverview__text">{=CfgnOverviewText}</div>
<div class="CfgnOverview__price">{=CfgnPrice.toText("€ 0.00")}</div>
</div>
"""