Wednesday, 22 January 2020

SAP B1, How to display fetched Image from ItemImage?

I'm fetching an image from SAP B1 Service Layer. In postman, I'm able to view it as image/png, but there is an issue displaying it.

What's the correct way to show it in <img />?

require(fetchedImage) - doesn't work


I have created a Cloud Function to fetch the image and pass it on to the client, but I am not sure how to do it.

Having a super weird object something like this

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

Don't know how to pass it via res.send(IMAGE IN PNG) so I can see get an image on the client-side.

Checked base64 conversion but I'm not sure how to use them.


Update

Postman Request: (This is working fine)

GET : https://su05.consensusintl.net/b1s/v1/ItemImages('test')/$value

Headers: SessionId: ASK ME WHEN YOU TRY

For some reason, we can't fetch the Image directly in Front-End and need to create a middleware so we're doing it in Firebase Cloud Function

So here is the function which fetches the image and doesn't know how to pass it.

Here is the function in 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);

And we're getting a response like this:

{ status: 200,

statusText: 'OK',

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<\u0000\u0000\u0003hiTXtXML:com.adobe.xmp\u0000\u0000\u0000\u0000\u0000

THIS IS SUPER LONG AND GOES FOR 80-100 more lines

If you want to test you can use the following:

Postman:

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

body: {"productId":"test"}

Valid productId are: 1. "RR000102" 2. "test" 3. "RR000101"



from SAP B1, How to display fetched Image from ItemImage?

No comments:

Post a Comment