Hi everyone, I’m running into a pretty frustrating issue with my website and App Inventor project integration, and I’m hoping someone here can help me figure out what’s going wrong. I’ve been trying to connect my site backend to an App Inventor app through the Web component so I can send and receive JSON data, but things aren’t behaving consistently. Sometimes the app processes the response correctly, but other times it either times out or returns an empty string even though I can confirm via Postman that the server is responding with valid JSON.
The strange part is that the issue seems to be tied to the way my site is handling CORS and HTTPS. On desktop browsers, the API endpoints are reachable without any problem. However, when I trigger the Web component in App Inventor, I either get a 403 forbidden error or the response comes through mangled. I already enabled CORS headers on my server and allowed * as origin for testing, but App Inventor still seems to reject or misread the response.
Another weird thing I’ve noticed is that larger responses (anything over 10KB of JSON) almost always fail. Smaller responses—like simple text strings—work fine most of the time. This makes me think there could be a limitation or some kind of parsing issue on the App Inventor side, but I’m not sure if others have run into the same thing. I even tried compressing the data and sending it in smaller chunks, but then reassembly in the app just creates new bugs.
On the website side, I’m running a fairly standard stack: Nginx + PHP backend with a MySQL database. The API endpoints are working properly when tested directly, and the logs show that App Inventor is making successful requests. But it seems like the response either isn’t being received fully or App Inventor’s Web component isn’t handling the headers the way browsers do. I’ve tried setting Content-Type to both application/json and text/plain, but the results are inconsistent.
What makes this more complicated is that the errors don’t happen 100% of the time. Sometimes the same request works perfectly, and then five minutes later, the exact same call will return an empty or broken response. It’s really hard to debug since the server logs show everything as “200 OK.” I even added extra logging inside the app to check the GotText event, and the output is either truncated or completely blank.
So my main questions are: has anyone else faced inconsistent API calls between their App Inventor app and a custom website backend? Is there some known limitation on JSON size or headers with the Web component? And is there a reliable workaround for handling larger payloads without losing data? I’d really appreciate any advice, because right now this is blocking me from connecting my website to the app the way I need. SOOry for the long post
"inconsistent" makes it difficult! (I have similar issues on my old MG at the moment - fuel/ignition/both!?).
What sort of size is the payload coming down?
Are you testing over wifi or data network ?
Where is your server (hosting provider etc.) ?
Are you sending php requests? If so do simple ones always work (e.g. echo "Hello World"). Show example of current request/s?
What headers are you using ?
Have you tried this:
In answer to one of your questions, personally I have never had any CORS/HTTPS issues when making php requests to a mySQL db.
I would start here first. CORS is a security mechanism implemented by browsers to prevent site A from using site B's cookies to act on your behalf without permission (otherwise, App Inventor could do something like delete your Google account). However, because the Web component isn't a browser, it's not constrained by CORS. That said, if your code expects the CORS headers to be sent from the client, then you will need to add them to the RequestHeaders property. Generally unless your endpoint requires sending an Authorization header I don't see why you should be getting a 403 Forbidden, but you should be able to check your server logs to understand why its rejecting the request.
Could you provide more information here, in particular a screenshot of what the mangled data looks like? Seeing it might make it easier to debug.
For example, if your web server is set up to gzip compress the content back to the client, the Web component isn't set up to that. Specifically, we do not send an Accept-Encoding header and as such the component expects the content to come back uncompressed.
Another potential explanation for "garbled" responses is the component assumes that text content (which would include JSON in this example) is encoded using UTF-8. If you're storing non-UTF-8 encoded strings, then you probably will want to set the ResponseTextEncoding property.
We do not do any processing based on the Content-Type header. It's up to the app developer to decode the content appropriately, so for JSON you'd probably want to pass responseContent through call Web.JsonTextDecodeUsingDictionaries.
I didn’t realize that the Web component isn’t constrained by CORS the same way browsers are, so that’s already a useful clarification. I’ll take a closer look at my server logs to see why the 403s are coming up, and I’ll also try adjusting the RequestHeaders property to better match what my backend expects.
Your points about gzip compression and UTF-8 encoding also make a lot of sense. My server does return gzip-compressed responses by default, so that could explain why larger JSON payloads keep failing. I’ll try disabling compression for the API endpoints or setting the right headers to make sure the responses come back in plain text. I’ll also double-check the ResponseTextEncoding property and test with Web.JsonTextDecodeUsingDictionaries to make sure I’m parsing consistently.