Absolute href and src url's are appended with a request uri using BlueImp jQuery fileupload

Question

Using the fileupload plugin I successfully upload images to my server.

Normally I get a relative url back which is then shown using blueimps template engine like this (The entire template is shown below) : <img src="{%=file.thumbnailUrl%}">.

But now after a succesful upload I send it to my Cloudinary CDN and save an absolute URL. If my template tries to print that like this {%=file.thumbnailUrl%} I get something like https://res.cloudinary.com/myaccount/image/upload/c_fit,w_80,h_80/601/fjb36qly9uwulapgnk6d.jpg which is fine BUT if I print the exact same thing in an img src or href it's appended by /mytestmap/. I have been fighting with this for hours now.

How can I use absolute url's with jQuery fileupload?

The entire javascript template

<script id="template-download" type="text/x-tmpl">
    {% for (var i=0, file; file=o.files[i]; i++) { %}
    <tr class="template-download fade downloadable">
    <td>
    <span class="preview">
    {% if (file.thumbnailUrl) { %}
        <a href="{%=file.url%}" title="{%=file.name%}" download="{%=file.name%}" data-gallery>
             <img src="{%=file.thumbnailUrl%}">
        </a>
    {% } %}
    </span>
    </td>
    </tr>
    {% } %}
</script>

Answer 1

I've had this problem before and after trying several things, I found a solution:

You have to replace:

<img src="{%=file.thumbnailUrl%}">

with

<img src='{%=file.thumbnailUrl%}'>

the single quotes will fix it. I never understood why, but it worked for me. You have to use single quotes for every url.