Invalid image error using dataUrl in pdfmake

wonder95 picture wonder95 · Apr 11, 2017 · Viewed 13.5k times · Source

I'm using pdfmake to generate a PDF doc in an angular app, and just trying to add an image to the output using a dataURL (following the pdfmake docs.

        var docDefinition = {
          content: [
            {
              table: {
                widths: ['*'],
                body: [
                  [{text: 'Table text goes here', style: 'tableCellPadded'}]
                ]
              },
            },
            {
              image: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJgAAACHCAYAAADqQ...AABJRU5ErkJggg==",
              width: 152
            }
            '...various other text lines go here...'
          ],
          styles: {
            header: {
              bold: true,
              fontSize: 14
            },
            tableCellPadded: {
              margin: [0, 15, 0, 15],
              bold: true,
              fontSize: 14
            },
            note: {
              fontSize: 16,
              bold: true,
              italics: true
            }
          }
        };

However, when I attempt to print out the doc, I get this error in my console:

invalid image, images dictionary should contain dataURL entries (or local file paths in node.js)

As best as I can tell, I have the item entered correctly in the doc definition object, and my dataURL is valid (I've tested it in my browser). Is there something else I'm missing?

Thanks.

Answer

wonder95 picture wonder95 · Apr 11, 2017

OK, I'm chalking this one up to an ID-10-T error. My line with the base64 encoded URL is working fine. I found another line farther down in my doc definition object where I wasn't referring to the image properly, and that one was throwing the error.