CKEditor escape html

2019-06-09 17:44发布

问题:

I have CKEditor on post text where I want to insert html-code. Something like this:

<pre>
<code class="html">
<img src="path/to/img.jpg" />
</code>
</pre>

But when I save the text, CKEditor interprets img-tag as actual html-image and shows broken image. How I can prevent that and tell to escape html-code in pre-code block

回答1:

<pre>
<code class="html">
<img src="path/to/img.jpg" />
</code>
</pre>

This is an image inside a pre element. What you want to create is:

<pre>
<code class="html">
&lt;img src="path/to/img.jpg" /&gt;
</code>
</pre>

And if you write <img .../> inside pre element in CKEditor, then CKEditor will return this (valid) HTML.

What developers often don't know is that when they load that content from their database into <textarea> this content may need to be encoded (depends on how it's saved). In PHP for instance it's enough to pass it through htmlspecialchars().