在本教程中，大数据网站，我们将学习如何在SAP Analytics Cloud分析应用程序中创建自定义小部件，通过单击按钮直接从UI执行存储过程。执行完成后，消息框将弹出状态。

我们将构建两个组件：自定义小部件和NodeJS应用程序。

我们首先为主面板和样式面板创建SAC自定义小部件JavaScript Web组件，并定义小部件id、名称、Web组件、属性，JSON文件中的方法和事件对象。

然后我们将创建NodeJS应用程序来接收和执行来自小部件的命令，以运行存储过程并告诉自定义小部件何时完成。NodeJS应用程序将调用JavaScript HANA数据库客户端与SAP HANA数据库建立连接并执行存储过程

简化流程图如下

SAC custom widget由以下文件组成：

stroreproc.json文件JSON文件，用于定义具有id、名称、web组件、属性、方法和事件对象的自定义小部件。存储过程.js实现自定义小部件（Web组件）的自定义元素。aps公司_存储过程.js实现自定义小部件的样式面板的自定义元素。套接字.io.js这个套接字.IOJavaScript文件

样式面板配置在aps中实现_存储过程.js.

具有以下属性：

Socket URL：指向NodeJS服务器的URL按钮文本：按钮UI中的文本Command：执行存储过程的命令。这里有两个命令，cmd\u req用于填充数据。和cmd \u req \u del删除数据。Widget Name：自定义Widget实例的名称。

Web组件在存储过程.js.

让我们看看这个文件中的几个函数。

1.2.1 loadthis（）函数

这个函数将执行以下操作：

我们使用套接字.IO与NodeJS app建立连接。它试图加载套接字.IOJavaScript库套接字.io.js建立联系。如果可以加载库，它将尝试连接到NodeJS app并调用UI5（）函数来绘制ui5sap.m.Button UI。它监听来自NodeJS应用程序的传入消息并调用UI5（）函数来更新按钮UI.

1.2.2 UI5（）函数

它在分析应用程序画布上显示按钮UI.

一旦用户按下按钮，它将通过套接字连接向NodeJS发送命令。请参见下面的onPress（）函数。一旦执行完成，它还会显示消息"存储过程已完成，状态为XX"。

我们将使用JavaScript HANA数据库客户端https://github.com/SAP/node-hdb建立与HANA数据库的连接并运行存储过程。

下面的快照显示套接字.IO接收"cmd\u req"上的事件以运行存储的过程SP_1（填充数据）和"cmd_req_del"运行存储过程SP_2（删除数据）。

更新配置.json你的HANA数据库信息。{"host"："localhost"，虚拟主机，"端口"：30015，"user"："用户"，大数据需要学什么，"password"："密码"}​运行NodeJS应用程序。创建Analytics应用程序并添加自定义小部件：storeProc\u 1填充数据，大数据前景如何，storeProc\u 2删除数据。创建模型并插入表。在storeProc\ 1样式面板中，添加以下属性：在storeProc\ 2样式面板中，添加以下属性：添加应用程序刷新数据（）在onStart（）函数中。这是在存储过程执行完成后刷新表。保存并单击"运行分析应用程序"。单击"填充数据"运行存储过程。一旦完成并且没有错误，您将看到如下所示的消息框。表格将自动刷新。在NodeJS应用程序中，大数据推荐，您将看到类似的消息。点击"删除数据"按钮尝试删除数据。

恭喜，我们构建了一个SAP Analytics Cloud，Analytics App自定义小部件，直接从UI执行存储过程！。如果您有任何问题，请告诉我。

在SAP Analytics Cloud、Analytics应用程序中构建自定义小部件github.com/ferrygun/SACStoredProc