[Browser MFA] Add Browser MFA UI

lib/client/weblogin.go

@@ -128,6 +128,9 @@ type MFAChallengeResponse struct {
 	SSOResponse *SSOResponse `json:"sso_response"`
 	// TODO(Joerger): DELETE IN v20.0.0, WebauthnResponse used instead.
 	WebauthnAssertionResponse *wantypes.CredentialAssertionResponse `json:"webauthnAssertionResponse"`
+	// BrowserMFAResponse is a response the browser completing an MFA challenge
+	// as part of the Browser MFA flow.
+	BrowserMFAResponse *BrowserMFAResponse `json:"browser_response"`
 }
 
 // SSOResponse is a json compatible [proto.SSOResponse].

lib/web/apiserver.go

@@ -1216,6 +1216,8 @@ func (h *Handler) bindDefaultEndpoints() {
 	h.GET("/webapi/headless/:headless_authentication_id", h.WithAuth(h.getHeadless))
 	h.PUT("/webapi/headless/:headless_authentication_id", h.WithAuth(h.putHeadlessState))
 
+	h.PUT("/webapi/mfa/browser/:request_id", h.WithAuth(h.putBrowserMFA))
+
 	h.GET("/webapi/sites/:site/user-groups", h.WithClusterAuth(h.getUserGroups))
 
 	// Fetches the user's preferences

lib/web/browser_mfa.go

@@ -0,0 +1,69 @@
+// Teleport
+// Copyright (C) 2026 Gravitational, Inc.
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program.  If not, see <http://www.gnu.org/licenses/>.
+
+package web
+
+import (
+	"net/http"
+
+	"github.com/gravitational/trace"
+	"github.com/julienschmidt/httprouter"
+
+	mfav1 "github.com/gravitational/teleport/api/gen/proto/go/teleport/mfa/v1"
+	"github.com/gravitational/teleport/lib/client"
+	"github.com/gravitational/teleport/lib/httplib"
+)
+
+// putBrowserMFA accepts a webauthn response from a Browser MFA attempt which is
+// sent to CompleteBrowserMFAChallenge for verification. Once verified a tsh
+// redirect URL with an encrypted webauthn response is returned.
+func (h *Handler) putBrowserMFA(_ http.ResponseWriter, r *http.Request, params httprouter.Params, sctx *SessionContext) (any, error) {
+	requestID := params.ByName("request_id")
+	if requestID == "" {
+		return "", trace.BadParameter("request is missing request ID")
+	}
+
+	var req client.MFAChallengeResponse
+	if err := httplib.ReadResourceJSON(r, &req); err != nil {
+		return nil, trace.Wrap(err)
+	}
+
+	mfaResp, err := req.GetOptionalMFAResponseProtoReq()
+	if err != nil {
+		return nil, trace.Wrap(err)
+	}
+
+	if mfaResp == nil {
+		return nil, trace.Errorf("mfa response is nil")
+	}
+
+	clt, err := sctx.GetClient()
+	if err != nil {
+		return nil, trace.Wrap(err)
+	}
+
+	resp, err := clt.MFAServiceClient().CompleteBrowserMFAChallenge(r.Context(), &mfav1.CompleteBrowserMFAChallengeRequest{
+		BrowserMfaResponse: &mfav1.BrowserMFAResponse{
+			RequestId:        requestID,
+			WebauthnResponse: mfaResp.GetWebauthn(),
+		},
+	})
+	if err != nil {
+		return nil, trace.Wrap(err)
+	}
+
+	return resp.TshRedirectUrl, nil
+}

web/packages/design/src/CardError/CardError.jsx

@@ -121,3 +121,10 @@ export const LogoutFailed = ({ message, loginUrl }) => (
 const HyperLink = styled.a`
   color: ${({ theme }) => theme.colors.buttons.link.default};
 `;
+
+export const BadRequest = ({ message, ...rest }) => (
+  <CardError {...rest}>
+    <Header>400 Bad Request</Header>
+    <Content message={message} />
+  </CardError>
+);

web/packages/design/src/CardError/index.js

@@ -23,7 +23,16 @@ import CardError, {
   LogoutFailed,
   NotFound,
   Offline,
+  BadRequest,
 } from './CardError';
 
 export default CardError;
-export { Failed, LoginFailed, AccessDenied, NotFound, Offline, LogoutFailed };
+export {
+  Failed,
+  LoginFailed,
+  AccessDenied,
+  NotFound,
+  Offline,
+  LogoutFailed,
+  BadRequest,
+};

web/packages/shared/redirects/index.ts

@@ -17,5 +17,6 @@
  */
 
 import { processRedirectUri } from './processRedirectUri';
+import { validateClientRedirect } from './urlValidation';
 
-export { processRedirectUri };
+export { processRedirectUri, validateClientRedirect };

web/packages/shared/redirects/urlValidation.test.ts

@@ -0,0 +1,54 @@
+/**
+ * Teleport
+ * Copyright (C) 2026 Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { validateClientRedirect } from './urlValidation';
+
+describe('validateClientRedirect', () => {
+  test.each([
+    'http://localhost:12345?response=abc',
+    'https://localhost:12345?response=abc',
+    'http://127.0.0.1:12345?response=abc',
+    'http://[::1]:12345?response=abc',
+  ])('accepts loopback URL: %s', url => {
+    expect(() => validateClientRedirect(url)).not.toThrow();
+  });
+
+  test('rejects empty URL', () => {
+    expect(() => validateClientRedirect('')).toThrow(
+      'redirect URL must not be empty'
+    );
+  });
+
+  test('rejects non-local address', () => {
+    expect(() =>
+      validateClientRedirect('http://example.com:12345?response=abc')
+    ).toThrow('example.com is not a valid local address');
+  });
+
+  test('rejects unsupported protocol', () => {
+    expect(() =>
+      validateClientRedirect('ftp://localhost:12345?response=abc')
+    ).toThrow('ftp: is not a valid protocol');
+  });
+
+  test('rejects URL with credentials', () => {
+    expect(() =>
+      validateClientRedirect('http://user:pass@localhost:12345?response=abc')
+    ).toThrow('redirect URL must not contain credentials');
+  });
+});

web/packages/shared/redirects/urlValidation.ts

@@ -0,0 +1,63 @@
+/**
+ * Teleport
+ * Copyright (C) 2026 Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+const ALLOWED_HOSTS = ['localhost', '127.0.0.1', '[::1]'];
+
+/**
+ * Validates that a redirect URL points to a valid local address, uses an
+ * allowed protocol, and does not expose URL-based credentials.
+ *
+ * This function is intended for validating client-side redirect URLs used in
+ * flows such as browser MFA, where the redirect target must be a local address
+ * (e.g. tsh, tctl etc) rather than an arbitrary external URL.
+ *
+ * Throws an error if any of the following conditions are not met:
+ * - The URL must not be empty.
+ * - The hostname must be one of the allowed local hosts: localhost, 127.0.0.1, or [::1].
+ * - The protocol must be http: or https:.
+ * - The URL must not contain a username or password.
+ *
+ * @param url - The redirect URL string to validate.
+ * @throws {Error} If the URL is empty, has a disallowed host, uses an invalid protocol,
+ * or contains embedded credentials.
+ *
+ * @example
+ * validateClientRedirect('http://localhost:8080/callback') // valid, does not throw
+ * validateClientRedirect('http://evil.com/callback')       // throws: not a valid local address
+ * validateClientRedirect('ftp://localhost/callback')       // throws: not a valid protocol
+ * validateClientRedirect('http://user:pass@localhost/')    // throws: must not contain credentials
+ */
+export function validateClientRedirect(url: string) {
+  if (url === '') {
+    throw new Error('redirect URL must not be empty');
+  }
+
+  const parsedUrl = new URL(url);
+
+  if (!ALLOWED_HOSTS.includes(parsedUrl.hostname)) {
+    throw new Error(`${parsedUrl.hostname} is not a valid local address`);
+  }
+
+  if (parsedUrl.protocol !== 'http:' && parsedUrl.protocol !== 'https:') {
+    throw new Error(`${parsedUrl.protocol} is not a valid protocol`);
+  }
+
+  if (parsedUrl.username || parsedUrl.password) {
+    throw new Error('redirect URL must not contain credentials');
+  }
+}

web/packages/teleport/src/BrowserMFA/BrowserMFA.story.tsx

@@ -0,0 +1,37 @@
+/**
+ * Teleport
+ * Copyright (C) 2026 Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { BrowserMfaAccessDenied, BrowserMfaProcessing } from './BrowserMFA';
+
+export default {
+  title: 'Teleport/BrowserMFA',
+};
+
+export function Processing() {
+  return <BrowserMfaProcessing />;
+}
+
+export function AccessDenied() {
+  return <BrowserMfaAccessDenied statusText="MFA validation failed" />;
+}
+
+export function AccessDeniedWithLongMessage() {
+  return (
+    <BrowserMfaAccessDenied statusText="Your browser could not complete this authentication request. Please retry and ensure your security key or passkey is available." />
+  );
+}