How can I allow WYSIWYG editors and disable XSS attacks using Laravel?

Question

I have a enterprise level application where logged in users are authorized to post articles to page using a WYSIWYG editor. (You can consider this application as a website builder.)

Everything works fine, but the problems are;

1. WYSIWYG editor posts a HTML containing article, also some localised string characters which Laravel doesn't like, so Laravel's alpha_num check can't pass. (Therefore we don't use it on validation checks.)

2. We need to allow characters like <, ", > because they may want to do some basic styling using WYSIWYG editor, so htmlspecialchars() is not an option while echoing/sanitizing values, because harmful things like <br>'s break.

3. Users are able to post things like, <script type="text/javascript>alert('Hello');</script> or </div></div></div><div style="width: 100%, height: 100% z-index: 999999"> It is a huge security risk, I know, but we can't really sanitize/escape anything. Users will still be able to write <s<!---->cript> and pass the check.

So, in short, we can't rely some built-in Laravel and PHP functions. We can't disable WYSIWYG editor also, because it is used often in majority of areas in spoken application.

What is the best way to avoid this?

I'm thinking about creating a custom rule on top of alpha_num on Laravel, which would be called as something like alpha_num_localised_characters_plus_allowed_html_tags and add that rule to any input containing WYSIWYG editor.

Is this a good way? Is there any better alternative? How do you deal with such issues yourself?

Note: Please note we already developed a huge sized application, we'll rely on quickest and most maintainable solution.

Answer 1

Can you run everything through strip_tags and just allow the minimum tags possible?

You may also want to look at html purifier which should give you more options including control over css

What I usually do is save two copies of the WYSIWYG content:

1. the original unfiltered content
2. the filtered content

This allows me to reprocess the original content if I find that something vital has been stripped out and also show the user their original html when editing. Obviously I display the filtered content wherever it is displayed on the site.

Answer 2

You can use a tag system similar to the BBCode or Markdown to allow your users to do certain operation. This way, you can be sure the input will be sanitized against EVERY kind of malicious script, just use a lexer and a XSS protection when displaying user content.

EDIT: To see what i mean, you can use CKEditor as your WYSIWYG editor, in conjunction with the BBCode plugin: