feat: add switch http(s) button to error page

coder · f0ssel · Apr 26, 2024 · Apr 11, 2024 · Apr 11, 2024 · Apr 11, 2024
commit e545ad19b7e4b6952417ab5ccbc627834683e73f
diff --git a/coderd/tailnet.go b/coderd/tailnet.go
@@ -4,11 +4,14 @@ import (
 	"bufio"
 	"context"
 	"crypto/tls"
+	"fmt"
 	"net"
 	"net/http"
 	"net/http/httputil"
 	"net/netip"
 	"net/url"
+	"strconv"
+	"strings"
 	"sync"
 	"sync/atomic"
 	"time"
@@ -23,6 +26,8 @@ import (
 	"cdr.dev/slog"
 	"github.com/coder/coder/v2/coderd/tracing"
 	"github.com/coder/coder/v2/coderd/workspaceapps"
+	"github.com/coder/coder/v2/coderd/workspaceapps/appurl"
+	"github.com/coder/coder/v2/codersdk"
 	"github.com/coder/coder/v2/codersdk/workspacesdk"
 	"github.com/coder/coder/v2/site"
 	"github.com/coder/coder/v2/tailnet"
@@ -351,13 +356,49 @@ func (s *ServerTailnet) ReverseProxy(targetURL, dashboardURL *url.URL, agentID u
 	tgt.Host = net.JoinHostPort(tailnet.IPFromUUID(agentID).String(), port)
 
 	proxy := httputil.NewSingleHostReverseProxy(&tgt)
-	proxy.ErrorHandler = func(w http.ResponseWriter, r *http.Request, err error) {
+	proxy.ErrorHandler = func(w http.ResponseWriter, r *http.Request, theErr error) {
+		var (
+			switchProtoScheme codersdk.WorkspaceAgentPortShareProtocol
+			switchProtoLink   = ""
+		)
+		au, err := appurl.ParseSubdomainAppURL(tgt.String())
+		if err != nil {
+			site.RenderStaticErrorPage(w, r, site.ErrorPageData{
+				Status:       http.StatusBadGateway,
+				Title:        "Bad Gateway",
+				Description:  "Failed to proxy request to application: " + err.Error(),
+				RetryEnabled: true,
+				DashboardURL: dashboardURL.String(),
+			})
+			return
+		}
+		if strings.HasSuffix(au.AppSlugOrPort, "s") {
+			p := strings.TrimSuffix(au.AppSlugOrPort, "s")
+			_, err = strconv.ParseInt(p, 10, 64)
+			if err == nil {
+				au.AppSlugOrPort = p
+				switchProtoLink = au.String()
+				switchProtoScheme = codersdk.WorkspaceAgentPortShareProtocolHTTP
+			}
+		} else {
+			au.AppSlugOrPort += "s"
+			switchProtoLink = au.String()
+			switchProtoScheme = codersdk.WorkspaceAgentPortShareProtocolHTTPS
+		}
+
+		desc := "Failed to proxy request to application: " + theErr.Error()
+		if strings.Contains(theErr.Error(), "tls:") {
+			desc = fmt.Sprintf("This error seems to be due to a protocol mistake, please try switching to %s. \n%s", switchProtoScheme, theErr.Error())
+		}
+
 		site.RenderStaticErrorPage(w, r, site.ErrorPageData{
-			Status:       http.StatusBadGateway,
-			Title:        "Bad Gateway",
-			Description:  "Failed to proxy request to application: " + err.Error(),
-			RetryEnabled: true,
-			DashboardURL: dashboardURL.String(),
+			Status:               http.StatusBadGateway,
+			Title:                "Bad Gateway",
+			Description:          desc,
+			RetryEnabled:         true,
+			DashboardURL:         dashboardURL.String(),
+			SwitchProtocolLink:   switchProtoLink,
+			SwitchProtocolTarget: switchProtoScheme,
 		})
 	}
 	proxy.Director = s.director(agentID, proxy.Director)

diff --git a/site/site.go b/site/site.go
@@ -786,12 +786,14 @@ func extractBin(dest string, r io.Reader) (numExtracted int, err error) {
 type ErrorPageData struct {
 	Status int
 	// HideStatus will remove the status code from the page.
-	HideStatus   bool
-	Title        string
-	Description  string
-	RetryEnabled bool
-	DashboardURL string
-	Warnings     []string
+	HideStatus           bool
+	Title                string
+	Description          string
+	RetryEnabled         bool
+	DashboardURL         string
+	Warnings             []string
+	SwitchProtocolLink   string
+	SwitchProtocolTarget codersdk.WorkspaceAgentPortShareProtocol
 
 	RenderDescriptionMarkdown bool
 }

diff --git a/site/static/error.html b/site/static/error.html
@@ -167,6 +167,12 @@ <h1>
         {{- if not .Error.HideStatus }}{{ .Error.Status }} - {{end}}{{
         .Error.Title }}
       </h1>
+      {{- if .Error.SwitchProtocolLink }}
+      <p>It looks like the error was due to a protocol mismatch. Do you want to try using {{ .Error.SwitchProtocolTarget }}?</p>
+      <div class="button-group">
+        <a href="{{ .Error.SwitchProtocolLink }}">Use {{ .Error.SwitchProtocolTarget }}</a>
+      </div>
+      {{ end }}
       {{- if .Error.RenderDescriptionMarkdown }} {{ .ErrorDescriptionHTML }} {{
       else }}
       <p>{{ .Error.Description }}</p>
@@ -198,6 +204,9 @@ <h3>Warnings</h3>
         {{- if .Error.RetryEnabled }}
         <button onclick="window.location.reload()">Retry</button>
         {{ end }}
+        {{- if .Error.SwitchProtocolLink }}
+        <a href="{{ .Error.SwitchProtocolLink }}">Switch to {{ .Error.SwitchProtocolTarget }}</a>
+        {{ end }}
         <a href="{{ .Error.DashboardURL }}">Back to site</a>
       </div>
     </div>