Test Microsoft sign-in locally

Sign in with Microsoft on your laptop while Microsoft Entra ID redirects to a stable HTTPS URL.

Before you beginCopy Anchor Link

• A Horizon account and the CLI (see Getting started)
• A reserved subdomain for -s. Reserve one on the Subdomains page.
• A Next.js App Router app with Auth.js installed (npm install next-auth@beta)
• A Microsoft Entra tenant where you can register applications. Microsoft requires at least the Application Developer role.

hrzn tunnel http://localhost:3000 -s my-app

HORIZON: Tunnel connected
  URL          https://my-app.hrzn.run (reserved)
  Forwarding   http://localhost:3000
  Request log  https://hrzn.run/dashboard/tunnels/my-app

npx auth secret

AUTH_SECRET=replace-with-the-generated-secret
AUTH_URL=https://my-app.hrzn.run
AUTH_TRUST_HOST=true
AUTH_MICROSOFT_ENTRA_ID_ID=replace-with-your-application-client-id
AUTH_MICROSOFT_ENTRA_ID_SECRET=replace-with-your-client-secret

import NextAuth from "next-auth";
import MicrosoftEntraID from "next-auth/providers/microsoft-entra-id";

export const { handlers, signIn, signOut, auth } = NextAuth({
  providers: [MicrosoftEntraID],
});

import { handlers } from "@/auth";

export const { GET, POST } = handlers;

import { signIn } from "@/auth";

export default function Home() {
  return (
    <form
      action={async () => {
        "use server";
        await signIn("microsoft-entra-id");
      }}
    >
      <button type="submit">Sign in with Microsoft</button>
    </form>
  );
}

npm run dev

Check it worksCopy Anchor Link

Microsoft shows its sign-in page. After you approve, your browser lands back on https://my-app.hrzn.run.

Your Horizon terminal prints a line for the callback. The status is a 3xx, because Auth.js redirects after it sets the session.

  GET     302  /api/auth/callback/microsoft-entra-id

TroubleshootingCopy Anchor Link

AADSTS50011: The redirect URI does not matchCopy Anchor Link

Microsoft's message reads: "The redirect URI specified in the request does not match the redirect URIs configured for the application."

• Compare the URI under Authentication with https://my-app.hrzn.run/api/auth/callback/microsoft-entra-id. The path is case-sensitive.
• Check that you added it to a Web platform.
• Check that the subdomain in Entra matches the one you pass to -s.
• Wait three to five minutes after you save. Microsoft says changes need that long.

The redirect URI in the error contains localhostCopy Anchor Link

Your app built the redirect URI from the Host header, which Horizon sets to localhost:3000. Set AUTH_TRUST_HOST=true and AUTH_URL=https://my-app.hrzn.run in .env.local. Restart npm run dev, because Next.js reads .env.local at start.

Auth.js throws an UntrustedHost errorCopy Anchor Link

Auth.js requires trustHost to be true because it relies on the request's host header. Set AUTH_TRUST_HOST=true in .env.local and restart npm run dev.

The URL changed after a restartCopy Anchor Link

You started the tunnel without -s, so Horizon gave you a new random subdomain. Restart with -s my-app and the registered URI stays valid. -s needs a subdomain you reserved, see Pricing.

The browser shows a Before you continue pageCopy Anchor Link

Horizon shows this page once every 7 days per IP address. Select Continue to site.

Nothing reaches your appCopy Anchor Link

• Check that the Horizon terminal is still running. If its last line is Connection lost. Reconnecting…, wait for Reconnected.
• Check that the app listens on port 3000, the port in your tunnel command.

Next stepsCopy Anchor Link

• Read the shared notes on OAuth redirect URLs and the Auth.js guide.
• Read Microsoft's redirect URI best practices and limitations.