TinyMceEditor - Remove forward slash in img src

Question

Im using the TinyMce editor in a forums software and I want to upload images into forum posts. Uploading etc.. works fine however every time I upload an image it adds the in the html like below:

<img src="/http://localhost/MvcForum.WebImages/uploads/xxx/nb4pbdre-paddington.jpg?width=690&amp;upscale=false" alt="" />

The problem is the initial forward slash /. This make the image not appear in the TinyMcs editor. If i manually remove it the image displays fine.

I know I could use the relative paths configuration and this would work. However I've multiple forums and they all save images to a central location thus I want to use absolute path. (I hope my terminology is correct there!)

The settings for my TinyMce editors are in snippet below. I believe the key settings are:

convert_urls: false, relative_urls: false, remove_script_host: false

Ive tried various combinations of above with no luck. Any help with removing the initial forward slash in the img src would be great?

settings = extend({
        id: id,
        theme: 'modern',
        delta_width: 0,
        delta_height: 0,
        popup_css: '',
        plugins: '',
        add_form_submit_trigger: true,
        submit_patch: true,
        add_unload_trigger: true,
        document_base_url: "",
        convert_urls: false,
        relative_urls: false,
        remove_script_host: false,
        object_resizing: true,
        doctype: '<!DOCTYPE html>',
        visual: true,
        font_size_style_values: 'xx-small,x-small,small,medium,large,x-large,xx-large',

        // See: http://www.w3.org/TR/CSS2/fonts.html#propdef-font-size
        font_size_legacy_values: 'xx-small,small,medium,large,x-large,xx-large,300%',
        forced_root_block: 'p',
        hidden_input: true,
        padd_empty_editor: true,
        render_ui: true,
        indentation: '30px',
        inline_styles: true,
        convert_fonts_to_spans: true,
        indent: 'simple',
        indent_before: 'p,h1,h2,h3,h4,h5,h6,blockquote,div,title,style,pre,script,td,th,ul,ol,li,dl,dt,dd,area,table,thead,' +
            'tfoot,tbody,tr,section,article,hgroup,aside,figure,figcaption,option,optgroup,datalist',
        indent_after: 'p,h1,h2,h3,h4,h5,h6,blockquote,div,title,style,pre,script,td,th,ul,ol,li,dl,dt,dd,area,table,thead,' +
            'tfoot,tbody,tr,section,article,hgroup,aside,figure,figcaption,option,optgroup,datalist',
        validate: true,
        entity_encoding: 'named',
        url_converter: self.convertURL,
        url_converter_scope: self,
        ie7_compat: true
    }, defaultSettings, settings);cdcc

gisWeeper gisWeeper · Accepted Answer · 2019-02-26T09:36:00

I found the problem. The fourms software that Im using is an Open Source solution (MvcForums) and it uses the TinyMce editor. It uses the ImageUploag plugin which has a js script to handle image uploads. Within this custom script a line of code was appending \ to the start of the image url. I have edited this script and now it works. See image below

TinyMceEditor - Remove forward slash in img src

1 Answers