docker-ext: Fix portforward issue

In docker desktop since the backend is running
inside a container portforwards running in the
container are not accessible from the host machine
to fix this a range of ports from 30000 to
32000 is exposed and a value in this range is used
when starting a portforward.

Signed-off-by: yolossn <[email protected]>

backend/cmd/headlamp.go

@@ -101,6 +101,7 @@ type PortForwardPayload struct {
 	ServiceNamespace string `json:"serviceNamespace"`
 	TargetPort       string `json:"targetPort"`
 	Cluster          string `json:"cluster"`
+	Address          string `json:"address"`
 	Port             string `json:"port"`
 }
 
@@ -589,6 +590,9 @@ func createHeadlampHandler(config *HeadlampConfig) http.Handler {
 			id := uuid.New().String()
 			p.ID = id
 		}
+		if p.Address == "" {
+			p.Address = "localhost"
+		}
 
 		reqToken := r.Header.Get("Authorization")
 		splitToken := strings.Split(reqToken, "Bearer ")
@@ -883,7 +887,7 @@ func (c *HeadlampConfig) startPortForward(p PortForwardPayload, token string) er
 	stopChan, readyChan := make(chan struct{}), make(chan struct{}, 1)
 	out, errOut := new(bytes.Buffer), new(bytes.Buffer)
 
-	forwarder, err := portforward.New(dialer, ports, stopChan, readyChan, out, errOut)
+	forwarder, err := portforward.NewOnAddresses(dialer, []string{p.Address}, ports, stopChan, readyChan, out, errOut)
 	if err != nil {
 		return fmt.Errorf("portforward request: failed to create portforward: %v", err)
 	}

docker-extension/docker-compose.yml

@@ -8,3 +8,4 @@ services:
       - ~/.kube/:/headlamp/config:ro
     ports:
       - 64446:64446
+      - "30000-32000:30000-32000"

frontend/src/components/common/Resource/PortForward.tsx

@@ -166,6 +166,38 @@ export default function PortForward(props: PortForwardProps) {
     const serviceNamespace = namespace;
     const serviceName = !isPod ? resourceName : '';
     const podName = isPod ? resourceName : pods[0].metadata.name;
+    var port = portForward?.port;
+
+    let address = 'localhost';
+    // In case of docker desktop only a range of ports are open
+    // so we need to generate a random port from that range
+    // while making sure that it is not already in use
+    if (helpers.isDockerDesktop()) {
+      const validMinPort = 30000;
+      const validMaxPort = 32000;
+
+      // create a list of active ports
+      const activePorts: string[] = [];
+      const portForwardsInStorage = localStorage.getItem(PORT_FORWARDS_STORAGE_KEY);
+      const parsedPortForwards = JSON.parse(portForwardsInStorage || '[]');
+      parsedPortForwards.forEach((pf: any) => {
+        if (pf.status === PORT_FORWARD_RUNNING_STATUS) {
+          activePorts.push(pf.port);
+        }
+      });
+
+      // generate random port till it is not in use
+      while (true) {
+        const randomPort = (
+          Math.floor(Math.random() * (validMaxPort - validMinPort + 1)) + validMinPort
+        ).toString();
+        if (!activePorts.includes(randomPort)) {
+          port = randomPort;
+          break;
+        }
+      }
+      address = '0.0.0.0';
+    }
 
     setLoading(true);
     startPortForward(
@@ -175,7 +207,8 @@ export default function PortForward(props: PortForwardProps) {
       numericContainerPort,
       serviceName,
       serviceNamespace,
-      portForward?.port,
+      port,
+      address,
       portForward?.id
     )
       .then((data: any) => {

frontend/src/lib/k8s/apiProxy.ts

@@ -1395,6 +1395,7 @@ export function startPortForward(
   service: string,
   serviceNamespace: string,
   port?: string,
+  address: string = '',
   id: string = ''
 ) {
   return fetch(`${helpers.getAppUrl()}portforward`, {
@@ -1411,6 +1412,7 @@ export function startPortForward(
       targetPort: containerPort.toString(),
       serviceNamespace,
       id: id,
+      address,
       port,
     }),
   }).then((response: Response) => {