CORS Issue on uploading files to Workfront API using...

[shelly-goel]

Getting below error even though appropriate headers are set

Access to fetch at '<workfront url>/attask/api/v12.0/upload' from origin 'https://localhost:9080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

headers being set:

headers: {

        'apiKey': '<key>',

        'Content-Type': 'multipart/form-data',

        'Access-Control-Allow-Origin': '*'

      }

[duypnguyen]

@shelly-goel - the CORS policy is set by the server (workfront in this case), and you can not bypass it by changing your UI code.

The recommended route would be: write a Runtime action to call the workfront API, processes the data, and returns it to the UI for rendering.

[shelly-goel]

Yes we are trying with custom action as well but the uploaded file object becomes undefined in the custom action. It is available until actionwebinvoke but not after that. May I please request some sample code for upload functionality?

[duypnguyen]

Does the workfront API accept a URL to the file? I don't think using the Runtime action as a middleware to upload file is ideal because it makes the performance much worse, and the serverless action itself is not intended to handle files. Instead, the recommendation is to upload the files to Firefly Files SDK, get the files URL, and pass it over to Workfront.

You flow would be like this: UI calls Runtime action to get upload URL -> Action returns Files SDK URL -> UI uploads file to Files SDK and calls action to send it to workfront -> action calls Workfront API, referencing the file URL -> Workfront downloads the file from there and processes it.

[shelly-goel]

It doesn't accept the URL, it needs the file object. It accepts "multipart/form-data"

[duypnguyen]

ok, in that case you could still use the Files SDK to receive the file from the UI. When the Runtime action calls Workfront API, instead of simply giving the file URL, you would stream the file to the post request to upload in the "multipart/form-data" way. Here is a sample code from quick Google search: https://stackoverflow.com/questions/44021538/how-to-send-a-file-in-request-node-fetch-or-node.