Next.js Middleware Redirect to “/Verify-Captcha” Causes Page Load Issues and Unexpected token ‘<' Error

I am using Next.js 14 and have implemented middleware to redirect users to the route /Verify-Captcha when the response status is 429. However, while the redirect works, the page does not load correctly. The CSS breaks, and useEffect hooks and other functionality are not working. Here is my middleware code:

import { NextResponse } from "next/server";

export function middleware(request) {
  const { pathname, origin } = request.nextUrl;

  if (pathname === "/Verify-Captcha") {
    return NextResponse.next();
  }

  const response = NextResponse.next();
  if (response.status === 429) { 
    const redirectUrl = `${origin}/Verify-Captcha`;
    return NextResponse.redirect(redirectUrl);
  }

  return NextResponse.next();
}

When redirected to /Verify-Captcha, the following error appears in the console:

Question:
What is causing this error and the page load issues when redirecting via middleware in Next.js 14? How can I fix this issue to ensure the page loads correctly after the redirect?