I have deployed my React PWA on AWS Amplify. Works perfectly on the Chrome Desktop browser on localhost as well as when deployed to AWS Amplify. Unfortunately though, on Safari Desktop as well as on Chrome and Safari on my iPhone, I always only get a blank page. Important to know: I am using basic auth.
I have looked into the Safari web developer tools on my iPhone and I can see in the console that I get a 401 error on loading manifest.json. This error does not show up on Chrome on Desktop and here the app works flawlessly as described above.
What could be the cause here?
I have already tried the following:
</^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|ttf|map|json)$)([^.]+$)/> --> index.html (200)homepage in my package.json either to "." or also to the base url of where my AWS amplify deployment landscrossorigin="use-credentials" to the reference of manifest.json in the index.html page (<link rel="manifest" href="%PUBLIC_URL%/manifest.json" crossorigin="use-credentials" />)After reading all possible posts on stackoverflow and anywhere else in the web, I am stuck. Can somebody maybe give me another idea to try out?
Thanks a lot and best regards
EDIT 1: I am trying to use Bluetooth on that React app. What I now also figured out is that I also get an error message Invariant Violation: This device is not capable of using Bluetooth - could that be the reason for the white screen?
OK, for all who might stumble above the same issue in the future - the problem was the Bluetooth connection I was trying to build up. I had not paid enough attention to the console warning Invariant Violation: This device is not capable of using Bluetooth cause I had thought this could not cause the problem. But it did. After removing the Bluetooth capability, the app renders as expected on all browsers no matter if Desktop or mobile device. Now I have another issue finding out how to somehow get around this Bluetooth issue but that's another topic. This question here can be closed / marked solved.