PDF Sending to REST API with JavaScript in SAP Build Apps

Hi folks, in this blog post I will show how PDF documents can be posted to REST APIs.

First we need to add a button then click on the button you added and open canvas logic editor.

First insert a file picker and select the file type you want to select.

Then insert a JavaScript script.

At the inputs field add your URL and Token by hand. Then add your file from output of your File Picker. My service returns me an ID attribute and I want to return it that’s why I added also an “id” variable to my outputs on the right.  

My full script is here:

let url = inputs.url
let file = inputs.file
let Token = inputs.Token
let path = await fetch(file[0].path)
let blob = await path.blob()

const formData = new FormData()
formData.append(‘file’, blob, file[0].name)

var lv_options = {
“schemaId”: “*********************”,
“templateId”: “***************************”,
“clientId”: “default”,
“documentType”: “custom”,
“receivedDate”: “2024-05-06”
}
formData.append(‘options’,JSON.stringify(lv_options))

const response = await fetch(url, {
method: ‘POST’,
headers: {
“Authorization”: “Bearer ” + Token
},
body: formData
})
if (response.ok) {
let data = await response.json();
return { id: data.id };
} else {
alert(“HTTP-Error: ” + response.status);
}

Then I set the “id” attribute returned from POST response to an app variable.

It can be done with putting this formula to Assigned value section of Set app variable node’s properties:

outputs[“POST”].id

And our app is ready to run. You can monitor POST request results on browser with F12.

Please comment on this blog post if you have any questions or recommendations.

​ Hi folks, in this blog post I will show how PDF documents can be posted to REST APIs.First we need to add a button then click on the button you added and open canvas logic editor.First insert a file picker and select the file type you want to select.Then insert a JavaScript script.At the inputs field add your URL and Token by hand. Then add your file from output of your File Picker. My service returns me an ID attribute and I want to return it that’s why I added also an “id” variable to my outputs on the right.  My full script is here: let url = inputs.url
let file = inputs.file
let Token = inputs.Token
let path = await fetch(file[0].path)
let blob = await path.blob()

const formData = new FormData()
formData.append(‘file’, blob, file[0].name)

var lv_options = {
“schemaId”: “*********************”,
“templateId”: “***************************”,
“clientId”: “default”,
“documentType”: “custom”,
“receivedDate”: “2024-05-06”
}
formData.append(‘options’,JSON.stringify(lv_options))

const response = await fetch(url, {
method: ‘POST’,
headers: {
“Authorization”: “Bearer ” + Token
},
body: formData
})
if (response.ok) {
let data = await response.json();
return { id: data.id };
} else {
alert(“HTTP-Error: ” + response.status);
} Then I set the “id” attribute returned from POST response to an app variable.It can be done with putting this formula to Assigned value section of Set app variable node’s properties: outputs[“POST”].id And our app is ready to run. You can monitor POST request results on browser with F12.Please comment on this blog post if you have any questions or recommendations.   Read More Technology Blogs by Members articles 

#SAP

#SAPTechnologyblog