From 00003193dfdc3c8952e71efbf47979c4dcf4ab8b Mon Sep 17 00:00:00 2001
From: Jason Aslakson <jason.aslakson@americastestkitchen.com>
Date: Sat, 19 Jan 2019 07:39:09 -0500
Subject: [PATCH] Additional config options for hot reloader web socket
 connection (#6083)

* Additional config options for hot reloader web socket connection

* Apply suggestions from code review

Accepting suggested code changes

Co-Authored-By: jaslakson <jason.aslakson@americastestkitchen.com>

* updated README with websocket proxy options

* Fix test / cleanup port setting

* Always set proxy_path
---
 packages/next-server/server/config.js            |  4 +++-
 packages/next/README.md                          |  4 ++++
 packages/next/client/on-demand-entries-client.js |  5 +++--
 packages/next/server/hot-reloader.js             | 15 +++++++++------
 4 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/packages/next-server/server/config.js b/packages/next-server/server/config.js
index d98a1fcb..a587173e 100644
--- a/packages/next-server/server/config.js
+++ b/packages/next-server/server/config.js
@@ -18,7 +18,9 @@ const defaultConfig = {
   onDemandEntries: {
     maxInactiveAge: 60 * 1000,
     pagesBufferLength: 2,
-    websocketPort: 0
+    websocketPort: 0,
+    websocketProxyPath: '/',
+    websocketProxyPort: null
   }
 }
 
diff --git a/packages/next/README.md b/packages/next/README.md
index d94d5a4e..24abfb9a 100644
--- a/packages/next/README.md
+++ b/packages/next/README.md
@@ -1297,6 +1297,10 @@ module.exports = {
     pagesBufferLength: 2,
     // optionally configure a port for the onDemandEntries WebSocket, not needed by default
     websocketPort: 3001,
+    // optionally configure a proxy path for the onDemandEntries WebSocket, not need by default
+    websocketProxyPath: '/hmr',
+    // optionally configure a proxy port for the onDemandEntries WebSocket, not need by default
+    websocketProxyPort: 7002,
   },
 }
 ```
diff --git a/packages/next/client/on-demand-entries-client.js b/packages/next/client/on-demand-entries-client.js
index ada77640..210b102b 100644
--- a/packages/next/client/on-demand-entries-client.js
+++ b/packages/next/client/on-demand-entries-client.js
@@ -3,7 +3,8 @@
 import Router from 'next/router'
 import fetch from 'unfetch'
 
-const { hostname } = location
+const { hostname, protocol } = location
+const wsProtocol = protocol.includes('https') ? 'wss' : 'ws'
 const retryTime = 5000
 let ws = null
 let lastHref = null
@@ -19,7 +20,7 @@ export default async ({ assetPrefix }) => {
     }
 
     return new Promise(resolve => {
-      ws = new WebSocket(`ws://${hostname}:${process.env.NEXT_WS_PORT}`)
+      ws = new WebSocket(`${wsProtocol}://${hostname}:${process.env.NEXT_WS_PORT}${process.env.NEXT_WS_PROXY_PATH}`)
       ws.onopen = () => resolve()
       ws.onclose = () => {
         setTimeout(async () => {
diff --git a/packages/next/server/hot-reloader.js b/packages/next/server/hot-reloader.js
index 11128c7d..20060a02 100644
--- a/packages/next/server/hot-reloader.js
+++ b/packages/next/server/hot-reloader.js
@@ -164,10 +164,13 @@ export default class HotReloader {
     return del(join(this.dir, this.config.distDir), { force: true })
   }
 
-  addWsPort (configs) {
-    configs[0].plugins.push(new webpack.DefinePlugin({
-      'process.env.NEXT_WS_PORT': this.wsPort
-    }))
+  addWsConfig (configs) {
+    const { websocketProxyPath, websocketProxyPort } = this.config.onDemandEntries
+    const opts = {
+      'process.env.NEXT_WS_PORT': websocketProxyPort || this.wsPort,
+      'process.env.NEXT_WS_PROXY_PATH': JSON.stringify(websocketProxyPath)
+    }
+    configs[0].plugins.push(new webpack.DefinePlugin(opts))
   }
 
   async getWebpackConfig () {
@@ -200,7 +203,7 @@ export default class HotReloader {
     })
 
     const configs = await this.getWebpackConfig()
-    this.addWsPort(configs)
+    this.addWsConfig(configs)
 
     const multiCompiler = webpack(configs)
 
@@ -229,7 +232,7 @@ export default class HotReloader {
     await this.clean()
 
     const configs = await this.getWebpackConfig()
-    this.addWsPort(configs)
+    this.addWsConfig(configs)
 
     const compiler = webpack(configs)