Processing PDF binary data stream in Checkout UI Extension

Checkout UI Extensions

I’m trying to achieve the following

  • Fetch a application/octet-stream binary stream that contains data for a PDF file
  • Convert the binary data to a real PDF file

The above should happen on a button click and afterwards actually download the file in the client’s browser.

I’ve managed to connect to the API and get the binary data response and use pdf-lib node module to convert it to a PDF blob.

I have some issues actually getting the final file and also downloading it, as we can’t add HTML or use the window object - as far as I know.

@curzey
So do you want to display PDF preview right inside the checkout or you just want buyer to download the file?

For now, I think the preview PDF file inside checkout page is not possible.
If you just want to create a blob to download PDF file, I think you can simply create a link button > open a webpage > and you can build a simple blank page to trigger download. Is it correct?

You cannot add HTML or window to checkout page.

Hi @juzser - thanks for replying!

It’s actually the download button I want to achieve. Are you suggesting creating a Polaris button that routes to a Full Page Extension?

Just for clatification; you mention checkout. I know it’s mostly the same, but I’m talking Customer UI extension :blush:

@curzey
Yes, Customer UI is the same.
And yes, maybe Full Page Extension can help.

You can simply using Link component with external prop > open a webpage as Full Page Extension or a separate webpage built via your own system.

Maybe there is a problem with token and auth, but I think it’s the only way.

1 Like

It’s an interesting possibility that I have not tried. Thanks for the tip.