React app works fine but not on mobile browsers - javascript

My react-redux app works fine on regular browsers but not on mobile browsers. I've used Remote Debugging on Android Devices to check what's going on and I get these 2 errors:
OPTIONS http://iisnode.local/login 0 ()
Uncaught (in promise) TypeError: Failed to fetch
The app makes many fetch requests but I'm afraid that fetch is not supported by chrome mobile. Any help would be much appreciated.

Looks like a CORS problem. Make sure the protocol for your requests is "HTTPS". If you are using Node, in your server.js code, use the standard CORS npm package.
Chrome for Android, version 42 onwards supports the fetch API. Why aren't you using error handling if the promise is rejected anyway

Related

Javascript Modules not working on some clients

I recently started using Javascript modules in my websites, and everything was fine when developing on my desktop. I went to do work on my laptop, but for some reason JS is throwing the following error:
Failed to load module script: Expected a JavaScript module script but
the server responded with a MIME type of "text/plain". Strict MIME
type checking is enforced for module scripts per HTML spec.
Both of my machines are on the latest version of Windows 10 and Brave browser. Google doesn't have anything, and I am out of ideas. My best guess is some weird browser version issue, but I cant find anything about it.
Answer:
This is an issue with the http server I was using. My version of Python's http server on my laptop doesnt support modules. this post fixed my issue.
Also why do I have to wait 2 days to mark this as an answer?

XMLHttpRequest Exception 101 in hybrid mobile application

I have a hybrid mobile application which works on both android and ios devices.
The problem with it is that the application works fine when run on Android. However, there is a Network Error: XMLHttp Request Exception 101: saying server is unresponsive while running the application in iOS.
The application uses Cordova 2.9
I have been trying out solutions like setting async to true(initially it was false). But it does not solve my issue.
Can you please tell me the reason and the solution to be provided.
Thanks.
Make sure that you are using JSONP data format in IOS. This same as Json, but a callback function is needed.

WebSocket network error: OSStatus Error -9807: Invalid certificate chain

I'm getting following error while connecting to websocket's in safari, In remaining browsers it is working fine
Error:
WebSocket network error: OSStatus Error -9807: Invalid certificate chain
Code:
var websocket = new WebSocket("wss://localhost:44300/websocketHome", "Room_123")
The workaround is to enable NSURLSession Websocket in Settings > Safari > Advanced > Experimental Features > NSURLSession Websocket. Should work on iOS 13.4.1+.
Note this may not be suitable for production environments.
So I'm going to start this answer with a caveat: I'm not an expert in WebSockets, Browsers, Safari, or URLs. The reason I mention this is that I don't know why this solution works and I don't know why Safari behaves in the way that it does.
I spent a good couple of hours figuring out why my site wasn't working in Safari, but was working in every other browser. And it pisses me off, because I don't have time for this rubbish.
Essentially what you need to do is replace this:
var websocket = new WebSocket("wss://localhost:44300/websocketHome", "Room_123")
with this:
var websocket = new WebSocket("ws://localhost:44300/websocketHome", "Room_123")
But don't kick yourself yet, because you weren't imagining it when it worked in Chrome and Firefox. Safari seems to be the only browser enforcing the protocol part of the URL, i.e. "ws" instead of "wss" for localhost connections.
Basically I don't have time to research if Safari is following the standard properly or not, but it doesn't matter, because I'm going to chalk this up as yet another example of Safari(the Internet Explorer of 2017) unnecessarily breaking from the herd to make life difficult for web developers.
If Apple want to enforce standards that the other browsers don't, they're welcome to do that, but they at least need to print useful errors, WebSocket network error: OSStatus Error -9807: Invalid certificate chain isn't good enough.
Edit
This will be obvious to most people, but for those who aren't professional developers, make sure you don't deploy this change to production. You want to be using the wss protocol for production, and that should work fine on Safari if you've got your certificates set up properly.
We ran into this error, secure WebSockets weren't working in newer versions of OSX under Safari and Chrome, with a LetsEncrypt certificate. The fix for us was to replace references to "cert.pem" with "fullchain.pem", as described in this link
https://community.letsencrypt.org/t/issues-on-mac-with-wss-osstatus-error-9807-invalid-certificate-chain/160930

Google Maps API Not Loading On iPad

I have a webpage that uses the Google Maps API to load a custom map. The map works on Windows and Mac in all major browsers, however it does not work on an iPad. I have tested it on Safari Mobile and Chrome Mobile and the same issue is happening. Nothing shows up and I get the following error in the console:
[Error] Failed to load resource: The certificate for this server is invalid.
You might be connecting to a server that is pretending to be “maps.gstatic.com”
which could put your confidential information at risk. (main.js, line 0)
Any help on what this means would be greatly appreciated. Thanks.
I figured out the issue was that we were using the HTTP protocol. Using HTTPS protocol when issuing requests to the API fixed the issue on the iPad.
I had very same issue. But my case is just opposite to #dcod, where the development version of my app is http:// and hence I need to use http:// of maps.google.com.
I will update the behavior in the production where the app is going to be https://

Chrome plugin development: user:pass#url not supported by Google Chrome anymore?

I develop a Chrome plugin that uses XMLHttpRequest to send a GET HTTP request with an username/password to a basic-auth-protected URL, so that it can then "auto-login" to it afterwards (since Chrome caches credentials for HTTP basic-auth).
Here's the code I use:
var xml = new XMLHttpRequest();
xml.open('GET',<url>,false,<username>,<password>)
xml.send('');
It used to work fine for quite a while, but started failing some time ago. The plugin code hasn't changed, so I thought it could have to do with Chrome itself. I downloaded a previous version for OSX (17) and BAM, it worked again.
After some additional research, I found out that it might have to do with Chrome 19 not supporting the username:pwd#url syntax for authenticating to basic-auth protected URLs, because when I send the XMLHttpRequest, I see this in Google Chrome's js console:
GET http://user:pass#domain.com 401 (Unauthorized)
Does anyone know whether it's a bug or if Chrome stopped supporting this feature?
Thanks,
Marcelo.
You are not the only person having this issue. It's ruffled several other people's feathers.
However, given the comments from the Chromium Developers:
The support for embedded auth in URLs was intentionally deprecated.
It looks like it was removed intentionally.

Categories