How to handle file browse/upload

Supported Options

CKEditor natively supports different options according to what you want to browse or upload. This options should be URIs which point to your controllers. The available options are:

• filebrowserBrowseUrl
• filebrowserFlashBrowseUrl
• filebrowserImageBrowseUrl
• filebrowserImageBrowseLinkUrl
• filebrowserUploadUrl
• filebrowserFlashUploadUrl
• filebrowserImageUploadUrl

Custom Options

CKEditor also supports custom options which can be available if you install plugins. For example, the HTML5 video plugin adds the following options:

• filebrowserVideoBrowseUrl
• filebrowserVideoUploadUrl

To make the bundle aware of these new options, you can configure it globally in your configuration file:

1
2
3
4
5

# app/config/config.yml
fos_ck_editor:
    filebrowsers:
        - VideoBrowse
        - VideoUpload

Or you can configure it in your widget:

1
2
3
4
5
6

$builder->add('field', 'ckeditor', array(
    'filebrowsers' => array(
        'VideoUpload',
        'VideoBrowse',
    ),
));

Routing Options

To ease the CKEditor file handling, the bundle adds options which are not in CKEditor by default. These options are related to the Symfony Routing Component and allow you to configure routes instead of URIs. For each *Url option, three new options are available.

For example, the filebrowserBrowseUrl option can be generated with these three new options:

• filebrowserBrowseRoute
• filebrowserBrowseRouteParameters
• filebrowserBrowseRouteType

1
2
3
4
5
6
7
8

# app/config/config.yml
fos_ck_editor:
    default_config: my_config
    configs:
        my_config:
            filebrowserBrowseRoute:           "my_route"
            filebrowserBrowseRouteParameters: { slug: "my-slug" }
            filebrowserBrowseRouteType:       0

1
2
3
4
5
6
7

$builder->add('field', 'ckeditor', array(
    'config' => array(
        'filebrowserBrowseRoute'           => 'my_route',
        'filebrowserBrowseRouteParameters' => array('slug' => 'my-slug'),
        'filebrowserBrowseRouteType'       => UrlGeneratorInterface::ABSOLUTE_URL,
    ),
));

1
2
3
4
5
6
7
8
9
10
11
12
13
14

// A blog post...
$post = $manager->find($id);

$builder->add('field', 'ckeditor', array(
    'config' => array(
        'filebrowserBrowseHandler' => function (RouterInterface $router) use ($post) {
            return $router->generate(
                'my_route',
                array('slug' => $post->getSlug()),
                UrlGeneratorInterface::ABSOLUTE_URL
            );
        },
    ),
));

Integration with Other Projects

If you want to simplify your life, you can directly use other bundles which have already integrated the concept explain in the previous chapter.