I have a very bad problem I can’t solve by myself. I hope you can help me
I have written a Twitch extension for PC (not released, yet). It all worked well and because I’m satisfied with the current state of the extension, I have decided to release the 1.0.0 version of it. But then, I just thought of whether it would work on mobile, too.
So I activated mobile view of it and it looked exactly like on the PC. But then a message occurred, that my backend is not available (message for the user; errors are logged).
Here some facts and things I’ve already tested:
On PC, it works in Chrome, Edge and Firefox on Windows.
My smartphone is Android 10 (Sony Xperia).
My smartphone can access my backend via Chrome, but not from inside Twitch app.
It cannot be a CORS problem. Methods, Headers and Origins are all allowed.
It cannot be a SSL problem. A valid certificate is installed and works perfectly on PC.
I have tried to set a manifest.xml with internet permissions, but it didn’t work either. I’m also not very sure if I have done it correctly.
Mobile versions of extensions are still just webpages, you don’t need any manifest or special permissions or anything like that (except for iOS, where you need the extension to be whitelisted by providing an Apple Developer ID).
If a request to your EBS isn’t working, log whatever error you’re getting. Without knowing what error you’re getting there’s not much anyone can do to help.
No request arrives at my Apache2 (both logs, access and error, remain empty).
The XMLHTTPRequest returns with readystate === DONE, but status is 0 and response is undefined.
fetch() throws an empty error, which resolves to an empty object after a call to JSON.parse().
I hoped to get an error from browser console (or anything like that), but I couldn’t find any way to open it from inside the Twitch app.
After two days, I actually found an error.
It was kind of hidden, because JSON.stringify() doesn’t include getter and their current values. Even iterating over the object via a for-loop didn’t show them. Checking on .constructor (.prototype doesn’t exist on this specific object) did the trick to find out its type and the corresponding getters.
The promise of fetch() rejects with a TypeError and the following message: “Failed to fetch”.
That seems to be a network error. But other extensions (and the Twitch app itself) doesn’t have any problems.
I spent the last three days trying things and searching via Google, but I’m not a single step further to a solution.
Is there nobody who can help me?
As always, as soon as I ask about help, I get new ideas.
Even if the source code of another extension (I’m currently using, but because it doesn’t work as I need it, I decided to write an own one) is not public, I just came to the idea, that the code might not be minified. And yes, it isn’t.
So I searched through the source code of the other extension and it does make requests exactly like I do. So this can’t be the problem.
That led me to another question, which might solve my problem: Is it possible, that the Twitch mobile app disallows requests of mobile extensions, which are not released, yet?
I guess I’m trying that by just release the extension and see if it works after.
I didn’t know that there configurations exist, which are valid for browsers but invalid for mobile apps. Using your link to check my backend revealed that it just got a B-rank. Now, I completely changed my backend and it gets an A-rank.
But the best is, that the mobile version is now working!!