title: React app error: Failed to construct 'WebSocket': An insecure WebSocket connection may not be initiated from a page loaded over HTTPS
body: <p>I am deploying a React app but am getting a strange error when I visit the page over https.</p>
  
  <p>When I visit the page over https I receive the following error:</p>
  
  <p>SecurityError: Failed to construct 'WebSocket': An insecure WebSocket connection may not be initiated from a page loaded over HTTPS.</p>
  
  <p>But when I go to the page over http it works perfectly.  </p>
  
  <p>The problem is I'm not using websockets as far as I can tell. I searched through the code to see if there is a request to http that should be to https or to ws: instead of wss: but I don't see anything.</p>
  
  <p>Has anyone run into this before?</p>
  
  <p>I am including a copy of the package.json file.
  Let me know if you need me to upload any other parts of  code to help debug.</p>
  
  <p>Thanks in advance.</p>
  
  <pre><code>{
    "name": "client",
    "version": "0.1.0",
    "private": true,
    "dependencies": {
      "@testing-library/jest-dom": "^4.2.4",
      "@testing-library/react": "^9.3.2",
      "@testing-library/user-event": "^7.1.2",
      "baffle": "^0.3.6",
      "cross-env": "^6.0.3",
      "react": "^16.12.0",
      "react-dom": "^16.12.0",
      "react-player": "^1.14.2",
      "react-router-dom": "^5.1.2",
      "react-scripts": "3.3.0",
      "react-typist": "^2.0.5",
      "webpack-hot-dev-clients": "^2.0.2"
    },
    "scripts": {
      "start": "cross-env react-scripts start",
      "build": "react-scripts build",
      "test": "react-scripts test",
      "eject": "react-scripts eject"
    },
    "eslintConfig": {
      "extends": "react-app"
    },
    "browserslist": {
      "production": [
        "&gt;0.2%",
        "not dead",
        "not op_mini all"
      ],
      "development": [
        "last 1 chrome version",
        "last 1 firefox version",
        "last 1 safari version"
      ]
    }
  }
  </code></pre>