Skip to Content
Author's profile photo Chaim Bendelac

Developing with XS Advanced: Create a SAP HANA based client-server application



TinyWorld – Part 3


Create a SAP HANA based client-server application

/wp-content/uploads/2016/03/image001_916484.png

Hello again!

In part 2 (Get started with the SAP Web IDE for SAP HANA) of this TinyWorld tutorial we learned how to create a project, and create, build and run application modules. Here, in part 3, we will extend our application to actually do something more useful.

NOTE: In the following, you will need to update the MTA descriptor file – mta.yaml. The YAML syntax is indentation-sensitive, and you should always use spaces, never tabs. The role of the mta.yaml file is further explained in part 7 (Under the hood).

Advanced HANA development

Using the CDS graphical editor

You can use the CDS text editor, introduced in part 2, to create large and complex data models, but you can also use the CDS graphical editor, side by side with the text editor. Right-click tinyf.hdbcds > “Open with > Graphical Editor” to see:

/wp-content/uploads/2016/03/image008_916243.png

Click the (left-most) Add-Entity icon to create a new entity, and call it country. This will bring up the columns and associations wizard. Click the “+” to add a new column (field), rename it name, change the Data Type to “String”, enter a length of 100 and mark it as a key column.

Then click the “Associations” tab, and add a new association. Rename it partof. Under “Target Entity”, select the world entity. Now click “< Back” to the main tree view; you should have the following model:

/wp-content/uploads/2016/03/image009_916457.png

Save it (CTRL/S). You can switch to the CDS text editor tab to see the same mode in text form:

  /wp-content/uploads/2016/03/image010_916458.png

We created a data-model with two associated entities. Next: rebuild it (see part 2 for details). You will notice in the console that only this file is incrementally built, since the other files didn’t change.

Using the HANA Run Time Tools

Open the HANA RTT in your browser (see part 1, A TinyWorld Tutorial – Introduction , where it was introduced). To review the tables we just created, you may first need to bind to the HANA database container in which they were created:

/wp-content/uploads/2016/03/image011_916459.png

Press the “Search HDI Containers” icon, and bind to the appropriate tinyworld workspace container (called something like <your user name>…tinyworld-hdi-container). Now, open the “Catalog > workspace… > Tables”, and you will see the two tables that we just created, respectively called “tinyworld.tinydb::tinyf.world” and “tinyworld.tinydb::tinyf.country”. You can now open the SQL console (right click on your container and select Open SQL Console) , and enter some data, for instance:

INSERT INTO "tinyworld.tinydb::tinyf.world" VALUES ('Europe');

INSERT INTO "tinyworld.tinydb::tinyf.world" VALUES ('Asia');

INSERT INTO "tinyworld.tinydb::tinyf.country" VALUES ('Spain', 'Europe');

INSERT INTO "tinyworld.tinydb::tinyf.country" VALUES ('Japan', 'Asia');

INSERT INTO "tinyworld.tinydb::tinyf.country" VALUES ('Denmark', 'Europe');

(Run it by pressing /wp-content/uploads/2016/03/image012_916463.pngin the toolbar). You can check it out, for instance like this:

SELECT * FROM "tinyworld.tinydb::tinyf.country" WHERE "partof.continent" = 'Europe'

Adding a Calculation View to the model

In this step, we use the SAP HANA modeler to graphically add a Calculation View to show only European countries.

Navigate to the src/ subfolder of the tinydb/ module folder, right-click “> New > Calculation View”. Call it, for instance myview, select “Data Category” as “Dimension” from the dropdown and click “CREATE”. Wait a few seconds, until you see:

  /wp-content/uploads/2016/03/image013_916465.png

From the toolbar, click the /wp-content/uploads/2016/03/image014_916466.png (Create Projection) icon once, and then (without holding the mouse button) move your mouse to an empty space below the existing projection on the canvas and click again, to create a new projection, called Projection_1. Select it, and “drag” the little arrow that appears on the right to the bottom of Projection, to connect them:

/wp-content/uploads/2016/03/image015_916467.png

Now, let’s create the projection in order to show the results only for European countries. Select the Projection_1 node. On the “mapping” tab on the right, click the “+“; a search wizard will appear. Enter tiny to search for the tables that we created in part 2. Select tinyworld.tinydb::tinyf.country in the search results, and click “Ok”. We first want to connect the “Data Sources” to the “Output Columns”: select the table and click the /wp-content/uploads/2016/03/image016_916468.png(Add to Output) icon:

   /wp-content/uploads/2016/03/image017_916472.png

Next, click on the “FILTER EXPRESSION” tab, open the “Columns” element, and then double-click partof_continent. In the Operators selector click once on “=”. The expression appears at the top; complete it by typing ‘Europe’:

/wp-content/uploads/2016/03/image018_916473.png

Next, select the Projection node on the left, and in its MAPPING tab, select and drag name from “Data Sources” to “Output Columns” with your mouse.

Finally, to support anonymous users, select the “Semantics” node at the top of the graph, select the “VIEW PROPERTIES” tab, and change Apply Privileges from “SQL Analytical Privileges” to empty.

