TinyMCE 4 and image url's

Question

I'm storing all of my images / videos above webroot, which means that the image is not found in the editor and it wont render. This is a problem. To display an image from the webroot, I have a function that is accessed like this: http:://mytestsite.com/getImage/k=generated_hash&photo=myphoto.jpg

When I add a photo to TinyMCE's wysiwyg, I need the source url changed from /home/media/myphoto.jpg to the example above. If i paste the link as the image source, it works flawlessly - I am just unsure how to make it happen automatically.

Any ideas?

Answer 1

In your tinymce.init, you could call a function that executes on change, and then run a regex to replace the filepath with that function url? like so:

tinymce.init({
    setup : function(ed) {
        ed.on('change', function(e) {
            // call your regex function here
            // or in php maybe an ajax call to a function?
        });
    }
});