[Filing] Support both Secure/Plain websockets based on the App protocol

Author: meissadia

nginx/nginx.conf

@@ -23,7 +23,7 @@ http {
   add_header Strict-Transport-Security 'max-age=31536000; includeSubDomains; preload';
 
   # CSP
-  add_header Content-Security-Policy "default-src 'self' blob:; script-src 'self' 'unsafe-inline' blob: data: https://tagmanager.google.com https://www.googletagmanager.com https://www.google-analytics.com https://*.cfpb.gov https://www.consumerfinance.gov; img-src 'self' blob: data: https://www.google-analytics.com https://raw.githubusercontent.com; style-src 'self' 'unsafe-inline'; font-src 'self' data:; object-src 'none'; frame-src 'self' https://www.youtube.com/ https://ffiec.cfpb.gov/; connect-src 'self' ws://*.cfpb.gov https://*.cfpb.gov https://www.consumerfinance.gov https://raw.githubusercontent.com https://ffiec-api.cfpb.gov https://ffiec.cfpb.gov https://*.mapbox.com https://www.google-analytics.com https://s3.amazonaws.com;";
+  add_header Content-Security-Policy "default-src 'self' blob:; script-src 'self' 'unsafe-inline' blob: data: https://tagmanager.google.com https://www.googletagmanager.com https://www.google-analytics.com https://*.cfpb.gov https://www.consumerfinance.gov; img-src 'self' blob: data: https://www.google-analytics.com https://raw.githubusercontent.com; style-src 'self' 'unsafe-inline'; font-src 'self' data:; object-src 'none'; frame-src 'self' https://www.youtube.com/ https://ffiec.cfpb.gov/; connect-src 'self' ws://*.cfpb.gov wss://*.cfpb.gov https://*.cfpb.gov https://www.consumerfinance.gov https://raw.githubusercontent.com https://ffiec-api.cfpb.gov https://ffiec.cfpb.gov https://*.mapbox.com https://www.google-analytics.com https://s3.amazonaws.com;";
 
   # Restrict referrer
   add_header Referrer-Policy "strict-origin";

src/App.jsx

@@ -60,6 +60,8 @@ const App = () => {
         <Route component={NotFound} />
       </Switch>
       {showFooter && <Footer config={config} />}
+      {console.log(window.location)
+      }
     </AppContext.Provider>
   )
 }

src/filing/actions/listenForProgress.js

@@ -50,12 +50,14 @@ export default function listenForProgress() {
           const wsBaseUrl = process.env.REACT_APP_ENVIRONMENT === 'CI'
             ? `${window.location.hostname}:8080`
             : `${window.location.host}/v2/filing`
+          
+          const socketType = window.location.protocol == 'https:' ? 'wss' : 'ws'
 
           const wsProgressUrl = quarter
             ? `/institutions/${lei}/filings/${year}/quarter/${quarter}/submissions/${sequenceNumber}/progress`
             : `/institutions/${lei}/filings/${year}/submissions/${sequenceNumber}/progress`
 
-          let socket = new WebSocket(`ws://${wsBaseUrl}${wsProgressUrl}`)
+          let socket = new WebSocket(`${socketType}://${wsBaseUrl}${wsProgressUrl}`)
 
           socket.onopen = (event) => {
             console.log('>>> Socket open! Listening for Progress...')