If you are a beginner and unfamiliar with Custom APIs, refer to this article: [Step by Step] Create and call Global Custom API
To understand PCF Controls, refer to this article: [Step by Step] Beginner : Create a PCF control
In this article, I will provide a code snippet demonstrating how to call a Custom API from a PCF control.
Here is the skeleton of my Custom API plugin class and the details of my Custom API:
- Name : raj_docupilotmetadataapi
- Input Parameter Name : raj_inputjson
- Output Parameter Name : raj_metadataoutput

Now that we know the structure of the Custom API, here is the code snippet to call raj_docupilotmetadataapi from a PCF project using webAPI.execute:
export const callCustomAPI= async (
inputParamValue: string
): Promise<string> => {
try {
const apiRequest = {
getMetadata: () => ({
operationType: 0,
operationName: "raj_docupilotmetadataapi",
parameterTypes: {
cat_inputjson: {
typeName: "Edm.String",
structuralProperty: 1,
},
},
}),
cat_inputjson: inputParamValue,
};
console.log(`Calling custom action 'raj_docupilotmetadataapi' with Input Parameter: ${inputParamValue}`);
//@ts-expect-error Suppressing type error due to custom Web API call
const response = await this.context.webAPI.execute(apiRequest);
const jsonResponse = await response.json();
console.log(`Custom action response: ${JSON.stringify(jsonResponse)}`);
// Extract and return the 'raj_metadataoutput' field
return jsonResponse.raj_metadataoutput|| "";
} catch (error) {
console.error(`Error calling custom action`, error);
throw error;
}
};
The above code snippet works for triggering a Custom API with a single parameter. You will need to tweak the function to pass multiple input parameters.
🙂


Leave a reply to inspiring1f94c03735 Cancel reply