SAP C4C - Mashups

This section shows how to create a Mashup Web Service and use the service in HTML Mashup.

In Studio, you can create Mashup Web Services that can then be integrated into a data or HTML mashup.

RSS/Atom, REST, SOAP, and OData Web services are supported.

Steps:

1. Set your default web browser to Internet Explorer. SAP Cloud Application Studio will launch the browser whenever Create/edit mashup is clicked and something may go wrong in a different browser.

2. Open SAP Cloud Application Studio, create or open some solution and in Solution Explorer click the Add New Item icon > REST Mashup Web Service > click Add.
   

3. In the web browser window that appears set the authorization, protocol, HTTP Method and URL of the service.
   Query parameters are recognized, but if it is needed to change parameters inside URL path, use curly brackets around the terms. 

4. Click Extract Parameters.
   URL: https://my326067.crm.ondemand.com/sap/byd/odata/v1/c4codata/OpportunityCollection('{OpportunityID}')/OpportunityProduct
   

5. Create a new HTML Mashup, click Add REST Service in HTML Code Editor, search the web service in the dialog, click OK and a new Javascript is added to the HTML source.
    There can be syntax errors in the code:

   • Replace slashes in function names, example: function callService_YOEAM3LMY_MAIN/PW00002() { > function callService_YOEAM3LMY_MAIN_PW00002() {

   • onComplete and onError values of callService must be quoted, example: onComplete:serviceCallback_YOEAM3LMY_MAIN_PW00002 > onComplete:'serviceCallback_YOEAM3LMY_MAIN_PW00002

   • Add parameter values, example: parameter: {'{OpportunityID}': '00163E703A9E1ED98EE7C02D59A613FE'}
     

     Call Mashup REST Service Example

     <script type="text/javascript"> function callService_YOEAM3LMY_MAIN_PW00002(opportunityID) { sap.byd.ui.mashup.callService({ serviceId: 'YOEAM3LMY_MAIN/PW00002', parameter: {"{OpportunityID}": opportunityID}, onComplete:'serviceCallback_YOEAM3LMY_MAIN_PW00002', onError: 'serviceErrorHandler_YOEAM3LMY_MAIN_PW00002' }); }; function serviceCallback_YOEAM3LMY_MAIN_PW00002(data) { console.log("serviceCallback_YOEAM3LMY_MAIN_PW00002"); console.log(data); } function serviceErrorHandler_YOEAM3LMY_MAIN_PW00002(data) { // put your code here to handle exception occured } callService_YOEAM3LMY_MAIN_PW00002('00163E703A9E1ED98EE7C02D59A613FE'); </script>