Unable to attach pdf to a confluence page in forge custom UI App


I have a custom UI forge app in React. I am trying to attach a pdf file to the confluence page using the req.text() method as per the below question link-

Even though I am able to attach a file successfully with the code, It show’s nothing- no content (probably the data is corrupted or in the wrong format) when I try to view it.


// State
const [formdata, setformdata] = useState({file:undefined});

const changeFile = (newfile) => { setformdata({file:newfile}) }

// on form submit .. 
const handleSubmit = async (e) => {
let form = new FormData();
const arrayBuffer = await formdata.file.arrayBuffer()
const arr = new Uint8Array(arrayBuffer)
const blob = new Blob([arr], { type: "application/pdf" })
form.append("file", blob,'file.pdf')

const req = new Request("", {
 body: form,
 method: "POST",

req.text().then((body) => {
 requestConfluence(`/wiki/rest/api/content/${id}/child/attachment`, {
 method: "POST",
 headers: {
 'Content-Type': req.headers.get('content-type'),
 Accept: "application/json",
 "X-Atlassian-Token": "no-check",
 .then((response) => {
 console.log(`Response:`, response);


// Component
<input required accept="application/pdf" id="contained-button-file" type="file" onChange={(e)=> {changeFile(e.target.files[0])}} ref={fileRef} />

And If I use the standard invoke method, I get a response- 415, unsupported media type.

I was wondering if anyone has a workaround.