Failed to fetch data. Please test on a device or contact support

[gobassky]

With regards to using web-API blocks on web-preview and responsive web-app, some API sources won’t work. I know this has been discussed before, but it has been bothering me because some APIs I needed only works on mobile devices and not on published web-app. I just want to understand why is it that some website/API sources which worked well on browsers and thunkable mobile live-tests, BUT won’t work specifically on web-preview and web-apps?

I have built an API using python and deployed on “pythonanywhere.com” only to realize that it won’t work on web-apps that I am building. (but worked well everywhere else, including mobile live tests)

On the web-preview window, there is this line “Some web pages cannot be shown in the web preview. Use the Thunkable Live app to preview.” Can any experts out there share why is this so? Not complaining but need to understand what kind of webpages or API sources won’t work so we don’t waste time on it.

Thank you and Happy New Year!!.

[muneer]

The main TWO contributors for this issue is the server security settings that is mostly referred to as CORS and the other issue which determines if the server would accept requests from iframe contents.

In your situation, the second security measure is the one effecting your app, I think.

[Edit]
If you are in control of server side access then just add this to the server header.

header('Access-Control-Allow-Origin: *');

[gobassky]

Thanks @muneer!! Very useful info, will try to work on the server side.

[gobassky]

@muneer, Thanks for the fantastic tip. My web-app is working with my API, and guess what, I only need to a one liner into my code (using python flask):

    retJson.headers.add("Access-Control-Allow-Origin", '*')

Thanks a lot. Best New Year gift !!