Enable CORS on apache-tomcat-7.0.78 standalone webApp

Camunda 7 Topics Discussion & Questions
1

Hi,

I know that this question is often asked but I havn’t found any solution for me.

When I try to display a form with the camunda-bpm-sdk.js I got this error :

XMLHttpRequest cannot load embedded:engine://engine/:engine/task/0c863ad1-3c90-11e7-88c7-f8bc126c9c70/rendered-form?noCache=1495197520366. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

and

Uncaught Error: Origin is not allowed by Access-Control-Allow-Origin
at Request.crossDomainError (camunda-bpm-sdk.js:11124) []
at XMLHttpRequest.xhr.onreadystatechange (camunda-bpm-sdk.js:11189) []
at XMLHttpRequest.wrapFn [as __zone_symbol___onreadystatechange] (zone.js:1230) []
at XMLHttpRequest.ZoneTask.invoke (zone.js:460) []
at ZoneTask.scheduleTask [as scheduleFn] (zone.js:2167) []
at :8080/camundApp/test2/dist/polyfills.bundle.js:4799:25 []
at XMLHttpRequest.send (eval at createNamedFn (zone.js:1587), :3:31) []
at Request.end (camunda-bpm-sdk.js:11252) []
at HttpClient.load (camunda-bpm-sdk.js:404) []

The solution often proposed is to add CORS filter on the engine-rest/web-inf/web.xml but there is no engine-rest on standalone webapp so I tried to add the CORS filter on camunda/web-inf/web.xml (web.xml (6.8 KB)
) but it’s don’t work.

When I retrieve the form by this way :

let url = ‘http://localhost:8080/camunda/api/engine/engine/default/task/0177ae61-3bd6-11e7-bd7b-f8bc126c9c70/rendered-form?noCache=1495117727268’;
let headers = new Headers();
headers.append(‘Accept’, ‘application/json, text/plain, /’);
headers.append(‘X-Authorized-Engine’, ‘default’);
let options = new RequestOptions({headers: headers, withCredentials: true});
this.http.request(url, options).map(function (response) {
return (response);
}).subscribe(function (response) {
console.log(response);
}, function (err) {
console.log(err);
});

it’s working, so did I have to ignore the camunda-bpm-js or did someone know other solution ?

Thanks for reading and probably sorry for bad english :smile: .
Romain.

2

Currently It’s work like this with the sdk :

this.http.get(‘http://localhost:8080/camunda/api/engine/engine/default/task/’ + task.id + ‘/form’)
.map(response => response.json()).subscribe(
res => {
url = “http://localhost:8080/camunda/api/engine/engine/default/”
+ res.key.substring(res.key.indexOf(‘:engine/’) + 8, res.key.length);
that._camSDK.loadTaskForm(task, that.form, that.onSubmit.bind(that), url);
},
error => console.error('Error: ’ + error),
() => that.chRef.detectChanges()
);

then

loadTaskForm = function (task, formDiv, cb, url) {
let that = this;
new camSDK.Form({
client: that.camClient,
formUrl: url, /* url retrieve by rest api /
taskId: task.id,
containerElement: formDiv.nativeElement , / my div */
done: cb
});
};

Seems like getting the form url like this :

this._taskService.form(task.id, function (err, taskFormInfo) {
if (err) {
throw err;
}
let url = taskFormInfo.key.replace(‘embedded:app:’, taskFormInfo.contextPath + ‘/’);

retrieve a Cross Origin error while using the URL from the rest API don’t.

Romain.