sapui5 访问OData数据

最新推荐文章于 2024-01-29 17:21:50 发布

杨江

最新推荐文章于 2024-01-29 17:21:50 发布

阅读量4.8k

点赞数

本文链接：https://blog.csdn.net/berryreload/article/details/52120566

版权

SAP SMP SUP 同时被 2 个专栏收录

40 篇文章 0 订阅

订阅专栏

SAPUI5

31 篇文章 2 订阅

订阅专栏

开发环境：eclipse Luna, sapui5 toolkit eclipse plugin（从sap官网下载）
运行环境：eclipse + Tomcat
OData环境：SAP在公网上提供的免费的基于NetWeaver Gateway的测试用OData服务

代码说明：
最开始测试
sServiceUrl = “http://sapes1.sapdevcenter.com:8080/SAP/OPU/ODATA/IWFND/RMTSAMPLEFLIGHT/“;
在Chrome浏览器发现，发现SAPUI5会请求一个OPTIONS（不是GET,POST）的HTTP请求，/SAP/OPU/ODATA/IWFND/RMTSAMPLEFLIGHT/$metadata
给sapes1.sapdevcenter.com:8080，但是没有把用户名口令放在Authentication的http header里面一并提交给sapes1.sapdevcenter.com:8080，sapes1.sapdevcenter.com:8080的回答是401 Not Authenticated。

sServiceUrl = “http://services.odata.org/V4/Northwind/Northwind.svc/“;
在Chrome浏览器发现，发现SAPUI5会请求一个OPTIONS（不是GET,POST）的HTTP请求，/V4/Northwind/Northwind.svc/$metadata
给services.odata.org, services.odata.org的回答是Not implemented。

好吧，两个错误的原因其实是一样的，在bing.com上搜索了下，https://scn.sap.com/thread/3367409 上解释说：”preflighted” requests first send an HTTP OPTIONS request header to the resource on the other domain, in order to determine whether the actual request is safe to send. Cross-site requests are preflighted like this since they may have implications to user data

解决办法：
用SAPUI5内置的proxy功能访问Cross-site跨网站的OData服务即可。
sServiceUrl = “proxy/http/sapes1.sapdevcenter.com:8080/SAP/OPU/ODATA/IWFND/RMTSAMPLEFLIGHT/”;

完整代码如下：

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>

        <script src="resources/sap-ui-core.js"
                id="sap-ui-bootstrap"
                data-sap-ui-libs="sap.m"
                data-sap-ui-theme="sap_bluecrystal">
        </script>
        <!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->

        <script>

                // create the DataTable control
                var oTable = new sap.m.Table("idRandomDataTable", {
                    headerToolbar : new sap.m.Toolbar({
                        content : [ new sap.m.Label({
                            text : "Summary Data"
                        }), new sap.m.ToolbarSpacer({}), new sap.m.Button("idPersonalizationButton", {
                            icon : "sap-icon://person-placeholder"
                        }) ]
                    }),
                    columns : [ new sap.m.Column({
                        width : "2em",
                        header : new sap.m.Label({
                            text : "From City"
                        })
                    }), new sap.m.Column({
                        width : "2em",
                        header : new sap.m.Label({
                            text : "To City"
                        })
                    }), new sap.m.Column({
                        width : "2em",
                        header : new sap.m.Label({
                            text : "出发时间"
                        })
                    }) ]
                });

                oTable.bindItems("/FlightCollection", new sap.m.ColumnListItem({
                    cells : [ new sap.m.Text({
                        text : "{flightDetails/cityFrom}"
                    }), new sap.m.Text({
                        text : "{flightDetails/cityTo}"
                    }), new sap.m.Text({
                        text : "{flightDetails/departureTime}",
                    }), ]
                }));

                //oTable.setModel(new sap.ui.model.json.JSONModel(summaryDetailData));
                getJSON(oTable);

                oTable.placeAt("content");


                function getJSON(oTable) {
                    //var sServiceUrl = "http://sapes1.sapdevcenter.com:8080/SAP/OPU/ODATA/IWFND/RMTSAMPLEFLIGHT/FlightCollection/";
                    var sServiceUrl = "proxy/http/sapes1.sapdevcenter.com:8080/SAP/OPU/ODATA/IWFND/RMTSAMPLEFLIGHT/";
                    oTable.setModel(new sap.ui.model.odata.ODataModel(sServiceUrl, true, "myusername", "mypassword"));
                    //var sServiceUrl = "http://services.odata.org/V4/Northwind/Northwind.svc/Customers/";
                    //var sServiceUrl = "proxy/http/services.odata.org/V4/Northwind/Northwind.svc/";
                    oTable.setModel(new sap.ui.model.odata.ODataModel(sServiceUrl));
                }



        </script>

    </head>
    <body class="sapUiBody" role="application">
        <div id="content"></div>
    </body>
</html>