fix: use relative HMR path (#9734)

Construct webpack hmr path relative to the request origin path to prevent url construction issues when accessing from local ip or any other ip that may be mapped to the dev server.

This PR makes following changes to `getHmrPath()` method in `packages/gatsby/src/utils/webpack.config.js`

- Always use the relative path `/`
- Getting rid of manual url construction with protocol, hosts, ports etc as the relative path will automatically take care of this construction

<!--
  Q. Which branch should I use for my pull request?
  A. Use `master` branch (probably).

  Q. Which branch if my change is a bug fix for Gatsby v1?
  A. In this case, you should use the `v1` branch

  Q. Which branch if I'm still not sure?
  A. Use `master` branch. Ask in the PR if you're not sure and a Gatsby maintainer will be happy to help :)

  Note: We will only accept bug fixes for Gatsby v1. New features should be added to Gatsby v2.

  Learn more about contributing: https://www.gatsbyjs.org/docs/how-to-contribute/
-->

packages/gatsby/src/utils/webpack.config.js

@@ -71,10 +71,8 @@ module.exports = async (
   }
 
   function getHmrPath() {
-    let hmrBasePath = `${program.ssl ? `https` : `http`}://${
-      program.host
-    }:${webpackPort}/`
-
+    // ref: https://github.com/gatsbyjs/gatsby/issues/8348
+    let hmrBasePath = `/`
     const hmrSuffix = `__webpack_hmr&reload=true&overlay=false`
 
     if (process.env.GATSBY_WEBPACK_PUBLICPATH) {