External Images in jsreport Online



  • I'm using a script to build a dynamic grid of images in a report. While testing I used the code below to loop through an images array that referenced 'local' images already uploaded to jsreport studio. In production, that same array will be populated by a variable number images from a S3 bucket. I'm running into the error of the images being not found, although they are confirmed to be publicly accessible. I suspect that jsreport is reading the s3 links as a relative file locations, but I'm not sure how to change that in the online version.

    Any help would be greatly appreciated!

     var createNewRow = true;
        var firstImage = true
        
        {{#each images}}
        
        var i = {{0}}
        
        if(createNewRow){
            var table = document.getElementById("images");
            var row = table.insertRow(-1);
            var cell1 = row.insertCell(-1);
            cell1.innerHTML = "<img src= { #asset {{this}} @encoding=link }  /> <p>{{0}}</p> ";
            if(firstImage){
                createNewRow = false;
                firstImage = false
            } 
            
            else if(i % 2 == 0){
                createNewRow = false;
            }
            
            else{
                createNewRow = true;
            }
            
        }


  • Please try an html recipe and inspect with F12 what is actually outputted before pdf printing.
    How do the img tags look like?



  • Thanks for the quick response. Unfortunately, there's not much to inspect because of the error...i.e. no img tags at all:

    Error: Asset https://s3.amazonaws.com/***/****/***.png not found
        at readAsset (/usr/src/app/node_modules/jsreport-assets/lib/assets.js:226:15)
        at <anonymous>


  • Because you are using "https://s3.amazonaws.com///**.png" as asset name.
    In case it is a final link, why do you use an asset? You can use just html img

    <img src='https://s3.amazonaws.com/***/****/***.png'>
    <img src='{{this}}' />
    


  • Oy. Well this is embarrassing. I started with your proposed solution, and obviously I fat fingered something. This led me to the documentation, and I thought I needed to specify that it was a link. Obviously not. Thanks, Jan!


Log in to reply
 

Looks like your connection to jsreport forum was lost, please wait while we try to reconnect.