UI5提供了一个非常有用的模拟服务器,可以模拟任何OData后端调用。
如果没有OData服务可用,或者您只是不想依赖OData后端连接来进行开发和测试,可以使用它。
它的设计是通过截获与服务器的HTTP通信来模拟OData提供程序,提供假输出。所有这些对于OData模型的数据绑定和使用都是透明的。
虽然模拟服务器只在客户端可用,但这非常适合上述用例。
但是如果我们想在生产过程中更进一步,想在不同的集成场景中测试我们的应用程序,而不必处理实际的服务,每日返利,该怎么办?
我们可以在服务器端使用模拟服务器吗?
剧透警报:是的,我们可以!
UI5本身是一个框架,用于构建在任何浏览器中运行的完整的企业级响应web应用程序。
这意味着它的所有模块(包括模拟服务器)都只能在客户端运行。
那么我们如何绕过这个限制呢?
进入木偶师!
"Puppeter是一个节点库,它提供了一个高级API来通过DevTools协议控制Chrome或Chrome。木偶师默认无头运行,但可以配置为运行完全(非无头)铬或铬"
简单地说,木偶是一个游戏节点.js模块,可用于在无头Chrome实例中运行网页,提供一些与网页交互的API。
我们的想法是通过Puppeter运行客户端模拟服务器,并使用其API转发用户的任何请求外网服务器,然后返回响应。
警告:因为只有Chrome将是我们的目标浏览器和浏览器节点.js它也建立在Chrome的V8引擎之上,我们将广泛使用ES6+功能,如箭头功能,异步…等待和分解以使我们的生活更轻松。
让我们从我们已经知道的部分开始:模拟服务器本身。
我们创建了一个带有公共数据sap ui引导脚本标记的简单网页:
但由于我们不想显示任何ui,只想启动一个模拟服务器实例,我们只引用我们的localService/mockserver数据sapui oninit hook中的模块:
这里唯一值得注意的是MockServer的rootUri,它将由puppeter全局定义和注入。稍后我们将看到它是如何工作的,淘客app定制,请继续关注!
下一步是提供我们的页面,包括必要的UI5资源。
为此,我们将使用UI5构建和开发工具模块提供的公共API。
所有UI5资源也将通过npm提供。因此,不需要手动下载任何UI5资源或SDK。但我们只需要@openui5/sap.ui.core
其他模块我们稍后会用到包.json看起来像这样:
有了这些依赖,我们可以很容易地创建一个帮助器模块ui5-服务.js通过传递当前工作目录和用于启动服务器的端口来服务我们的UI5相关项目文件:
现在来了有趣的部分! ?
我们的MockServer设置好并准备好服务后,我们可以使用puppeter访问它。
为此,秒单客返利机器人,我们创建了一个类UI5Page,它封装了启动UI5服务器和使用puppeter转发请求的所有功能。此类的任何实例都将使我们能够向模拟服务器发送AJAX请求。为此,我们首先启动服务器并使用puppeter启动一个浏览器实例。一旦两者都准备好了,云端云服务器,我们就可以打开一个新的浏览器页面,并可以通过在浏览器页面中将rootUri定义为全局变量来注入它。最后,我们转到浏览器页面,等待页面完全加载,以确保我们的模拟服务器已启动并运行。最后,我们可以使用puppeter的第页,评估函数,它允许我们在页面的上下文中执行任何代码。在我们的情况下,我们触发了jQuery.ajax文件调用(UI5与jQuery捆绑在一起),它将被模拟服务器截获。由于所有数据都需要由Puppeter序列化,因此我们确保使用原始文本作为请求和响应数据,但会跟踪内容类型。
我们的助手类就绪后,我们可以从外部web服务器将实际请求转发给它。
最简单的方法是创建一个专用的快速路由器ui5型-路由器.js:
我们的路由器使用主体解析器将任何请求主体解析为原始文本,以便稍后转发到模拟服务器。
接下来,我们只需处理所有传入的请求并将它们转发到我们的UI5Page实例,然后发送一个返回结果数据和内容类型的响应。
最后,我们只需使用express创建并启动一个简单的web服务器:
让我们浏览至:
确保一切正常:3000/sap/opu/odata/sap/MEETUP\u SRV/$metadata
(由于我们的初始引导,第一个请求需要一些时间才能返回响应,企业信息化管理软件,后续请求会更快)
我们应该看到我们服务的元数据:
让我们尝试另一个:
:3000/sap/opu/odata/sap/MEETUP\u SRV/Meetups?$top=1
正如我们所看到的,一切都按预期工作:
模拟服务器支持的任何其他请求也将工作。但是请注意,对mockdata的任何更改都不是持久的!例如,任何通过POST创建的新实体都将在停止web服务器后消失!所以这种方法不应该在生产中使用!
但出于测试目的,该服务可以轻松部署到cloud foundry。
所有项目文件可在此处找到:
https://github.com/pwasem/ui5-mockserver-puppeteer