jspdf - pdf uploaded directly to s3 with png, png is corrupt

Question

I am using the jspdf library along with Angular 5 to generate a PDF on the client side. I am adding a png image to the pdf.

I have generated my .png file using dataurl.net. When I add it to the pdf and use doc.save(), it downloads locally and it looks great and works perfectly. However, I am trying to upload it directly to s3, using doc.output() instead, and when it gets there it looks like this: https://i.sstatic.net/yHP6B.jpg

My code to PUT in to s3 looks like this:

const headers = new HttpHeaders().set('Content-Type', 'application/pdf')
this.http.put(url, file, {headers})

with file = doc.output()

Anyone have any ideas of what may cause this?

Answer 1

I had to pass the ArrayBuffer to s3 to get it to work.

So the only code change was using doc.output('arraybuffer')