Hello,
Please follow the documentation guide - Creating Cloud Portal Widgets in the SAP Web IDE
By using one of the templates, the opensocial spec xml is going to be created automatically. Make sure the first checkbox is checked (SAP UI5 integration [sap-xhrwrapper]). This feature is responsible to overcome cross domain problems.
Once the application is deployed to HCP, you will be able to see it under HTML5 Application menu entry in the cockpit.
Make sure you are activating it and setting a version (can also be done when deploying via Web IDE).
Now, follow step #6 in the guide to create a widget in cloud portal and you are ready to go.
Regards,
Eliel.