How to extract image from wix-fetch response?

Ask the community
, ,
1

Hi! I’m facing a pretty difficult challenge with wix-fetch.

The goal is to send an image from my site frontend to an edit API, receive the modified image, and display it. So far I have no trouble sending the image with a POST, and I know the API modifies it correctly.

The problem is with wix-fetch. There seems to be no way to get an image from the WixFetchResponse object-- the only two decoding methods are .json() which doesn’t work, and .text() which produces this:

image
image1304×259 16.4 KB

Somehow I need to get the (what I assume is binary) data of the png and turn it into an actual PNG. I think the .text() is corrupting everything irreversibly though!

Here’s some code for reference:
image

2

Wix-fetch doesn’t support this. You can use another HTTP library such as axios.

Stackoverflow suggests something like this should work:

axios.get('/file.pdf', {
      responseType: 'arraybuffer'
})

Libraries can be installed using Wix Studio’s package manager: Working with npm Packages

3

Thanks for the reply @anthony! Unfortunately Axios and pretty much any request library seem to not be approved for install via the Wix NPM package manager. Any idea on how I could get it approved? I’m pretty surprised this stuff isn’t allowed/supported.

4

Can you share a screenshot and any error messages you’re getting on the console? I’m able to install axios and similar libraries.

image
image1093×338 26.8 KB

image
image1078×328 24.6 KB

1 Like
5

Sure thing @anthony,

Here’s me trying to install axios:

image
image1071×406 22.7 KB

And needle:

image
image1139×440 38 KB

For reference I have been able to install packages in the past. Here’s Buffer:
image

image
image930×375 22.9 KB

It’s always struck me as strange how many packages aren’t marked with “install” for me… any thoughts?

6

That is very weird. I think this is a bug. Best place to report this is customer care: https://www.wix.com/support-chatbot?nodeId=aedad5ab-8cdd-4c3a-94e9-7a6e3f96835e&referral=bugReportForum

I’ll raise internally as well. What browser and version are you using? Also I assume this is the Wix editor and not Wix Studio?

7

I’m using Firefox 126.0.1 (64-bit) on Windows 10. Yes, it’s Wix Editor.

Just tested on Chrome and it works!

image
image970×607 48 KB

Glad to hear it’s a bug not a feature-- apparently the browser is what’s been causing me a headache this whole time. Thanks!

1 Like
8

Awesome! Glad we got that figured out!

9

@anthony thanks for the help! Much appreciated :slight_smile:

1 Like
10

@PicsGenie Question, what version of Firefox were you using when you encountered this issue? And any plugins such as ad blockers?

11

I was using Firefox 126.0.1 (64-bit) on Windows 10 for the Wix Editor. I had AdBlocker Ultimate installed