How to pass process instance variables into External Forms, and display them there?

[ClaraPaiva]

Hello,

I have a Spring Boot application back-end module that launches Camunda 7 embedded engine, and a front-end module that hosts Vue.js forms,
for ex. http://localhost:8082/categorize_document .

I mean that one of the User Task contains a form that is that custom vue.js made form categorize_document.
But in certain parts of the form, I want to pre-populate fields with values that come from the precedent tasks in the workflow. Let’s say I want to have an uploaded document (variable: uploadedDocument) travelling through the workflow and I want to display it in this step.

The step that contains the external form is:
<bpmn:userTask id=“UserTask_Select_Category” camunda:formKey=“http://localhost:8082/CU3_categorize_document” camunda:candidateGroups=“(…)”>
bpmn:incomingFlow_1opn6ve</bpmn:incoming>
bpmn:incomingFlow_1xno0u3</bpmn:incoming>
bpmn:outgoingFlow_145cdgb</bpmn:outgoing>
<camunda:inputParameter name=“numPages”>${numPages}</camunda:inputParameter>
</bpmn:userTask>

I see in Camunda TaskList that once we go over the “Open external form”, the link is, similarly to what is documented in External Tasks Forms section of documentation page User Task Forms | docs.camunda.org : http://localhost:8082/CU3_categorize_document?taskId=2999f576-7989-11ee-a6c3-c85ea9e46d0d&callbackUrl=http://localhost:8080/camunda/app/tasklist/default/#/)

I actually use that taskId that Camunda Tasklist passes by default, in my vue.js form (I do a REST call to Camunda API /complete task endpoint), so I need it.

I tried to edit the URL in the .bpmn for it to pass the uploadedDocument through there,
camunda:formKey=“http://localhost:8082/CU3_categorize_document?${uploadedDocument}” but that not only breaks the form, but also doesn’t let taskId go into the form anymore.

So if it’s not through the workflow/bpmn, how can I retrieve, from the external form, the variable content from the workflow?

I’m also not able to use Camunda REST API to do that, because it’s only possible querying it with the process instance ID (and for that piece of information: I also only can make it available in the workflow, but I don’t know how to pass it to the vue.js form)

So the question is basically: how should I do to pass and use a variable from the Camunda process into an external form referrenced by a User task, and display it there in that Front-end?

[StephanHaarmann]

Hello @ClaraPaiva and welcome to the forum,

The REST API offers an endpoint that allows you to fetch the variables with the task ID:
https://docs.camunda.org/rest/camunda-bpm-platform/7.20/#tag/Task-Variable
Does this help you?

Regards,

Stephan

[ClaraPaiva]

Hello Stephan,

I thought it would not work, but it did!, thank you.

At first glance through that documentation page, I would just expect that my web request to Camunda Platform REST API:

axios
.get(http://localhost:8080/engine-rest/task/${this.taskID}/variables)

would return the current task variables, but as I test and read it properly, I get that it returns all the vairables (including the ones from previous tasks) visible from that task.

Thanks!