WIP: Refs #21312 - add webpack url with hostname csp

app/controllers/application_controller.rb

@@ -382,15 +382,33 @@ def parameter_filter_context
   end
 
   def allow_webpack
-    webpack_csp = { script_src: [webpack_server], connect_src: [webpack_server],
-                    style_src: [webpack_server], img_src: [webpack_server] }
+    webpack_urls = [webpack_server, webpack_server_hostname, webpack_server_localhost]
+
+    webpack_csp = {
+      script_src: webpack_urls, connect_src: webpack_urls,
+      style_src: webpack_urls, img_src: webpack_urls
+    }
 
     append_content_security_policy_directives(webpack_csp)
   end
 
-  def webpack_server
+  def webpack_server_url hostname = request.host
+    protocol = request.protocol
     port = Rails.configuration.webpack.dev_server.port
-    @dev_server ||= "#{request.protocol}#{request.host}:#{port}"
+
+    "#{protocol}#{hostname}:#{port}"
+  end
+
+  def webpack_server
+    @dev_server ||= webpack_server_url
+  end
+
+  def webpack_server_hostname
+    webpack_server_url Socket.gethostname
+  end
+
+  def webpack_server_localhost
+    webpack_server_url 'localhost'
   end
 
   class << self

config/webpack.config.js

@@ -25,11 +25,8 @@ var args = argvParse({
   },
   port: {
     type: 'string',
-  },
-  host: {
-    type: 'string',
   }
-})
+});
 
 const supportedLocales = () => {
   const localeDir = path.join(__dirname, '..', 'locale');
@@ -54,10 +51,14 @@ const devServerConfig = () => {
     throw result.error;
   }
 
+  const host = process.env.BIND || 'localhost';
+  const publicHost = host === '0.0.0.0' ?
+    (args.public || os.hostname()) : host;
+
   return {
     port: args.port || '3808',
-    host: args.host || process.env.BIND || 'localhost',
-    publicHost: removePort(args.public) || args.host || os.hostname(),
+    host,
+    publicHost,
     protocol: args.https ? 'https' : 'http',
   }
 }

script/foreman-start-dev

@@ -1,3 +1,15 @@
 #!/bin/sh
-./node_modules/.bin/webpack-dev-server --config config/webpack.config.js --host 0.0.0.0 --disable-host-check $WEBPACK_OPTS &
+
+# load the .env file
+if [ -f ".env" ];
+then
+   set -a
+   . ./.env
+   set +a
+   echo ".env file loaded."
+else
+   echo ".env file does not exist."
+fi
+
+./node_modules/.bin/webpack-dev-server --config config/webpack.config.js --disable-host-check $WEBPACK_OPTS &
 ./bin/rails server -b 0.0.0.0 "$@"