SAP B1,如何显示从 ItemImage 获取的图像?

2024-02-08

我正在从 SAP B1 服务层获取图像。 在邮递员中,我可以将其视为image/png,但显示它时出现问题。

正确的显示方式是什么<img />?

require(fetchedImage)- 不起作用


我创建了一个云函数来获取图像并将其传递给客户端,但我不知道该怎么做。

有一个像这样的超级奇怪的物体

 data:
>     '�PNGörönöu001aönöu0000öu0000öu0000örIHDRöu0000öu.........

不知道如何通过res.send(IMAGE IN PNG)这样我就可以在客户端看到图像。

Checked base64转换,但我不知道如何使用它们。


Update

邮递员请求:(这工作正常)

GET : https://su05.consensusintl.net/b1s/v1/ItemImages https://su05.consensusintl.net/b1s/v1/ItemImages('测试')/$值

Headers: 会话 ID:当你尝试时问我

由于某种原因,我们无法直接在前端获取图像,需要创建一个中间件,所以我们在Firebase Cloud Function

所以这里是获取图像的函数,但不知道如何传递它。

这是 Firebase Cloud Function 中的函数:

if (!req.body.productId) {
      res.status(400).send({ error: "productId is required" });
      return;
    }

    console.log("Starting the process");

    const productId = req.body.productId;

    const login = await Auth.login();
    const fetchedImg = await ItemMaster.getImage(login["SessionId"], productId);

    //Here in the fetchedImg, we're getting some data like
    res
      .status(200)
      .set("Content-Type", "image/png")
      .send(fetchedImg);

我们得到这样的回应:

{ 状态:200,

状态文本:“确定”,

headers:

{ server: 'nginx',

  date: 'Wed, 22 Jan 2020 03:52:22 GMT',

  'content-type': 'image/png',

  'transfer-encoding': 'chunked',

  connection: 'close',

  dataserviceversion: '3.0',

  'content-disposition': 'inline; filename="rr-96600.png"',

  vary: 'Accept-Encoding',

  'set-cookie': [ 'ROUTEID=.node2; path=/b1s' ] },

config:

{ url:

data:

'�PNG\r\n\u001a\n\u0000\u0000\u0000\rIHDR\u0000\u0000\u0000�\u0000\u0000\u0000�\b\u0002\u0000\u0000\u0000\u0006\u001fS�\u0000 \u0000\u0000\u0019tEXtSoftware\u0000Adobe ImageReadyq�e

这是超长的,需要 80-100 行以上

如果您想测试,可以使用以下内容:

Postman:

POST: https://us-central1-rapid-replacement.cloudfunctions.net/getImageFromItems https://us-central1-rapid-replacement.cloudfunctions.net/getImageFromItems

主体:{“productId”:“测试”}

有效的产品 ID 为:1.“RR000102”2.“测试”3.“RR000101”


如果要动态使用图像,则必须在安装组件后立即获取图像并随后插入。然后,获取的图片应保存在组件的状态中,并从那里包含在 img 标签的 src attrbut 中。假设您已经可以获取图片,下面的代码应该可以工作。

import React, { Component } from "react";

export default class ComponentWithFetchedImage extends Component {
  constructor() {
    super();
    this.state = { image: undefined };   
  }

  componentDidMount() {
    let fetch_url = "https://picsum.photos/200";   // Insert your fetch url here
    fetch(fetch_url)
      .then(res => res.blob())
      .then(blob => URL.createObjectURL(blob))
      .then(url => this.setState({ image: url }))
      .catch(err => console.log(err));
  }

  render() {
    return (
      <div className="component">
        <img src={this.state.image} alt="" />
      </div>
    );   
  }
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

SAP B1,如何显示从 ItemImage 获取的图像? 的相关文章

随机推荐