Displaying an uploaded PDF

Camunda 7 Topics Discussion & Questions
,
1

Hello

I’m trying to display a PDF document in an embedded form, similarly to Camunda Platform 7 documentation | docs.camunda.org

I first upload both an image and a PDF document into process variables of type=file. I then display both on the subsequent User task.

Test-Files-UploadAndRender

However it’s not rendering the PDF. The same PDF document displays correctly when I reference it directly from the server’s file system as can be seen in point 3.

image
image401×502 15.1 KB

I’ve read camunda-7-code-examples/snippets/ecm-integrations/invoice-cmis/src/main/webapp/forms/approve-invoice.html at main · camunda-consulting/camunda-7-code-examples · GitHub and the forum topic https://forum.camunda.io/t/upload-multiple-files-in-embedded-form

Here is the form:

<form role="form">
	<ol>
		<li>PNG file as a process variable of type=file : Success</li>
		<input type="hidden" cam-variable-name="vFilePng"/>
		<img src="{{camForm.variableManager.variable('vFilePng').contentUrl}}"></img>
		<br>
		<li>PDF file as a process variable of type=file : Error</li>
		<input type="hidden" cam-variable-name="vFilePdf"/>
		<object data="{{camForm.variableManager.variable('vFilePdf').contentUrl}}" type="application/pdf"></object>
		<br>
		<li>The same PDF file on the server's file system : Success</li>
		<object data="Test-FileIO-02-File-01.pdf" type="application/pdf"></object>
	</ol>
</form>

Why can I not get this to work? Is it the encoding?

Many thanks for any guidance.

PS:
I’m currently using a workaround of first writing the process variable of type=file out to a temporary directory on the server’s FS and then referring to this temp file in the form

vFilePdfFN = camForm.variableManager.variable(‘vFilePdf’).valueInfo.filename;
$scope.vFilePdfPath = “temp/” + vProcessId + “/” + vFilePdfFN;

<embed src=“{{vFilePdfPath}}” type=“application/pdf”>

Has anyone else come across this limitation? How did you solve it?
Many thanks in advance.

2

I ran into a problem that had exactly the same outlook, but with the different error log. And I don’t know why: every time I’m trying to implement some features with PDF documents, regardless what workflow I use, I’m doing everything by the book and always failing. I’m more used to working with some dead simple tools like this one pdffiller.com and this is what I’m always expecting from them: let it be easy to understand and quite fast alongside. But yet everything I tried in order to make something similar was malfunctioning or pretty slow, so maybe I need some more things to learn about that

3

Hello,

The question is from some time ago and I could not see any remedy in the first search/run.
I will need almost the same functionality in a project that I’m working on. Did you find any solution?

Many thanks in advance
Tunç

4

Maybe taking a lot at this example could help you:
https://blog.camunda.com/post/2016/11/ecm-box-with-camunda/

5

I am trying something similar but to simply bind to an external PDF url that has been stored in a serialised url.
I can make it appear on an <a> tag, but am getting security issues when trying to embed with an iframe.

<iframe width="100%" height="300" ng-src="{{customerApplication.quoteDocumentURL}}"></iframe>

Error:

[$interpolate:interr] Can't interpolate: {{customerApplication.quoteDocumentURL}}
Error: [$sce:insecurl] Blocked loading resource from url not allowed by $sceDelegate policy.  URL

This is an angular issue, which is usually circumvented by loading application level plugins.

How would one achieve this in Camunda Tasklist?

6