API CORS and Failed to fetch errors

I am a complete newbie to the Appgyver platform, and indeed to the whole app building experience!
I am attempting to build an app for work purposes and trying to integrate a " Tidal heights page into the app. I have been supplied with a Request URL (https://admiraltyapi.azure-api.net/uktidalapi/api/V1/Stations/0065/TidalEvents?duration=1) and a subscription key.
Now, I have watched the videos on Appgyver, and youtube and entered the details in the fields within the data tab but no matter what i try i always get a response of
“Failed to fetch. does the server allow CORS?”, despite trying every combination possible suggested on you tube, learning videos etc i always get the same response.
is there anyone out there could advice me on how i move forward on this as I’ve hit a brick wall!

Some resources to check before you post:

AppGyver Academy: SAP AppGyver Quick-Start

Troubleshooting FAQ: SAP AppGyver FAQ

Have you tested the url on postman.com? I usually test this to see the type of response from the server. Sometimes the json doesn’t come well formatted and appgyver might not work with it. You can also filter using the Response key path field to get only the key that contains the data.

I too am a newbie with AppGyver, and also struggling. Especially when it is a secured service that you are trying to call to. It seems to me that AppGyver only gives one error message regardless of what the error actually is. It would be nice if they passed through the actual message.

Just as a quick sanity check, have you updated the headers for your request to include
Ocp-Apim-Subscription-Key ?

@Michael_Nicholson , I checked the Tidal Events API itself and it is not CORS enabled on the API provider side. When it comes to SAP Appgyver, given the Composer Pro is a browser based tool and the API requires a header this will trigger a CORS flow.
First, you might want to check/try whether you can pass the API subscription key in the URL itself. That would have likely suppressed the CORS flow when calling that very API endpoint.

But ultimately you might need to use an API proxy as a wrapper to your non-CORS enabled API endpoints. This is what I am doing and have done to make it work with SAP Appgyver.

I hope that helps;

PS. the screenshots:

It’s not a long term solution but there is a free cors proxy at justcors.com just to see if that’s your issue or not. The proxy url lasts for only a day and then you have to pay but, for example, you would change your url from https://admiraltyapi.azure-api.net/uktidalapi/api/V1/Stations/0065/TidalEvents?duration=1 to https://justcors.com/tl_e217bbe/https://admiraltyapi.azure-api.net/uktidalapi/api/V1/Stations/0065/TidalEvents?duration=1 .

It solved my cors problems and then you know you need a proxy (you don’t want to put sensative api keys into appgyver when deploying anyway so you’ll need a proxy at that point regardless…)

Hi, thanks for responding. Ive tried all sorts of variations over the last couple of weeks. I have indeed tried including the subscription key in the header. to no avail. Its frustrated me to the point of losing any enthusiasm I had, hence posing the question on this forum. the rest of Appgyver is fairly easy and intuitive and ive had no issues

Thank you for taking the time to help me. I will try Postman.com and see what sort of response i get.
Postman.com has come back saying that my subscription key has invalid whitespace characters. This is the key that was provided, i will contact the developer to see if they can enlighten me. once again, thanks for your assistance

Thanks for taking some time to have a look at my api, its very much appreciated. I will have a try with your suggestion, as you seem to have got it working! Once again, many thanks for taking the time to help.

1 Like