Save the calculation view (CTRL/S), and rebuild the tinydb module again. This accomplishes our task: we created a view that shows only the name of only European countries.

Using OData

One of the most common usage patterns is to expose a data model via the OData protocol (see: www.odata.org). This is very easy to do with the Web IDE, by means of adding a single file to our small Node.js module.

In the folder tree (navigation pane), right-click the tinyjs/lib/ folder, create a “New > File” and call it euro.xsodata. Note that the suffix is important – it determines how the file will be treated in the HANA database. In the editor, type:

service {

  “tinyworld.tinydb::myview” as “euro” keys generate local “ID”;

}

Then save the file. We just defined a new OData service named euro.xsodata, and defined an entity euro, based on the myview Calculation View (using the name of the HANA table, which is prepended by the namespace). The euro entity uses an auto-generated key called ID.

Before we can run the OData Service, we need to create dependency from the Node.js module that exposes the OData service, and the underlying HDB module, on which it depends.

Open the mta.yaml MTA descriptor, and look for the tinyjs module. You will see something like this:

  /wp-content/uploads/2016/03/image019_916475.png

Append the following text to the attributes of the tinyjs module:

# ——- dependency on DB

  requires:

    – name: tinydb

    – name: hdi-container

#—————- exposes SERVICE URL to consumers

  provides:

    – name: tinyjs_api

      properties:

        service_url: ${default-url}

# —-


NOTE: The YAML syntax is indentation-sensitive and does not allow usage of tabs. Make sure that you use spaces only.

Next, open the file tinyjs/server.js, and uncomment the line that establishes the connection to the HANA database. It should look like this:

// configure HANA

options = xsjs.extend(options, xsenv.getServices({ hana: {tag: “hana”} }));

Save all files, and run the Node.js module again (right-click tinyjs/> Run > Run as Node.js Application”).

Testing the OData service

Since we didn’t change the code of index.xsjs yet, you will see the same “It’s a tiny JS World!” message again, but now we also have an OData service, which we can actually test using an OData URL:

In the browser tab, where the hello-world message is showing, replace the URL suffix /index.xsjs with

/euro.xsodata/euro?$format=json

If all works as expected, you will see the output (based on the manual entries we made above), as follows:

/wp-content/uploads/2016/03/image020_916476.png

Using the OData service with SAP UI5

The above URL test tells us that the OData service is up and running. Let’s now write a small UI5 application that uses the same OData service programmatically.

Double-click to again open the existing tinyui/resources/index.html file, replace its content with the following UI5 code, and save:

<!DOCTYPE HTML><head><meta http-equiv=”X-UA-Compatible” content=”IE=Edge” />

<title>DevXdemo</title>

<script src=”https://sapui5.hana.ondemand.com/resources/sap-ui-core.js

id=”sap-ui-bootstrap” data-sap-ui-libs=”sap.ui.commons, sap.ui.table” data-sap-ui-theme=”sap_bluecrystal”>

</script>

<script>

  var oModel = new sap.ui.model.odata.ODataModel(“/euro.xsodata”, true);

  var oTable = new sap.ui.table.Table({ title: “European Countries” });

  oTable.addColumn(new sap.ui.table.Column({ label: “Country Name”, template: “name” }));

  oTable.setModel(oModel); oTable.bindRows(“/euro”); oTable.placeAt(“content”);

</script>

</head>

  <body class=’sapUiBody’> <div id=’content’></div> </body>

</html>

What does this app do? We define a model (oModel), bound to /euro.xsodata. Then, we create a table with a single column, bound to the name field of the entity /euro. The table is initialized and displayed in an HTML context.

We need to one additional requirement in order to run a UI5 application on XS Advanced, and that is to set up a destination for the XS Advanced “approuter”, which handles cross-references to other URLs. Here we have a cross-reference to the URL of the euro.xsodata OData service of the tinyjs module. Here are the two steps:

  1. In the mta.yaml MTA descriptor, find the tinyui module section and append the following:

# — requires tinyjs service URL

  requires:

    – name: tinyjs_api

      group: destinations

      properties:

        name: tinyjs_be

        url:  ~{service_url}

    2. Open the file tinyui/xs-app.json (you can right-click “Beautify” it in the editor) and add the following entry to the “routes” array (inside the square brackets):

{“source”: “^/euro.xsodata/.*$”, “destination”: “tinyjs_be”}

We now defined a dependency between the tinyui and tinyjs modules, and specified a destination route to the OData service. Save both files and run tinyui/ again from the toolbar or by right-clicking the folder tinyui/ “> Run > Run as > Web Application”.

After a while, the following table will appear in another tab of your browser:

/wp-content/uploads/2016/03/image021_916477.png

Summary of part 3

We learned how to use the Web IDE and its HANA-specific tools to build a HANA-based client-server application, with a UI module that access the database via OData. In the next two parts of this tutorial (Add SAP HANA business logic and Add business logic with Node.js) we will add some business logic to our application.

Other parts of this TinyWorld tutorial:

