Pdfkit: Adding images doesn't work in the browser

[edmelly]

Using Browserify width PDFKit works great, but there's an issue with brfs when trying to add an image (see https://github.com/substack/brfs/issues/36).

Trying to add an image gives you this in the console:

TypeError: fs.readFileSync is not a function

Basically, the transform for fs.readFileSync() only works when a string is the first parameter. Line 30 of image.js seems to be the problem:

data = fs.readFileSync(src);

Try adding any image to the demo and you get the same thing. The issue referenced above in the brfs repo has been open since October and doesn't sound trivial. Any suggestions for a way round this problem?

[Janneman84]

I also experienced this problem and managed to fix it by adding a little tweak to the library. I'd probably be nice if someone added this tweak to the next version of the library so this won't be a problem to so many people anymore.

You can read about the tweak at my post in this issue: #371.

It adds an extra line, marked by //START NEW and //END NEW

[simonbernard]

There is a simple workaround when using browserify.

require('buffer');
var arraybuffer = 'image from server';
doc.image(new Buffer(arraybuffer));

It worked fine for me.

[itditp]

Thanks a lot, simonbernard!
You saved me.

[Topiya]

@simonbernard @itditp Can you please let know how to use browserify to use given solution by simonbernard ?

[blikblum]

Here's an example: https://jsfiddle.net/rkolasie/6xxmLa38/