使用 SAP Fiori Tools 自带的代理服务器解决本地运行的 SAP UI5 应用遇到的跨域问题

我们部署在本地开发环境运行的 SAP UI5 应用，由于浏览器安全策略的限制，无法直接访问远端 OData 服务，原因是我们的 SAP UI5 应用本地运行在 localhost 这个域名上，而远端请求的 OData 服务的域名比如说 services.odata.org，二者不是同一个域名，由于浏览器安全策略，浏览器拒绝这种跨域的 HTTP 访问请求。

笔者的 一套适合 SAP UI5 开发人员循序渐进的学习教程 曾经介绍过很多种不同的办法来解决 SAP UI5 应用本地开发时遇到的这种跨域问题。

• SAP UI5 应用开发教程之二十四 - 如何使用 OData 数据模型
• SAP UI5 应用开发教程之二十五 - 使用自开发的代理服务器解决 SAP UI5 应用访问远端 OData 服务的跨域问题
• SAP UI5 应用开发教程之一百一十一 - SAP UI5 FileUploader 控件实现本地文件上传，接收服务器端的响应时遇到跨域访问错误
• SAP UI5 应用开发教程之一百一十二 - 使用自开发的代理服务器解决 SAP UI5 FileUploader 上传文件时遇到的跨域访问错误
• SAP UI5 应用开发教程之一百二十一 - 一键部署开箱即用的代理服务器，解决 SAP UI5 应用开发过程中访问远端 OData 服务的跨域问题

本文笔者再介绍另一种方法，使用 SAP Fiori Tools 自带的代理服务器中间件(middleware)，开发人员既不需要动手亲自开发代理服务器，也不需要下载第三方的代理服务器然后在本地安装，而是直接在 SAP UI5 本地工程的 ui5.yaml 文件里进行简单配置即可。

本步骤基于的例子仍然是步骤 24 即消费远端 OData 服务 https://services.odata.org/V2/Northwind/Northwind.svc/.

在步骤 24 里，我们直接禁掉了 Chrome 浏览器的安全检查策略。在上面提到的其他教程文章里，笔者使用了自定义或者第三方的代理服务器，来规避跨域访问 OData 服务的错误。

我们先查看按照本文介绍的步骤完成后，达到的效果。

运行在 localhost 上的本地 SAP UI5 应用，能否成功访问远端 https://services.odata.org 上的 OData 服务，并将 invoice 列表取回来显示在应用的表格控件里。

下面是该步骤的详细实现过程讲解。