Wix Failed to Fetch

Ask the community
,
1

Hello,
I’m trying to make a http GET request to my server from my Wix website but I keep getting a “Failed to fetch” error. For the moment, I’m triggering this by clicking a button on the website, so it’s on the front end.
Things to note:

  1. A different url is working properly (https://currencydatafeed.com/api/data.php?token=9oduok4k8xsdvlrcw9um&currency=USD/ARS)

  2. My URL is working just fine from a browser window or from my mobile applications

  3. The request is coming through and being logged on the server, it’s just that Wix is unable to also retrieve the reply

  4. The URL is https with valid certificate.

Here’s the code:

var options = {
‘method’ : ‘get’
};

fetch ( fullUrl ,  options ) 
    . then (( httpResponse ) => { 
        if  ( httpResponse . ok ) { 
            **return**  httpResponse . json () 
        }  **else**  { 
            **return**  Promise . reject ( "fetch call failed" ) 
        } 
    }) 
    . then ( json  => { 
        console . log ( JSON . stringify ( json )); 
    }) 
    . catch ( err  =>  console . log ( "Error fetching: "  +  err ));

Thank you.

1 Like
2

Hey! Do not post your token here!

Can you do a console log on the httpResponse?

3

If the token is private, do not put it on the front end. Put it into backend instead (see Velo examples, there are some examples for HTTP and Fetch)

4

Hi,
The URL containing the token is copy-paste from a different thread here and it seems to be already maxed-out, so no issues :slight_smile: It was just a comparison URL.
I intend to eventually have this code in the backend on the onNewOrder event, I’m just testing it now.

There is no console.log to be done on httpResponse because the “.then” is not getting called, it’s jumping directly to “.catch”.

5

You might need to dig the response result, alternatively, you can use postman to try the call and generate the code for fetch using Npm

6

@certified-code Not sure what you mean by “dig the response result”. It looks like fetch is simply throwing exception. It’s puzzling as to why it’s working with one website and not the other, are there any specific rules the website being called should follow other than being https and replying with a JSON result?

7

Same exact code is working from the backend…

8

Hey @radustavila , I had this error as well yesterday. Here’s how you can approach solving it

  1. Make sure you’ve imported import {fetch} from ‘wix-fetch’ . If you haven’t, your browser is compiling your Velo code to native JavaScript, and trying to use the native JS fetch function instead of Wix’s.

  2. If that’s already there, and you’re 100% sure the response will always be well formatted JSON from your GET request, you can use the getJSON function instead - { getJSON } from ‘wix-fetch’. This was what ultimately worked for my API call.

  3. If all else fails, since you know it’s working from the backend, you can create a backend module to do the API call, and pass the data to the front-end. This is a better approach, generally.

The reason it’s working on your backend calls differently from the front-end is that in the backend functions, Wix is using node-fetch to handle fetch requests, which works a little differently from the browser’s fetch API.

Also, when making the request from the backend, you don’t have any CORS issues to contend with, which happens when the API you’re calling is verifying which website you’re calling it from. On the backend, it’s all fair game.

Let me know if this helps!

9

I have the exact same issue and its quite intensive work to debug this if the only error message you have is “TypeError: Failed to fetch”

10

Another good API for getting currency exchange rates would be https://currencyapi.com .

They have a similar URL: https://api.currencyapi.com/v3/latest?apikey=YOUR_ACCESS_KEY