我从来没有机会深入研究的一个特性是离线OData。随着SAP Web IDE Full Stack上混合应用工具包（HAT）的最新更新，离线应用的创建变得更加简单。阅读Ludo Noens的博客

在这篇博文中，我将展示使用HAT-on-webide从头开始构建离线应用程序是多么简单。我将使用Ludo的博客作为参考，因此如果您还没有阅读他的文章，我建议您先阅读他的文章。

我假设您具备基本的UI5知识，激活了所需的云平台服务，配置了示例云平台目的地，并根据Ludo的博客激活了HAT功能。不过，我会做一个改变，更改目标URL，使其指向演示SAP移动平台，而不是直接指向ESPM示例服务。

URL:https://hcpms-试用.hanatrial.ondemand.com而不是https://hcpms-试用.hanatrial.ondemand.com//示例服务/ESPM.svc公司

如有需要，请随意使用任何目的地某个地方已经有一个正在运行的OData服务，但请确保替换以下示例中的相关属性值。

通过直接访问URL并使用用户名和密码登录，确保您拥有正确的基本身份验证凭据。

让我们开始吧！

首先，免费企业管理软件，使用SAP UI5应用程序模板在Web IDE全栈中创建应用程序

配置混合移动应用程序

然后，将应用程序启用为混合移动应用程序。右键单击您的项目>移动>启用为混合移动项目。

注意：如果"移动"选项不在列表中，请检查您是否在Web IDE中激活了HAT功能。

您的项目结构现在应该如下所示。更多详情请点击此处。

添加"sap移动"中的节"清单.json文件来触发在构建期间添加Kapsel脱机OData插件。

接下来，超级淘客，让我们配置数据源和脱机存储，以便我们的应用程序基于OData服务初始化脱机存储（本地DB）。

在清单.json, 添加新模型和数据源：

在neo中添加新路由-应用程序.json. 确保目标名称与云平台目标名称相同。

以下代码片段取自Ludo的博客，在第一次初始化加载组件之前，基本上会创建并打开脱机存储。

打开sap mobile-混合.js文件和替换sap.hybrid.startApp公司与sap.hybrid.openStore

下一步，让我们准备openStore函数中的离线商店创建：

让我们离题，仔细看看openStore函数中发生了什么，因为这对于理解离线商店创建至关重要。

要创建离线商店sap.OData.createOfflineStore创建离线商店方法。"properties"对象作为参数传递，返回类型为sap.OfflineStore软件对象。看到了吗sap.OData公司文档

properties对象中有两个重要参数：

创建脱机存储后，应将其"打开"以供脱机访问。这是通过sap.OfflineStore.open打开方法。成功打开离线商店后，将调用applyHttpClient和原始startApp方法–更多信息请参阅我的下一篇博客。

构建UI

在这个阶段，我们的混合离线应用程序设置已完成。让我们为我们的应用程序创建一个简单的用户界面。

让我们创建一个库存应用程序，让您从产品列表中查看特定产品的当前库存详细信息。让我们在底部添加一个供应商列表。

Home.view.xml

主页.控制器.js

这里没什么特别的，代码和在线申请完全一样。当我们在移动设备或离线模式下访问应用程序时，代码库保持不变，云上，这就是离线OData的优点。

现在让我们确保应用程序在桌面浏览器中作为Web应用程序工作。将项目作为Web应用程序运行。

部署混合应用程序

将项目作为移动服务中的混合应用程序部署的时间。右键单击项目。移动>构建为打包应用程序。我将不详细介绍，因为Ludo的博客已经很好地涵盖了这一步。

构建完成后，用设备的二维码阅读器扫描二维码，下载并安装应用程序。

测试应用程序

打开移动应用程序，并通过通常的登录屏幕。当离线商店正在同步时，会出现一个白色屏幕几秒钟。此时，离线存储将被创建，bi大数据分析，并且在定义请求中定义了实体集的本地数据库表将被数据填充（还记得openStore函数吗？）。几秒钟后，主屏幕将加载。

恭喜，您刚刚从头创建了一个脱机应用程序！进入飞行模式，自己测试。

如下图所示，供应商列表没有任何记录。这是因为我们在定义请求中没有包含"供应商"，大数据运维，因此供应商数据没有被提取并加载到脱机存储中。要解决这个问题，只需在定义请求中为"/供应商"添加一个新的定义查询。

下一步

我们使用SAP Web IDE上的HAT从头构建了一个简单的只读脱机混合应用程序。在我即将发表的博文中，让我们探讨如何实现CRUD、数据同步、多个数据源/离线存储以及在线/离线场景。跟我来保持更新。