简体   繁体   中英

Form WYSIWYG but stop user from breaking page layout

I am looking into using a HTML WYSIWYG editor such as CKEditor but I am curious about what is to stop a user from submitting some HTML code that will change the layout of the page when I try to output their HTML.

Here is an example of two posts:

<p><b>This is my post</b></p>
<p>It has some nice HTML that does not break stuff</p>

and

</div>
<div style="height:10000px; width:10000px;">
    <p>muhahaha</p>
</div>

As you can see, the first post is nice and simple, I can display that and it wont look crazy. But the second post could alter my page layout completely (have not tested but you get the idea.

<html>
<head>...</head>
<body>
    <div class='content'>
        <div class='post'>
            <p><b>This is my post</b></p>
            <p>It has some nice HTML that does not break stuff</p>
        </div>
        <div class='post'>
            </div>
            <div style="height:10000px; width:10000px;">
                <p>muhahaha</p>
            </div>
        </div>
    </div>
</body>
</html>

I know I can use htmlentities but this would then display the first post without the bold and I do not want that.

The stackoverflow website must have something like this built in, and I am wondering if there is a simple way to stop users being able to submit layout-changing HTML via a WYSIWYG editor?

CKEditor has a feature called Advanced Content Filter that in its default, automatic mode filters incoming HTML content by transforming and deleting disallowed elements, attributes, classes and styles. CKEditor will only allow content that was defined as allowed by enabled editor features (buttons, plugins).

It is highly configurable, too, so it lets you fully control what your users can and cannot submit to your website.

Have a look at the following resources to figure it out:

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM