如何从我自己的后端系统为 UI5 应用程序使用 OData 服务？答案

【问题标题】：How can I consume OData services from my own backend system for a UI5 app?如何从我自己的后端系统为 UI5 应用程序使用 OData 服务？
【发布时间】：2021-10-08 18:46:27
【问题描述】：

我是 SAP 的新手，目前正在处理 SAPUI5 文档的 walkthrough tutorial，并设法进入第 26 步 - Remote OData Service。

我还想在我为工作创建的后端系统中使用我自己的 OData 服务尝试此步骤。我只是用我自己的 OData 服务的服务 URL 替换了教程中的 OData 服务，并为 ABAP 服务器创建了一个目标。

我的manifest.json文件中的代码：

"dataSources": {
  "mainService": {
    "uri": "server-url/sap/opu/odata/sap/ZDEMO_ODATA_PRACTICE_SRV",
    "type": "OData",
    "settings": {
      "odataVersion": "2.0",
      "localUri": "localService/metadata.xml"
    }
  }
}

"models": {
  "": {
    "dataSource": "mainService",
    "preload": true
  }
}

我想在一个简单的列表中显示数据库中的数据并创建了以下视图：

<mvc:View controllerName="dummyproject.dummyproject.controller.App"
  xmlns:mvc="sap.ui.core.mvc"
  xmlns="sap.m"
  displayBlock="true">
  <!-- ... -->
  <List items="{/PersonSet}">
    <!-- ... -->
  </List>
  <!-- ... -->
</mvc:View>

连接正常，但我的屏幕上显示一个空列表和以下错误消息：

[ODataMetadata] 元数据初始加载失败

我已经看到错误指南表明此错误与同源策略有关，但我认为我可以通过创建目标来解决它。

我还在 SAP GUI 中检查了 OData 服务本身，并使用 SAP Gateway 客户端对其进行了测试，它可以正常工作。

有人知道如何处理这个错误，或者知道我可能做错了什么吗？

【问题讨论】：

您提到了“目的地”。我猜你正在使用 SAP BTP（以前的 SCP）。您是如何配置目标和云连接器的？您是在Neo 环境还是Cloud Foundry 上工作？你试过"Consume Data from an ABAP System Using the Cloud Connector"的任务吗？
您好，是的，我正在使用 SAP BTP 的试用帐户和 Cloud Foundry 环境。我在您推荐的教程中配置了云连接器与 ABAP 系统和 BTP 之间的目标和连接，但我没有执行本教程中的最后一步 (developers.sap.com/tutorials/…)。为了完成这项工作，这最后一步是强制性的吗？当我在 SAP BTP Cockpit 中查看我的目的地时，我还看到了我创建的 OData 服务，所以我认为它应该可以工作。

标签： sapui5 sap-gateway ui5-tooling sap-business-technology-platform sap-cloud-connector

【解决方案1】：

我假设您使用 BAS / VSCode 作为您的前端 IDE。如果是这样，您可以使用ui5.yaml 作为中间件来避免 CORS。例如：

specVersion: '2.4'
metadata:
  name: 'swadhin.demo.northwind.employee.readonly'
type: application
server:
  customMiddleware:
  - name: fiori-tools-proxy
    afterMiddleware: compression
    configuration:
      ignoreCertError: false # If set to true, certificate errors will be ignored. E.g. self-signed certificates will be accepted
      backend:
      - path: /V2
        url: https://services.odata.org
      ui5:
        path: 
        - /resources
        - /test-resources
        url: https://ui5.sap.com
        version:  # The UI5 version, for instance, 1.78.1. Empty means latest version
  - name: fiori-tools-appreload
    afterMiddleware: compression
    configuration:
     port: 35729
     path: webapp

如果您使用的是旧版 SAP Web IDE，您可以使用 neo-app.json 进行反向代理：

{
  "welcomeFile": "/webapp/test/flpSandbox.html",
  "routes": [
    {
      "path": "/sap/opu/odata",
      "target": {
        "type": "destination",
        "name": "DESTINATION",
        "entryPath": "/sap/opu/odata"
      },
      "description": "DESTINATION"
    }
  ]
}

确保在您的 UI5 应用程序中使用 path，例如在manifest.json:

"uri": "/sap/opu/odata/sap/ZDEMO_ODATA_PRACTICE_SRV",

【讨论】：

【解决方案2】：

从网关的角度来看，您可以使用错误日志和有效负载跟踪解决此类问题。但是，当您在“网络”选项卡以及 Chrome 开发人员工具中看到失败的请求时，这些最有用（您没有提及是否这样做）。错误日志：

在您的网关系统中调用 /N/IWFND/ERROR_LOG
在菜单中，选择错误日志 -> 全局配置
将日志级别设置为完整
保存
重现错误
返回错误日志并检查是否记录了您的错误。如果已记录，则选择它并单击 Replay to Gateway Client，然后让我们知道方法、URL、请求标头和请求正文（如果有）+错误响应

痕迹

在您的网关系统中调用 /N/IWFND/TRACES
将用户设置为您将在前端使用以重现问题的用户（或技术用户）
将跟踪级别设置为完全
选中有效负载跟踪复选框
重现问题
现在从 SO 那里很难告诉您如何处理该结果，因为您应该导出结果并以某种方式将其发送给我们 - 但基本上您可以检查请求和响应，还可以将请求重播到网关客户端以在那里测试。

从 UI5 的角度来看，Swadhin 的回答是正确的。

【讨论】：