How to use CDN within kirby 3?

Kirby 3
1

How to convert the path of the media, for example, convert url
http://www.mydomain.com/media/pages/home/2964623478-1565755442/product.png
to
http://cdn.mydomain.com/media/pages/home/2964623478-1565755442/product.png

2

Have a look at the keycdn plugin in the getkirby.com repo: https://github.com/getkirby/getkirby.com/tree/master/site/plugins/keycdn

3

Just add this plugin to the plugin directory?
Prompt error now:
Error
Class ‘Cachebuster’ not found

4

The Cachebuster class is in another plugin in that plugins folder. Of course, you have to adapt it to your purposes anyway. But yes, it has to go into the plugins folder.

5

I have installed this plugin and still complain about the same error.
Maybe where should I build the class Cachebuster?

6

Did you add the needed option(s) to the config file after adding both plugins?

7

You can also remove all these references to the Cachebuster plugin and use the paths you need. Once you got that working, you can check out if you want or need the cachebuster plugin or not.

For a test, I put both plugins into a Starterkit and didn’t get any errors messages regarding missing classes.

8

Thanks. Now my assets (css and js) path has changed.
But the path of the media has not changed.
site/plugins/cdn/index.php

<?php
Kirby::plugin('getkirby/cdn', [
    'components' => [
        'url' => function ($kirby, $path, $options, $original) {
            if (preg_match('!assets!', $path)) {
                if (option('cdn', false) !== false) {
                    return option('cdn.domain') . '/' . $path;
                } else {
                    return $original($path, $options);
                }
            } else {
                return $original($path, $options);
            }
        }
    ]
]);

site/config/config.php

<?php

return [
    'cdn' => [
       'domain' => 'http://files.emptyarea.com'
    ],
    'debug' => true,
];
9

That’s because your media files do not match the condition preg_match(''!assets!', $path). But I think for the files, you should probably use the file::url and file::version components like in the Cloudinary plugin.

10

Where is the Cloudinary plugin?
Sorry I am a designer, I am not very good at php coding.
Can you modify the above code directly? thank you.

my template:

<?php
$images =  $page->gallery()->toFiles();
foreach($images as $image): ?>
        <img data-src="<?= $image->url() ?>" alt="" data-uk-img>
<?php endforeach ?>

I just want convert image’s url like
http://www.mydomain.com/media/pages/home/2964623478-1565755442/product.png
to
http://files.mydomain.com/media/pages/home/2964623478-1565755442/product.png