使用Chrome开发者工具研究SAP UI5应用里的Odata请求

简介: Suppose I need to investigate how the entities of Initiatives displayed in the table control below is accessed via OData in UI5 application Customer Engagement Initiative (CEI):

Suppose I need to investigate how the entities of Initiatives displayed in the table control below is accessed via OData in UI5 application Customer Engagement Initiative (CEI):


image.png


Requirement1: find out the OData Access URL for Initiatives in table control.

Launch the CEI application via Chrome, click F12 to open development tool, go to tab Network, switch on Record mode by clicking button “Record Network Log”.


image.png


Then click the INITIATIVES work center and display the table control as usual. The record icon turns red which indicates currently the network traffic is recorded. You should observe lots of traffic logged as below.


image.png


Click filter button, and filter by “XHR” ( Xml Http Request), then check starting from the bottom-most, and soon you find the OData access url for initiatives:


image.png


So this url “https://:44300/sap/opu/odata/sap/CUAN_COMMON_SRV/Initiatives?KaTeX parse error: Expected 'EOF', got '&' at position 7: skip=0&̲top=110&$inlinecount=allpages” is just what we are looking for. Write it down for later usage.


Click Preview tab, and you can check the initiative instance contained in Odata response, to compare each field with UI ( for example, ID, Creator, CreatedOnDate, EndDate etc ).

image.png


The CreatedOn and EndDate store the Unix time-stamp since 1970, you can easily convert it via the link below, the converted time is now exactly the same as what you see in UI.


http://www.unixtimestamp.com/index.php


image.png


Requirement2: find out which application view has consumed this OData url to access Initiatives data from ABAP backend

Go to Chrome development tool, expand tab “XHR Breakpoints”, choose “Add breakpoint” from context menu, and type the url part we find in step1: /sap/opu/odata/sap/CUAN_COMMON_SRV/Initiatives?KaTeX parse error: Expected 'EOF', got '&' at position 7: skip=0&̲top=110&$inlinecount=allpages.


image.png


And click Initiative work center, then the breakpoint is triggered. Type “o” in Watch Expressions and we can observe the OData access request is set via line 332 below with the very url we find in step1.


Now we need to find out which view has consumed this OData service. Expand tab “Call Stack”:


image.png


From the call-stack it is very clear the table which displays the initiative data is being rendered. We focus on call-stack highlighted below, the variable c[i] contains the information of table view. Type “c[i]” in Watch Expressions tab and expand it:


image.png


Here we could find view name and thus could identify the application view in the right hierarchy, and then find how the OData model is bound to the table control in CUAN_INI_OW_WSI.view.js and how the OData model is initialized in controller CUAN_INI_OW_WSI.controller.js.

image.png


相关文章
|
5天前
|
前端开发 搜索推荐 开发者
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
33 0
|
5天前
|
JavaScript 前端开发 开发者
SAP UI5 控件 sap.m.ListBase 的 inset 属性的作用介绍
SAP UI5 控件 sap.m.ListBase 的 inset 属性的作用介绍
18 0
|
5天前
|
Web App开发 数据采集 前端开发
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
28 0
|
4天前
|
存储 安全 测试技术
使用 Visual Studio Code 创建 SAP UI5 项目遇到 self-signed security certificate 相关问题
使用 Visual Studio Code 创建 SAP UI5 项目遇到 self-signed security certificate 相关问题
16 0
|
4天前
|
前端开发 数据库 开发者
如何在 SEGW 事务码里为 SAP ABAP OData 服务实现 Function Import 试读版
如何在 SEGW 事务码里为 SAP ABAP OData 服务实现 Function Import 试读版
6 1
|
4天前
SAP ABAP OData 服务里需要指定 guid 类型的请求参数时,正确语法是什么?
SAP ABAP OData 服务里需要指定 guid 类型的请求参数时,正确语法是什么?
6 1
|
4天前
|
安全 API 数据库
SAP ABAP OData 中 Function import 的概念介绍
SAP ABAP OData 中 Function import 的概念介绍
13 2
|
5天前
|
存储 消息中间件 搜索推荐
SAP Commerce Cloud Context Driven Services 的 clickStreamEvents HTTP 请求
SAP Commerce Cloud Context Driven Services 的 clickStreamEvents HTTP 请求
9 0
|
5天前
|
JSON 应用服务中间件 API
使用 ABAP 代码消费 SAP 系统的 OData 服务
使用 ABAP 代码消费 SAP 系统的 OData 服务
14 1
|
5天前
关于 SAP ABAP OData 服务如何实现 Deep Insert 场景 - SAP 应用的标准行为试读版
关于 SAP ABAP OData 服务如何实现 Deep Insert 场景 - SAP 应用的标准行为试读版
18 1

热门文章

最新文章

相关实验场景

更多