CKEditor - preventing users from pasting images

后端 未结 4 842
庸人自扰
庸人自扰 2021-02-10 02:54

I would like giving my users a limited editor, using the great CKEditor.

I was trying to prevent people from adding images, therefore I\'ve blocked the \"Source\" view a

4条回答
  •  挽巷
    挽巷 (楼主)
    2021-02-10 03:39

    that was useful, I used the solution of Nis. but the problem is that if you drop a image, the paste event is lost. I made a change to prevent this situation.

    (function(){
        var pluginName = 'blockimagepaste';
        function replaceImgText(html) {
            var ret = html.replace( /]*src="data:image\/(bmp|dds|gif|jpg|jpeg|png|psd|pspimage|tga|thm|tif|tiff|yuv|ai|eps|ps|svg);base64,.*?"[^>]*>/gi, function( img ){
                alert("Direct image paste is not allowed.");
                return '';
            });
            return ret;
        };
    
        function chkImg(editor) {
            // don't execute code if the editor is readOnly
            if (editor.readOnly)
                return;
    
            setTimeout( function() {
                editor.document.$.body.innerHTML = replaceImgText(editor.document.$.body.innerHTML);
            },100);
        };
    
        CKEDITOR.plugins.add( pluginName, {
            icons: pluginName,
            init : function( editor ){
    
                editor.on( 'contentDom', function() {
                    // For Firefox
                    editor.document.on('drop', function(e) {chkImg(editor);});
                    // For IE
                    editor.document.getBody().on('drop', function(e) {chkImg(editor);});
    
                    editor.document.on( 'paste', function(e) {chkImg(editor);});
    
                    // For IE
                    editor.document.getBody().on('paste', function(e) {chkImg(editor);});
                });
    
            } //Init
        });
    
    })();
    

提交回复
热议问题