0 bytes when uploading PDF through API

Question

I am using Webflow and Wized to upload a file to Dropbox however when I upload the file the response says size 0 and in dropbox it says 0 bytes and I can't open it.

const contentToCapture = document.querySelector('.pdf-content');

html2canvas(contentToCapture, { scale: 0.75 }).then((canvas) => {
        const base64image = canvas.toDataURL('image/png');
        const pdf = new jsPDF('p', 'px', [canvas.width, canvas.height]);
        pdf.addImage(base64image, 'PNG', 0, 0, canvas.width, canvas.height);

const pdfBlob = pdf.output('blob');
        v.pdf_data = pdfBlob;
    });

Above is how I create the pdf and convert it to a blob. The pdf itself works fine when I download it.

This is how the request is set up.

Greg-DB · Accepted Answer

The Dropbox API /2/files/upload endpoint is a "content-upload" type endpoint, meaning it accepts the file data to upload in the request body (as application/octet-stream). So, when uploading file data that way, make sure your network client is sending the desired file data in the request body.

We can't provide support for third party platforms or tools themselves such as Webflow or Wized, as those aren't made by Dropbox, so you may need to refer to the documentation for those for information on how to configure them accordingly. Looking at the screenshots you shared though, I see for "Body" you have a Key/Value pair, which may not be the configuration you need, since there wouldn't be any sort of "file" parameter or key; the entirety of the request body should be the raw file data.