在实例化CKEditor4实例时,如何将自定义值传递给CKFinder3?

问题描述 投票:0回答:1

使用CKEditor4时,使用pass将变量传递给我的CKFinder3(ASP)连接器时遇到了一些麻烦。

我创建了我的编辑器实例:

CKFinder.setupCKEditor( myEditor, {
    pass:         'testVar',
    testVar:    'nooice',
    ...
});

但这个变量似乎并没有让它成为CKFinder。

如果我将此代码直接添加到CKFinder配置,它确实有效:

config.pass = 'testVar';
config.testVar = 'nooice';

这很好,但我想要传递的值将是动态的,所以当我在页面上调用.setupCKEditor()时,我需要传递它们。我也尝试过使用connectorInfo: 'testVar=nooice',但这也不起作用。

有没有人碰到这个?我在这个问题上找到了一个很好的答案和例子,How to pass query string parameters in ckeditor for the picture (ckfinder) button?,但所描述的解决方案基本上就是我正在做的事情并且对我没有任何影响。

我已经能够使用以下方法在CKEditor5测试中使用:

ClassicEditor.create( document.querySelector( '#bodyContent' ), {
    ckfinder: {
        uploadUrl: '/ckfinder3/connector?command=QuickUpload&type=Images&responseType=json',
        options: {
            pass: 'testVar',
            testVar: 'nooice'
        }
    },
    ...
} );

但我无法在CKEditor 4中弄明白。

ckeditor ckeditor4.x ckfinder
1个回答
1
投票

你这样传递它们:

    var editor = CKEDITOR.replace( 'editor1', {
        language : 'en',        
    } );

    CKFinder.setupCKEditor( editor, {           
        test : 'testvalA',
        token : '7901a26e4bc422aef54eb45A',
        pass : 'token,test' 
    });

在上面的示例中,您将传递testtoken参数。

enter image description here


如果使用手动积分方法,则需要将参数附加到filebrowserXYZBrowseUrl配置设置,如下所示:

    var editor = CKEDITOR.replace( 'editor1', {     

        filebrowserBrowseUrl: '../ckfinder/ckfinder.html?id=abc&foo=bar&test=custom',
        filebrowserImageBrowseUrl: '/ckfinder/ckfinder.html?type=Images&id=abc&foo=bar&test=custom',
        filebrowserUploadUrl: '/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files&id=abc&custom=test',
        filebrowserImageUploadUrl: '/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images&id=abc&custom=test',
    } );

现在问题是CKFinder只传递预定义的集合或URL参数:idtyperesourceTypelangCodeCKEditorCKEditorFuncNum。如果您想使用更多参数,则需要手动将它们作为CKFinder配置设置传递,您需要在ckfinder/ckfinder.html文件中执行此操作(需要对其进行修改),例如:

<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
    <title>CKFinder 3 - File Browser</title>
</head>
<body>

<script src="ckfinder.js"></script>
<script>
    function getUrlParams()  {
            var vars = {};
            window.location.href.replace( /[?&]+([^=&]+)=([^&]*)/gi, function( match, key, value ) {
                vars[ key ] = value;
            } );

            return vars;
    }


    var params = getUrlParams(),
        config  = { pass : '' },
        ckfServicedParams = [ 'id', 'type', 'resourceType', 'langCode', 'CKEditor', 'CKEditorFuncNum' ];

    for( var key in params ){
        if ( ckfServicedParams.indexOf( key ) < 0 ) {
            config.pass = config.pass.concat( config.pass ? ','+key : key);
            config[key] = params[key];
        }
    }

    CKFinder.start( config ); 
</script>

</body>
</html>

笔记:

  • 如果您希望在使用CKEditor Image Dialog Upload选项卡上传文件时发送额外的参数,您还需要将它们添加到filebrowserXYZUploadUrl配置设置(您可以使用不同的参数,如上例所示)。
  • 请注意,这些参数并非完全动态。您可以在每个编辑器加载时定义它们一次,除非您使用编辑器销毁/创建编辑器实例或重新加载页面,否则无法在之后更改它们。
© www.soinside.com 2019 - 2024. All rights reserved.