0

I have deployed my VueJS application to netlify. My app works fine on my local machine, and the production deployment works in Chrome, but Firefox gives the following error when you hit 'connect'.

This is attempting to connect to an MQTT broker over websockets.

DOMException: "The operation is insecure."

You can see a working example here:

https://inspiring-beaver-f90fa7.netlify.com/

corycorycory
  • 1,448
  • 2
  • 23
  • 42
  • 1
    Possibly same [same problem](https://stackoverflow.com/questions/53802391/vuejs-domexception-the-operation-is-insecure)? What exactly does a `Connect` button handler doing? Show some code... – Michal Levý Nov 26 '19 at 15:32
  • Its calling the newConnection() function here: https://github.com/cory-weiner/Vue-Mqtt-Client-Dashboard/blob/master/mqtt-dashboard/src/components/Home.vue – corycorycory Nov 26 '19 at 15:48
  • You say its working on your machine. What browser you use there? Maybe try to deploy the app in dev mode ? – Michal Levý Nov 26 '19 at 16:16
  • I figured it out. Firefox blocks connections between https and non encrypted websockets. I needed to connect to a wss:// broker. – corycorycory Nov 26 '19 at 23:08
  • Make sense. Good job! :) – Michal Levý Nov 26 '19 at 23:09

1 Answers1

2

I figured it out.

Firefox blocks connections from https to unsecured websockets (ws:// or mqtt://)

In this case I needed to switch to a secured broker (wss://) and everything works fine.

Alternatively you can force firefox to allow this connection by Going to firefox's about:config and toggling network.websocket.allowInsecureFromHTTPS will get rid of the SecurityError. Documented here: Firefox Websocket security issue

corycorycory
  • 1,448
  • 2
  • 23
  • 42