"Invalid Host header" when attempting to access Vue UI hosted on vm from host machine

[sjordan1975]

Getting "Invalid Host header" error when running Grove UI in my vagrant box and attempting to hit the UI from my host machine.

Fixed with addition of "disableHostCheck: true" (see below)

// in vue.config
module.exports = {
  lintOnSave: false,
  configureWebpack: {
    devtool: 'eval-source-maps'
  },
  devServer: {
    https: appFrontendUsesHttps,
    disableHostCheck: true,
    proxy: {
      '/api': {
        target: middletierUrl,
        secure: false,
        bypass: function(req) {
          if (req.url.startsWith('/api')) {
            console.log(
              'Proxying ' + req.method + ' ' + req.url + ' to ' + middletierUrl
            );
          } else {
            return req.url;
          }
        }
      },
      // for legacy proxying support
      '/v1': {
        target: middletierUrl,
        secure: false,
        bypass: function(req) {
          if (req.url.startsWith('/v1')) {
            console.log(
              'Proxying ' + req.method + ' ' + req.url + ' to ' + middletierUrl
            );
          } else {
            return req.url;
          }
        }
      }
    }
  }
};

[grtjn]

Thanks, I haven't come across this myself yet. I am running the ui from the host usually, but this could be useful intel when running ui from docker for instance. I'm wondering about the root cause though. It is easy enough to disable a check, but it is usually there for a reason. Maybe there is a better way of handling this?