Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
cancel
Showing results for 
Search instead for 
Did you mean: 
JerryWang
Advisor
Advisor
There is one question asking how and where the js file "resources/sap-ui-core.js" is loaded when you run your UI5 application locally ( for example using tomcat )?

In my sample project mymap, there is no folder named resources and thus no sap-ui-core.js either.




However, in the runtime, you could indeed observe the folder resources and the sap-ui-core.js inside it via Chrome development tool, tab "Sources":


In order to figure out what happens in the runtime, let's have a look at the web.xml under folder WEB-INF in the project.


There is a ResourceServlet defined. Actually it is the responsibility of this servlet delivered by SAP, which returns the content of resources like js, css and other type in the runtime. So now if I would like to investigate on this servlet, how could I get its source code?




How to get source code of ResourceServlet


Suppose you have already an working Tomcat instance.  Right click your UI5 project, choose Export->War file, and manually copy that exported war file to the webapps folder of your tomcat instance folder. In my case the folder is : C:\myProgram\tomcat-7.0.54\webapps.


Now start your tomcat via bat file, in my case: "C:\myProgram\tomcat-7.0.54\bin\startup.bat":


You should see one information message that the war file is deployed:



Now go back to your webapps folder, you should have a folder mymap which is automatically unzipped from war file by Tomcat.



Now just search by keyword "Resource", and unzip the first hit jar file.



After that you could find three .class file in the unzipped folder, in my case they are:




  • "C:\myProgram\tomcat-7.0.54\webapps\mymap\WEB-INF\lib\com.sap.ui5.resource_1.24.1\com\sap\ui5\resource\ResourceServlet.class"

  • "C:\myProgram\tomcat-7.0.54\webapps\mymap\WEB-INF\lib\com.sap.ui5.resource_1.24.1\com\sap\ui5\resource\impl\ServletResource.class"

  • "C:\myProgram\tomcat-7.0.54\webapps\mymap\WEB-INF\lib\com.sap.ui5.resource_1.24.1\com\sap\ui5\resource\impl\ServletResourceLocator.class"


The last step, google "jd-gui" and download it. It allows you to directly review source code of a .class file.




Since now we have source code at hand, we could do further investigation on this servlet.



More investigation on ResourceServlet


The main job of resource handling is wrapped in method serveResource of class ResourceServlet. We could find at least 2 useful hint from this method.


1. use dev mode to figure out where the resource is loaded



From line 616 and 617, we get to know if the current application runs under Dev mode, it is supported to print out the url of the found resource in http response header.


Just switch on Dev mode by making following settings in web.xml:



after that you could observe the x-sap-ResourceUrl attribute for sap-ui-core.js in Chrome Network tab, which shows where Tomcat loads this js file in the runtime.


 



You could directly browse your application resource by appending "/resources/" to your application url, in my case it is: http://localhost:8080/mymap/resources/



You might already notice the "CLASSPATH", what does it mean?


The constructor of ServletResource which extends base class Resource has one parameter source, which indicates whether this resource is loaded locally or remotely ( configured through parameter com.sap.ui5.resource.REMOTE_LOCATION 😞



in class ServletResourceLocator which implements interface ResourceLocator, the instance for found ServletResource is initialized with corresponding source category, "CLASSPATH" or "REMOTE", according to different approaches how they are actually loaded:



And ResourceServlet will print out this property for each found resource between a pair of "[ ]":



this is the reason why you could see lots of CLASSPATH in tomcat output:



2. understand HTTP 304 status


For example, why I get a HTTP 304 Not Modified for this file?



The answer is in line 625 of ResourceServlet class:



In this example, the second condition after && is always true, since I never make any modifications on this standard library js file:



So we only need to evaluate the result of CacheControlFilter.hasNoCacheHeader(request). The source code of this method is listed below:



In my example since there is no such Cache-Control in request header, this method will return false and finally leads to a 304 status code.



So now if we click the checkbox "Disable cache" in Chrome, we then get a HTTP 200 status code instead, since this checkbox adds a Cache-Control header with value "no-cache":



With the approach introduced in this blog, you could also explore another servlet by yourself, which you could also find and configure it in web.xml: com.sap.ui5.proxy.SimpleProxyServlet.


Enjoy learning 🙂

5 Comments