SAP / openui5

OpenUI5 lets you build enterprise-ready web applications, responsive to all devices, running on almost any browser of your choice.
http://openui5.org
Apache License 2.0
2.95k stars 1.24k forks source link

CSRF Card example does not run; functionality unclear #4030

Closed jvanattedev closed 4 months ago

jvanattedev commented 5 months ago

OpenUI5 version: 1.120

Browser/version (+device/version): Chrome 123.0.6312.106 (Official Build) (64-bit)

Running the sample in a VS Code project (other cards on our own server are working - Object, Table, OData requests...)

Code (slightly adapted toward using the Northwind service): { "_version": "1.36.0", "sap.app": { "id": "card.explorer.data.csrf.card", "type": "card", "title": "Sample for Data usage in Cards", "subTitle": "Sample for Data usage in Cards", "applicationVersion": { "version": "1.0.0" }, "shortTitle": "A short title for this Card", "info": "Additional information about this Card", "description": "A long description for this Card", "tags": { "keywords": [ "Data", "Card", "Sample" ] } }, "sap.card": { "type": "List", "configuration": { "destinations": { "ProductsMockServerWithCSRF": { "name": "ProductsMockServerWithCSRF", "label": "Products Mock CSRF", "defaultUrl": "https://services.odata.org/V3/Northwind/Northwind.svc/" } }, "csrfTokens": { "token1": { "data": { "request": { "url": "{{destinations.ProductsMockServerWithCSRF}}/Token", "method": "HEAD", "headers": { "X-CSRF-Token": "Fetch" } } } } } }, "data": { "request": { "url": "{{destinations.ProductsMockServerWithCSRF}}/Products", "parameters": { "$format": "json", "$top": 4 }, "method": "GET", "headers": { "X-CSRF-Token": "{csrfTokens>/token1/value}" } }, "path": "/data" }, "header": { "title": "Products", "subTitle": "Weight Information", "icon": { "src": "sap-icon://product" } }, "content": { "item": { "title": "{Name}", "info": { "value": "{= format.unit(${Weight}, ${WeightUnit})}" } }, "maxItems": 4 } } }

Adapted to a working version (showing data from Northwind, but no CSRF): { "_version": "1.36.0", "sap.app": { "id": "card.explorer.data.csrf.card", "type": "card", "title": "Sample for Data usage in Cards", "subTitle": "Sample for Data usage in Cards", "applicationVersion": { "version": "1.0.0" }, "shortTitle": "A short title for this Card", "info": "Additional information about this Card", "description": "A long description for this Card", "tags": { "keywords": [ "Data", "Card", "Sample" ] } }, "sap.card": { "type": "List", "configuration": { "destinations": { "ProductsMockServerWithCSRF": { "name": "ProductsMockServerWithCSRF", "label": "Products Mock CSRF", "defaultUrl": "https://services.odata.org/V3/Northwind/Northwind.svc/" } }, "csrfTokens": { "token1": { "data": { "request": { "url": "{{destinations.ProductsMockServerWithCSRF}}", "method": "HEAD" } } } } }, "header": { "title": "Products", "subTitle": "Weight Information", "icon": { "src": "sap-icon://product" } }, "content": { "data": { "request": { "url": "{{destinations.ProductsMockServerWithCSRF}}/Products", "parameters": { "$format": "json", "$top": 4 }, "method": "GET" }, "path": "/value" }, "item": { "title": "{ProductName}", "info": { "value": "{UnitsInStock}" } }, "maxItems": 4 } } }

What is the expected result? The sample runs. The CSRF token is requested, returned and available in the card parameters.

What happens instead? Console error: TypeError: Cannot read properties of undefined (reading 'request') at c.getDetails (RequestDataProvider-dbg.js:516:62) at i._triggerDataUpdate (DataProvider-dbg.js:204:39)

Any other information? (attach screenshot if possible) According to your own documentation of the List card (and other cards), there should be a "data" section in the "content" part. This is missing in the sample.

NHristov-sap commented 5 months ago

Hello @jvanattedev ,

Please provide live isolated example that demonstrates the issue.

Best Regards, Nikolay Hristov UI5 GitHub Dispatcher

jvanattedev commented 5 months ago

Hello @jvanattedev ,

Please provide live isolated example that demonstrates the issue.

Best Regards, Nikolay Hristov UI5 GitHub Dispatcher What exactly do you mean with 'live isolated example'?

NHristov-sap commented 5 months ago

Hi @jvanattedev ,

It means that we need a working code placed somewere on a public host, that demonstrates the isuue you want to report, something like https://jsbin.com/.

Best Regards, Nikolay Hristov UI5 GitHub Dispatcher

niyap commented 4 months ago

Hello,

Since there is no response from the author for more than 4 weeks I'm closing the ticket.

Kind Regards, Niya