HERE geocoder-autocomplete with ReactJS suddenly returning Network Error on Firefox

Question

I've implemented the solution from the HERE tutorial and it worked well on firefox and chrome. However, few weeks ago it stopped working on Firefox and started returning Network Error. The request doesn't even show on my network log.

I've tested the API EndPoint w/ my credentials and it worked. It also worked on Google Chrome.

I've tried to hardcode the credential and also via .env and neither approach worked on firefox

My code:

try {
  const address = await axios.get(`https://autocomplete.geocoder.api.here.com/6.2/suggest.json`,{
    params: {
      app_id: APP_ID_HERE,
      app_code: APP_CODE_HERE,
      query,
      maxresults: 1,
      country: 'AUS',
      state: 'Western Australia'
    }
  });    
  console.log('address:',address);
} catch (error) {
  console.log('address-error:',error);
}

Dependencies:

"dependencies": {
  "axios": "^0.19.0",
  "react": "^16.8.6",
}

Have HERE changed anything towards this API?

I've also raised the issue with Axios -> https://github.com/axios/axios/issues/2388

Thanks

Answer 1

This is more related to firefox web-socket security issue, for resolution please refer Firefox Websocket security issue and do let us know if you still have issues with this.

The app itself is under SSL but the websocket being accessed is not. Chrome and Opera don't care but Firefox does. According to:

https://bugzilla.mozilla.org/show_bug.cgi?id=303952

This is known and is not considered a bug. Mozilla's response: wontfix

Solution, put websocket server under SSL and use wss://