XSS stopper + HTML whitelist

High Level Overview

Cross site scripting (XSS) is a common security exploit on websites that allows one user to execute javascript on another user's browser. The attack is served in data saved to the database by the attacking user that is not properly cleaned, and which is later displayed in a way where the javascript gets executed by the browser.

Demo

Editor link

Run mode link

Run mode credentials:

u: username

p: password

Technical Details

This implementation uses 1 plugin which has both a client side and a server side flow to "sanitize" user input. Each of them takes a text as an input and then outputs a sanitized text, free of XSS exploits. They also can be customized for specific use cases.

With the default options, some HTML tags that are not dangerous (e.g. "<b>" tags that make text bold) will be preserved and displayed in the final output. HTML that may be dangerous is converted to a string that will be displayed. Instead of executing <script> alert("XSS"); </script>, after being processed by this plugin this code would be displayed like a text if it is shown in a Bubble HTML element.

To clean data before saving to the database, run the server-side plugin action, not the client-side/element action.

The client-side element will run nearly instantly on small texts, and only downloads a small (16kb) javascript file onto the page. However, note that cleaning the XSS client-side should not be done before saving to the database, only before displaying a potentially insecure text to a different user. On their browser, users can modify the library that the client-side action refers to and render it useless.

Inputs

  • Text to clean: the text that needs to be sanitized.

  • Options (optional)

    • Send a custom JSON with options for this function. This can be used to specify a whitelist, or other options specified by the git repo.

Additional technical docs

HTML whitelist - stop email phishing attacks

Emails can be used as a vector to steal user data, user credentials and other sensitive info. This relatively simple attack has been the cause of several high-profile cybersecurity breaches over the past few years.

Defending against these attacks is possible with this plugin, which can remove all links from emails.

Video explaining how to use options for processing HTML, adding whitelist

Note that the standard flow (without options) has custom logic which will be overwritten by adding a custom whitelist of tags/attributes. An example: without passing options, <b> tags are allowed, but if a whitelist is added and doesn't include <b> tags, they will be stripped from the text.

Strip URLs

The plugin also includes a server workflow to strip all URLs from some text. This is only necessary if users can send messages to other users which are also sent through your app's email, and could be easily confused by users to look like they're coming from app admins. This link, for example, wouldn't raise suspicion from all users - it looks quite official.

This Bubble editor shows an implementation of this Strip URL workflow functionality. Run mode page (username/password for credentials): https://chris-sandbox-3.bubbleapps.io/version-test/url-cleaner?debug_mode=true