使用vs code 创建fiori程序,并deploy到ABAP Server

使用vs code 创建fiori程序,并deploy到ABAP Server

事前准备

安装SAP fiori tools插件,在插件搜索框内输入fiori,安装所有以SAP fiori tools开头的插件

创建fiori程序

1,ctrl+shift+p ,输入Fiori,然后在列表里选择Open Application Generator
2,选择SAPUI5 freestyle,再选择SAPUI5 Application,点击Next
3,datasource选择Connect to an OData Service,然后输入:https://services.odata.org/V2/Northwind/Northwind.svc/
如果有自己创建好的,输入自己的,这个是SAP官方为了练习使用的datasource
然后点Finish,会自动创建项目,并下载相应的依赖包。
注意:有的时候,依赖包没有被自动下载安装,这时就需要在终端输入npm install

deploy到ABAP server

0,先build,执行npm build,会在根目录生产dist目录。
1,安装nwabap-ui5uploader,安装方法:npm install nwabap-ui5uploader
2,在根目录创建.nwabaprc文件

{
    "base": "./dist",
    "conn_usestrictssl" : false,
    "conn_server": "https://ip地址或者网址:端口号/",
    "conn_client" : "自己的client",
    "conn_user": "自己的用户名",
    "conn_password": "密码",
    "abap_package": "包的名字",
    "abap_bsp": "随便起个z开头的名字",
    "abap_bsp_text": "任意写"
}

例子:

{
    "base": "./dist",
    "conn_usestrictssl" : false,
    "conn_server": "https://125.39.49.144:44300/",
    "conn_client" : "400",
    "conn_user": "sap01",
    "conn_password": "pw001",
    "abap_package": "$TMP",
    "abap_bsp": "ZVSCODE_APP001",
    "abap_bsp_text": "UI5 upload through VSCode App"
}

注意:自己的server如果使用的是https,则必须输入https,输入http是执行失败的。
3,执行npx nwabap upload
4,确认是否成功,在SAP gui里输入SE80,选择BSP Application,输入ZVSCODE_APP001,就能看到自己上传的工程。

运行的方法:在终端输入npm run start

会自动启动浏览器

脱离vscode,直接在SAP gui里启动Fiori程序

1,输入Trcd:SICF,在サービス名处输入abap_bsp的名字,也就se80里BSP application的名字,点执行
2,选择图上的节点,点右键,选择测试执行,就能自动打开浏览器,执行了。
3,注意:自动打开浏览器的URL里端口部分可能需要修改,如果是自己的server用的是https,则需要把URL里的http换成https
例子URL:https://sample.net:44300/sap/bc/ui5_ui5/sap/zvscode_app2/index.html?sap-client=40
sap/bc/ui5_ui5/sap/的含义:就是树状结构,sap是根,下面是bc节点,bc下面是ui5_ui5。也就是通过目录层级找到自己的BSP application。

vx:xiaoshitou5854

posted @ 2021-11-09 14:26  小石王  阅读(2190)  评论(0编辑  收藏  举报