CSRF Token Validation - Appgyver to SAP S/4

Hi,

We are trying to create an webapp which makes CRUD Requests to SAP Backend system through the OData Integration method. Currently we are able to list the records from backend system without any issue after configuring the CORS in gateway.

While making an POST/PATCH Request to backend system, we are facing the CSRF Token Validation Failed error. We did come across an similar Post where the CSRF Token was first fetched and then sent in subsequent requests. We did implemented this method as well, but still the same issue is happening.

We also validated that the same CSRF Token is being passed that is set in the app variable.

Hence could anyone please help us in this regard?

Thanks,
Bharti

Hello, you need to fetch the session cookie alongside the x-csrf-token when issuing the GET HTTPRequest. The session cookie header is there to assert the validity of the x-csrf-token itself; So you will need to pass both the fetched session cookie and the x-csrf-token itself in the subsequest POST/PATCH/PUT/DELETE call. I hope that helps; Piotr

Hi Piotr,

Thanks for your reply. May I know how can we fetch the session cookie along with the X-CSRF_TOKEN because the HTTP Request output doesn’t seem to contain the cookie header, even though the actual response of the CSRF-TOKEN get request has the set-cookie value returned.

Regards,
Bharti

you can use this blog post of mine: 403 when trying to create user with the SCIM REST API | SAP Blogs as described you will need to fetch the JSESSIONID set-cookie content from the GET call and then pass it as a Cookie header alongside the x-csrf-token header. You will find clear code snippets in my blog above; I hope that helps;

PS. I would assume if you write a formula with outputs[‘HTTP request’].resHeaders[“set-cookie”] that will do.

Hi Pitor,

I tried adding a custom javascript module to fetch the x-csrf-token and cookie, but the response headers doesn’t contain the set-cookie header even though its visible in the chrome developer tools.

I even tried the formula which you had mentioned, but it was also returning null value. Is there any other header which needs to be added to get the cookie visible in response headers?

Thanks,
Bharti

The server side cookies are just headers. The name of the header is set-cookie
This header may contain several cookies. The one you are interested in is called JSESSIONID

Can you try the following in JS:

const cookies = await response.headers.get(“set-cookie”);

and then extract the value of JSESSIONID cookie ?

PS. Quoting after Using the Fetch API - Web APIs | MDN

  • Unless fetch() is called with the credentials option set to include, fetch():
    • won’t send cookies in cross-origin requests
    • won’t set any cookies sent back in cross-origin responses

Hi Piotr,

When I tried the fetch request with credentials option being set to include, the set-cookie headers are not visible even in the chrome debugger tool for the GET CSRF token request and the result of using the below code was Null value in the app variable where it is being set.

But when the credentials:include option is removed, the set-cookie is visible again in the headers, but is still inaccessible in the JavaScript code resulting in setting the cookie variable value as Null again.

Is there anything else needs to be done/added during the CORS config of sap gateway using UCONCOCKPIT also?

Also adding a screenshot of the PREFLIGHT request with the response headers if its any helpful

Thanks a ton,
Bharti

OK. I think I understand why you cannot retrieve set-cookie headers from java script;
It looks like this is by design as set-cookie is HTTP only and secure. In other words it is a server-side cookie.

  1. HTTP ONLY (Secure) cookies cannot be accessed in JavaScript. If you try to read some token, etc from a secure cookie it’s not going to work.

PS. I am typically implementing all the SAP S/4HANA OP or S/4HANA Cloud APIs in a proxy outside of SAP Appgyver.