Part 1:   A TinyWorld Tutorial – Introduction


The basic tutorial

Part 2:   Get started with the SAP Web IDE for SAP HANA

Part 3:   Create a SAP HANA based client-server application

Part 4:   Add SAP HANA business logic

Part 5:   Add business logic with Node.js


Advanced topics

Part 6:   Create Node.js unit tests

Part 7:   Under the hood

Part 8:   Source control

Part 9:   Application life cycle

Part 10: Add authentication

Part 11: Add authorization


Assigned Tags

      53 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Dirk Raschke
      Dirk Raschke

      Hi Chaim,

      because a lot of people are using the sap "master-detail app", it would be really helpful if you could show how this has to be implemented on the new node.js runtime environment.

      At this moment we don't have a clue how we should have to migrate it, that it works also in the new environment.

      Thanks a lot!!!

      Author's profile photo Chaim Bendelac
      Chaim Bendelac
      Blog Post Author

      Hi Dirk,

      That is a nice idea. The Web IDE for SAP HANA doesn't yet provide the rich set of Fiori templates (including the "master-detail" template) that we offer with its older brother, the Web IDE on HCP.

      But if you have already developed such a Fiori app, then you could import its code as a module into an SAP HANA project, build it, and bind it to an ODara service somewhat like the "euro" OData service in the TinyWorld project described above.

      This should work fine, particularly with more interesting data models.

      --

      Chaim

      Author's profile photo Dirk Raschke
      Dirk Raschke

      Hi Chaim,

      thanks for your help!

      At this moment it's enough to know that it should work also on this described "euro"-way. 🙂

      Kind regards,

      Dirk

      Author's profile photo Dirk Raschke
      Dirk Raschke

      Hi Chain,

      now we were able to move one of our Master-Detail-App to the new XSA by the WebIDE.

      Everything seems to be fine, but post the request fails.

      Error: Unsupported content type: multipart/mixed;boundary=batch

      Failed to load resource: the server responded with a status of 500 (Internal Server Error)

      https://.......xsodata/$batch

      Do you know this error?

      (The tables are still empty, but this can't be the reason...?)

      Thanks

      Author's profile photo Former Member
      Former Member

      In the graphic that follows the following text, the middle box is an Aggregation (in the other graphics, the middle box is named Projection)

      Next, click on the "FILTER EXPRESSION" tab, open the "Columns" element, and then double-click partof_continent. In the Operators selector click once on "=". The expression appears at the top; complete it by typing 'Europe':

      Author's profile photo Chaim Bendelac
      Chaim Bendelac
      Blog Post Author

      You are right, the third graphic should show a projection as well. Will fix later.

      --

      Chaim

      Author's profile photo Wolfgang Röckelein
      Wolfgang Röckelein

      It seems that you forgot to fix this...

      Author's profile photo Andrew Lunde
      Andrew Lunde

      Note: This issue occurs in SPS11 but seems to now be fixed in SPS12.

      When trying to exercise my new odata interface as above,

      https://host.acme.net:51021/euro.xsodata/euro?$format=json

      I get the following 500 error:

      Error: Hostname/IP doesn't match certificate's altnames: "Host: host.acme.net. is not cert's CN: localhost"

      It's clear to me that the certs being supplied to communicate between the tinyjs and tinydb modules aren't correct (should be at least a self-signed cert for host.acme.net) but it isn't clear how to supply the proper certs.

      I did install the XS runtime specifying hostname and cert to be host.acme.net but it's still picking up localhost for some reason.

      Is there any guides to troubleshooting and fixing this?

      -Andrew

      Author's profile photo Former Member
      Former Member

      You could follow the HANA guide for setting up SSL server certificate:

      https://help.sap.com/saphelp_hanaplatform/helpdata/en/d3/3b259c567441aa97e99228dc0f2088/frameset.htm

      Author's profile photo Andrew Lunde
      Andrew Lunde

      This is for the primary web dispatcher not individual XS-A apps.

      Author's profile photo Andrew Lunde
      Andrew Lunde

      I found the answer to be disabling SSL of the JS app.

      xs set-env XSA_USER-yourspecificappid-tinyworld-tinyjs NODE_TLS_REJECT_UNAUTHORIZED 0


      xs restart XSA_USER-yourspecificappid-tinyworld-tinyjs


      Thanks to Marc Becker for this.

      Author's profile photo Lior Okman
      Lior Okman

      There is a root error here, that the SSL certificates are not properly configured. This error should not have occurred, and it hints to an installation problem on the XSA level.

      The proposed workaround makes the JS application vulnerable to a Man-In-The-Middle attack. It is probably not an issue for an example like TinyWorld, but should be avoided for production scenarios.

      However, if this workaround is performed, then it needs to be performed over and over again each time you stop and start the node.js module in DevX, and then later it adds an additional step that needs to be performed from the CLI by the administrator after this application is deployed outside of WebIDE.

      Instead of using the "xs set-env" command, the property should simply be added to the mta.yaml file. This way the development environment will manage setting this environment variable correctly, and also include this in the application for deployment outside of WebIDE.

      The module for the tinyjs should simply have one more section called properties, with a property called NODE_TLS_REJECT_UNAUTHORIZED and a value of 0. For example:

      modules:
      - name: tinyjs
        type: nodejs
        path: tinyjs
      # ------- dependency on DB
        requires:
          - name: tinydb
          - name: hdi-container
      #---------------- exposes SERVICE URL to consumers
        provides:
          - name: tinyjs_api
            properties:
              service_url: ${default-url}
      # ----------------- adds properties as environment variables in XSA
        properties:
          NODE_TLS_REJECT_UNAUTHORIZED: 0
      

      After updating this file, simply run the tinyjs module through the WebIDE and the environment variable will be in the environment of the XSA application.

      --

      Lior

      Author's profile photo Former Member
      Former Member

      Hello,

      Fantastic tutorial, we have been waiting for the IDE for sometime now.

      However, we're getting error 500 self signed certificate when running the OData. How can we resolve this issue?

      -Nehad

      Author's profile photo Andrew Lunde
      Andrew Lunde

      I found the answer to be disabling SSL of the JS app.

      xs set-env XSA_USER-yourspecificappid-tinyworld-tinyjs NODE_TLS_REJECT_UNAUTHORIZED 0


      xs restart XSA_USER-yourspecificappid-tinyworld-tinyjs


      Thanks to Marc Becker for this.

      Author's profile photo Former Member
      Former Member

      That worked nicely, so at least I can carry on. Thanks so much.

      Author's profile photo Lior Okman
      Lior Okman

      There is a root error here, that the SSL certificates are not properly configured. This error should not have occurred, and it hints to an installation problem on the XSA level.

      The proposed workaround makes the JS application vulnerable to a Man-In-The-Middle attack. It is probably not an issue for an example like TinyWorld, but should be avoided for production scenarios.

      However, if this workaround is performed, then it needs to be performed over and over again each time you stop and start the node.js module in DevX, and then later it adds an additional step that needs to be performed from the CLI by the administrator after this application is deployed outside of WebIDE.

      Instead of using the "xs set-env" command, the property should simply be added to the mta.yaml file. This way the development environment will manage setting this environment variable correctly, and also include this in the application for deployment outside of WebIDE.

      The module for the tinyjs should simply have one more section called properties, with a property called NODE_TLS_REJECT_UNAUTHORIZED and a value of 0. For example:

      modules: - name: tinyjs   type: nodejs   path: tinyjs # ------- dependency on DB   requires:     - name: tinydb     - name: hdi-container #---------------- exposes SERVICE URL to consumers   provides:     - name: tinyjs_api       properties:         service_url: ${default-url} # ----------------- adds properties as environment variables in XSA   properties:     NODE_TLS_REJECT_UNAUTHORIZED: 0 

      After updating this file, simply run the tinyjs module through the WebIDE and the environment variable will be in the environment of the XSA application.

      --

      Lior

      Author's profile photo Dirk Raschke
      Dirk Raschke

      Same too me, it worked. 🙂

      Thanks a lot!

      Author's profile photo Zoya Pronyakova
      Zoya Pronyakova

      Hi Nehad,

      Just to understand your scenario:

      - are you running OData example as provided in the tutorial? If not could you please provide the details of the OData service

      - what linux machine are you using for xsa installation
      for example I am using SUSE Linux Enterprise Server 11 SP2  (x86_64) 

      - i assume you've installed xsa SPS11 version, am i right?

      Thanks,

      Zoya

      Author's profile photo Former Member
      Former Member

      Hi Zoya,

      I'm running the OData exactly as in the tutorial. We are using AWS SUSE linux Server 12 (x86_64).

      We have installed XSA and WEB-IDE, DI and XSA Runtime updates before starting the tutorial. The xsjs example works fine, but as the OData didn't. I'm assuming it's internal comms ssl issue, which I tried to disable in global.ini to no avail.

      Also noticed server is missing sapsrv_internal.pse key store file.

      Thanks...

      -Nehad

      Author's profile photo Anita Dixit
      Anita Dixit

      I am new to XSA, executed till the section 'Using OData services with SAP UI5', -Replaced index.html file of tinyui resource -Modified MTA .yaml file  at tinyui module -Modified tinyui/xs-app.json -Run tinyui as Web Application But I got an error page https://mo-40d0cc63e.mo.sap.corp:53075/che/runner/workspace4w14wk9ww4wtsuk8/logs/30 Can anyone please help here and tell me what I should do ? Thanks

      Author's profile photo Dirk Raschke
      Dirk Raschke

      Hi Chaim,

      I think you forgot to set the key, or didn't you?

      entity country {

      key name: String(100);

      partof: Association[0..1] to world;

        };

      The same error exist in the docu --- tinyworld

      http://help.sap.com/hana/SAP_HANA_Developer_Guide_for_SAP_HANA_XS_Advanced_Model_en.pdf

      Thanks for your great work!

      Author's profile photo Chaim Bendelac
      Chaim Bendelac
      Blog Post Author

      Hi Dirk, and thanks,

      OData services require that one of the fields is unique. That is true, and one way to accomplish this, is to define an entry with the "key" keyword. Another way is to specify an auto-key generation in the xsodata specification, which is what I did here.

      Both alternatives should work.

      --

      Chaim

      Author's profile photo Dirk Raschke
      Dirk Raschke

      "auto-key"

      Yes, its what I also thought, but the insert of the values failed without the key.

      INSERT INTO "tinyworld::tinyf.country" VALUES ('Spain', 'Europe');

      Author's profile photo Chaim Bendelac
      Chaim Bendelac
      Blog Post Author

      That surprises me. It didn't fail for me. The INSERT is just a regular SQL command...

      Contact me by email (Chaim.bendelac@sap.com), to follow up.

      Author's profile photo Dirk Raschke
      Dirk Raschke

      In SPS12 it works to me as you said! Thanks!

      Author's profile photo Gregor Wolf
      Gregor Wolf

      Hi Chaim,

      thank you for your great blog series on XSA. I have one suggestion to load SAPUI5 local instead from the public web. Add the following lines to the requires section of the mta.yaml:

      # -- requires ui5 to link to local SAPUI5 deployment

          - name: ui5

            group: destinations

            properties:

              name: ui5

              url: http://localhost:8000/sap/ui5/1

      Together with this routes configuration in the xs-app.json:

      {

        "welcomeFile": "index.html",

        "authenticationMethod": "none",

        "routes": [

        {

        "source": "^/sap/ui5/1(.*)$",

        "target": "$1",

        "destination": "ui5",

        "csrfProtection": false

        }

        ]

      }

      You load SAPUI5 from:

      src="/sap/ui5/1/resources/sap-ui-core.js"

      I've tried also the local-destinations.json file as described in the "Developer Guide for SAP HANA XS Advanced Model" but that always caused this error:

      VError: xs-app.json/routes/0: Format validation failed (Route references unknown destination "ui5")

      Best regards

      Gregor

      Author's profile photo Mahesh Krishnapillai
      Mahesh Krishnapillai

      Hi Gregor,

       

      Did you happen to resolve this error?

      Thanks,
      Mahesh

      Author's profile photo Gregor Wolf
      Gregor Wolf

      Dear Mahesh,

      the first part of my post was a solution. I haven't checked back on the local-destinations.json possibility. Are you asking about that?

      Best regards
      Gregor

      Author's profile photo Mahesh Krishnapillai
      Mahesh Krishnapillai

      Oh no .. i was referring to the JSON format issue.

      "VError: xs-app.json/routes/0: Format validation failed (Route references unknown destination “ui5”)"

      Author's profile photo Hong Liu
      Hong Liu

      I met the issue either. Any solution?

      Build error: Invalid mta.yaml. Make sure that the required module or resource ui5 is defined.

      Author's profile photo Mahesh Krishnapillai
      Mahesh Krishnapillai

      This is because of MTA.yaml file error. Formatting issue to be specific.

      Author's profile photo Rakshetha J N
      Rakshetha J N

      hi all
      Im having trouble with the xsodata call
      I get this error .

      Internal Server Error - Invalid HANA settings provided. OData services are disabled.

      I wasn't aware of any setting in HANA earlier.
      I have a monsoon system.
      best regards
      jnr

      Author's profile photo Swarnava Chatterjee
      Swarnava Chatterjee

      Hi All,
      I have setup a HANA Express edition locally and i was trying out the above Tiny World example.
      When i run my odata service, it works correctly and the url looks like https://hxehost:portx/....euro.xsodata/...

      When i deploy the webui module and run the UI, the ui comes up but odata call fails.
      I see that the web module runs on hte url https://hxehost:porty/index.html
      When the web module tries to call the xsodata, it makes a call to https://hxehost:porty...odata  [here hte ports are different than the port where the odata service directly runs]

      I am unable to get the data due to the port mismatch, ideally the app router should have handled this.

      Any help will be highly appreciated.

      Best Regards
      Swarnava

      Author's profile photo Former Member
      Former Member

      Hi All 🙂

      When I try to run the tinyui as a Webapp at the end of this tutorial step, it says in the console:

      Application is starting
      Application failed to run

      In the Logs there is a more detailed error message:

      {
      message: "Failed to resolve reference for provided property: ed899c73-b258-4fe5-9e6b-93043be52277-tone142iqopg82ep-TinyWorld#tinyjs_api#service_url"
      }

      So obviously, there is an error with resolving the "service-URL".

      My mta.yaml is valid (I checked it with various YAML Lint-Tools and I can build it in WebIDE) and Looks like the following:´

      _schema-version: '2.0'
      ID: TinyWorld
      description: TinyWorld Tutorial App
      version: 0.0.1
      
      modules:
      - name: tinydb
        type: hdb
        path: ./tinydb
        requires:
        - name: hdi-container
      
      
      - name: tinyjs
        type: nodejs
        path: ./tinyjs
        # ------- dependency on DB  
        requires:
        - name: tinydb
        - name: hdi-container
      #---------------- exposes URL to UI5
        provides:
        - name: tinyjs_api
          properties:
            service_url: ${default-url}
      # ---- 
      
        
      
      - name: tinyui
        type: html5
        path: ./tinyui
        # ------------- requires URL from JS, add to destinations
        requires:
        - name: tinyjs_api
          group: destinations          
          properties:
             name: tinyjs_be            
             url:  ~{service_url}
      # ----
      
      resources:
      - name: hdi-container
        type: com.sap.xs.hdi-container

      My tinyui/xs-app.json Looks like this:

      {
      	"welcomeFile": "index.html",
      	"authenticationMethod": "none",
      	"routes": [{
      		"source": " ^ /euro.xsodata/.*$",
      		"destination": "tinyjs_be"
      	}]
      }

      Does anybody know, what the Problem with resolving is? Or has anybody the same error?=

      Kind Regards,

      Florian

       

       

      Author's profile photo Former Member
      Former Member

       

      I found the error 🙂

      The Problem was that I stopped my tinyjs app, which is needed of Course to connect to the data

      Author's profile photo Arun Elangovan
      Arun Elangovan

      Can you please explain the solution? I didn't find any solution to this issue so far

      Author's profile photo Stefan Porges
      Stefan Porges

      Hi,

      im still having the same problem, I use Hana express 2. Could anyone explain me, how the solve this issue? My js app is running. I tried also the xs command map-route without success.

       

      Thanks in advance Stefan

      Author's profile photo Wolfgang Weinmann
      Wolfgang Weinmann

      Hi,

      I get a screen without data. error message in the log:

       

      5/3/17 8:57:19.000 AM [APP/2735-0] TRC    /node_modules/approuter/lib/utils/uaa-utils.js:27 [] ERROR: Cannot find service uaa in environment. Details: "No service matches uaa"
      5/3/17 8:57:19.000 AM [APP/2735-0] TRC    /node_modules/approuter/lib/utils/uaa-utils.js:27 [] ERROR: Cannot find service uaa in environment. Details: "No service matches uaa"
      5/3/17 8:57:19.529 AM [APP/2735-0] LOG   #2.0#2017 05 03 08:57:19:529#+00:00#ERROR#/Configuration################PLAIN##Cannot find service uaa in environment. Details: "No service matches uaa"#
      5/3/17 8:57:19.539 AM [APP/2735-0] LOG   #2.0#2017 05 03 08:57:19:539#+00:00#ERROR#/Configuration################PLAIN##Cannot find service uaa in environment. Details: "No service matches uaa"#
      5/3/17 8:57:20.000 AM [RTR] OUT    10.79.25.148 - - to vhcalhxedb:51005 "GET /35b7f419-2c18-4ef2-a063-47e5fd009981/appStatus HTTP/1.1" 200 sent 20 in 19 by 009-75d774c4-00f5-42c6-b7b8-45e6fdea8a04
      5/3/17 8:57:23.000 AM [RTR] OUT    10.20.5.186 - - to vhcalhxedb:51005 "GET /index.html HTTP/1.1" 200 sent 748 in 39 by 009-75d774c4-00f5-42c6-b7b8-45e6fdea8a04
      5/3/17 8:57:23.000 AM [RTR] OUT    10.79.25.148 - - to vhcalhxedb:51005 "HEAD / HTTP/1.1" 302 sent 0 in 8 by 009-75d774c4-00f5-42c6-b7b8-45e6fdea8a04
      5/3/17 8:57:23.000 AM [RTR] OUT    10.79.25.148 - - to vhcalhxedb:51005 "HEAD /index.html HTTP/1.1" 200 sent 748 in 6 by 009-75d774c4-00f5-42c6-b7b8-45e6fdea8a04
      5/3/17 8:57:24.000 AM [RTR] OUT    10.20.5.186 - - to vhcalhxedb:51005 "GET /euro.xsodata/$metadata HTTP/1.1" 404 sent 19 in 6 by 009-75d774c4-00f5-42c6-b7b8-45e6fdea8a04
      5/3/17 8:57:25.000 AM [RTR] OUT    10.20.5.186 - - to vhcalhxedb:51005 "GET /euro.xsodata/$metadata HTTP/1.1" 404 sent 19 in 6 by 009-75d774c4-00f5-42c6-b7b8-45e6fdea8a04
      5/3/17 8:57:26.000 AM [RTR] OUT    10.20.5.186 - - to vhcalhxedb:51005 "GET /favicon.ico HTTP/1.1" 404 sent 19 in 7 by 009-75d774c4-00f5-42c6-b7b8-45e6fdea8a04

       

      Somehow the application tries to access the ODATA via port 51005, which leads to error 404. With port 51004 ODATA could be access correctly. Probably this is related to the missing uaa......

       

      I am using HANA Express Edition as CAL on Amazon Web Services and have not changed any settings.....

       

       

       

       

      Author's profile photo Former Member
      Former Member

      I faced same error.

      Does anyone have some info?

      Author's profile photo Former Member
      Former Member

      Nice blog..

      I created HDB module successfully. Now when I try to create flowgraph or calculation view and select table , I am not able to search any tables in the database. At the time of HDB module creation, I have added SCHEMA name. Any idea why I would not see any tables or views?

       

      Thank you,

      NIshith

       

      Author's profile photo Himanshu Pandey
      Himanshu Pandey

      hi,

       

      while running the  node.js application i am getting following error.

      any idea why is this happening. I am running HANA 2.0 expression edition on VM.

      Author's profile photo Heiko Hoefer
      Heiko Hoefer

       

      Hi there,

      first - thanks a lot for the efforts providing this comprehensive tutorial. I got several comments to add:

      1. be careful when copying sample code from this site to your WebIDE editors
        • for YAML artifacts - be aware of the indention and the dashes - replace them with space and the correct dash (short one, not the long one that is contained in the samples above) respectively - you may use an online YAML parser to validate the correctness for your YAML content
        • for index.html and other sample code artifacts - replace the double and single quotes by the correct ones - " and '
      2. create the project in an own new space
        • don't forget to execute space enablement and deploy the builder in your space
        • create hana and uaa services instances in your space
        • assign SpaceDeveloper role to your developer

      BR

      Heiko

       

      Author's profile photo Michael Smith
      Michael Smith

       

      Chaim,

      I am getting the following message when I attempt to build the tinyjs module in HANA 2.0:

      [ERROR] Invalid mta.yaml.  Make sure that the required module or resource hdi-container is defined.

      Can you provide the mta.yaml file in its entirety on this blog?

      Thanks,
      Michael

      Author's profile photo Michael Smith
      Michael Smith

       

      Chaim,

      I actually looked in part 7 and found the mta.yaml file.  Also, the hdi container is named differently (automatically) in HANA 2.0.

      Thanks,

      Michael

      Author's profile photo Former Member
      Former Member

      Hi,

      A few weeks, I started trying to learn how to develop using the XS Advanced model, but I dont understand clearly,

      ¿In the new XS Advanced, we need to still use XSJS and XSOData, why all exercises on the SAP documentation require to check Enable XSJS Support?

      It confuses me, I have to start developing a new app and want to know if I should use XSOData and XSJS or just disable the XSJS support and code only in native Node JS.

      If they are no longer needed, ¿How can we develop an Odata service with the new XS Advanced without using XSOdata, any tips?

      Thanks you,

      Carlos

       

      Author's profile photo James Longden
      James Longden

      Unable to fetch MTA dependencies of module /tinyjs, due to: tinyworld .

      Hi,

      I have followed this through a couple of times to make sure I am not missing a step, but whenever I run as a node.js application after updating mta.yaml and server.js, I get the above error in the log.

      I have run my mta.yaml file through a validator with no issues. It is below.

      ID: tinyworld
      _schema-version: '2.0'
      version: 0.0.1

      modules:
      - name: tinydb
      type: hdb
      path: tinydb
      requires:
      - name: hdi_tinydb

      - name: tinyjs
      type: nodejs
      path: tinyjs
      requires:
      – name: tinydb
      – name: hdi-container
      provides:
      - name: tinyjs_api
      properties:
      service-url: ${default-url}

      - name: tinyui
      type: html5
      path: tinyui

      resources:
      - name: hdi_tinydb
      properties:
      hdi-container-name: ${service-name}
      type: com.sap.xs.hdi-container

      Any help on fixing this would be appreciated.

      Thanks.

      Kind regards,

      James

      Author's profile photo Ulrich Graf
      Ulrich Graf

      I am running the tiny.world micro apps on SAP HANA Express 2.0 SPS04 (locally).

      Essentially I am following the SAP HANA Academy series about XS Advanced Model.

      The code of the mta.yaml file changed a bit.

      Finally this code worked for me.

      I hope, this helps some others…

      Best Regards

      Ulrich

      ID: tinyworld
      _schema-version: '2.1'
      version: 0.0.1
      
      modules:
       - name: tinydb
         type: hdb
         path: tinydb
         requires:
          - name: hdi_tinydb
      
       
      
       - name: tinyui
         type: html5
         path: tinyui
      
      
       - name: tinyjs
         type: nodejs
         path: tinyjs
         requires:
          - name: tinydb
         provides:
          - name: tinyjs_api
            properties:
               url: ${default-url}
      
      resources:
       - name: hdi_tinydb
         properties:
            hdi-container-name: ${service-name}
         type: com.sap.xs.hdi-container
      

       

      Author's profile photo Ulrich Graf
      Ulrich Graf

      After having problems invoking tinyui I found this:

      https://answers.sap.com/questions/390083/mta-project-format-validation-failed-absolute-url.html

      Gregor Wolf writes in there, that Thomas Jung  “…clarifies that in Web IDE this URL’s don’t work and must be replaced by a static URL.”

      In there is a link to Thomas Jungs github stuff to this kind of errors.

      So I enhanced the tinyworld yaml with Thomas approach, with which tinyui finally is working. Here is my mta,yaml file:

       

      ID: tinyworld
      _schema-version: '2.1'
      version: 0.0.1
      modules:
        - name: tinydb
          type: hdb
          path: tinydb
          requires:
            - name: hdi_tinydb
        - name: tinyui
          type: html5
          path: tinyui
          requires:
            - name: tinyjs_api
              group: destinations
              properties:
                name: tinyjs_be
                url: '~{url}'
        - name: tinyjs
          type: nodejs
          path: tinyjs
          provides:
            - name: tinyjs_api
              properties:
                url: ${default-url}
          requires:
            - name: hdi_tinydb
            - name: controllerEndpoint
              group: destinations
              properties:
                name: controllerEndpoint
                url: ~{url}
      resources:
        - name: hdi_tinydb
          properties:
            hdi-container-name: '${service-name}'
          type: com.sap.xs.hdi-container
        - name: controllerEndpoint
          type: ''
          properties:
            url: '"https://hxehost:39030"' 
      

       

      Author's profile photo Jimmy Arnold Moreno Nuñez
      Jimmy Arnold Moreno Nuñez

      Hi there.

      I get error 404 when I run my application.

      When I run my xsodata service, I get this URL.

      https://cyuv0u1abc-services-js.YYY.ABC.hana.ondemand.com/index.xsjs

      I tested above URL and working.

      When I run my UI5 app I get this URL

      https://9r4s2rw6hjabc-approuter.YYY.ABC.hana.ondemand.com/myapp-1.0.0/index2.html

      Well, this two URLs hasn't the same domanin and I get code error 404 on console when I run my app.

      Please, can you help me?

      Author's profile photo Eric Cassaro
      Eric Cassaro

      Same issue here. Did you manage to find the solution?

       

      Thanks, Eric

      Author's profile photo Jimmy Arnold Moreno Nuñez
      Jimmy Arnold Moreno Nuñez

      Hi Eric.

      I had to register the service like destination and add it into neo-app.json.

      Author's profile photo Somnath Paul
      Somnath Paul

      Hello Chaim Bendelac,

      First of all thanks for this blog. I was trying to follow and could able to follow till integration with node js (XSJS) - tniyjs and tinydb integration. I am able to run the backend service to get the response. It worked well.

      I am not running this exercise from HANA express on my local machine (because of a limited system configuration) rather on BTP using Web IDE and SAP Hana Schema and HDI container (Trial) as a service and it was all going good so far.

      While I am trying to create HTML5 module this is where I see major difference from this blog,as per current date which asks for template-driven application build up and I then just followed your example tinyui folder structure and it looks like as below.

      Interestingly when I am running my tinyui app as web application, I found the metadata fetch is getting failed means it doesn't pick from {service_url} rather from its application default url.

      I am confirming my backend is up and running and I am able to get the data as below:

      To ensure it is really resolving the route I hardcoded the url path in xs-app.json and still, it is not accepting it, that is where I have the doubt!!

      I expected a CSRF issue would arise anyway that could have been set as false but no way it is resolving the route thru xs-app.json configuration.

      Question: I have a basic doubt if run as web application triggers the app router then this hardcoded url should have been picked, isn't it?

      Though in package.json start script contains the concerned approuter trigger command, but this is not getting triggered I suppose. my MTA.YAML also I am placing here for a review:

      I am not sure if this blog thread will be monitored if so, kindly advise what could be the possible solution to this issue as it blocks me to implement the following tutorials.

      ** I know BAS and HANA cloud option is there but I am following may be an old school method but would like to know the solution to this problem. I am probably missing something at the very basic.

      My UI looks as below:

      Please help.

      • Thanks, Somnath
      Author's profile photo Somnath Paul
      Somnath Paul

      Hello Community,

      Thought to update this thread with an option thru which the problem can be resolved. I am not saying this is the perfect solution but some sort of workaround and still will keen to know if someone can say the resolution.

      Now come back to the approach:

      You have possibly two choices:

      1. Have your tinyui within the same project and in that case I have set the nodejs runtime servie url as a separate destination and the same I have linked to the neo.app.json file of my UI5 application so I can resolve this issue.
      2. Have tinyui take out from your project and run it may be within a VSCODE where you need to do little things more to have it run with the help of approuter and in that case your execution approach will be NPM START which will trigger approuter and the setup I have shown above in MTA.YAML file will be just fine to work, ( I hope this approach will also work, but to honest to you, I didn't try though)

      Anyways I went with the first approach and here is the destination screen shot ( only for the beginners adding it over here)

      You should be careful with the url here, don't just copy paste from this screen shot as this will not work for you. You need to start the tinyjs and once its up the concerned service name you need to attach. I know not a good idea as each time you start doing your excerice the destination url needs to be corrected. But that's OK to move ahead with learning..I think..

      Let's check the settings for my neo.app.json ( again I am pasting it for the beginners)

      That's it ... I assume you know how to use the same in manifest.json file..if not write here I will paste it for you....

      Now I can see the values on my UI... cool...! let's move on with the next....!

      Cheers, Somnath