Infinite redirects

[andriiradkevych]

import { FreshContext } from '$fresh/server.ts';

const containsUppercase = (str: string) => {
  return /[A-Z]/.test(str);
};

const trailingSlash = (uRl: string) => {
  const url = new URL(uRl);
  const isEndsWithSlash = url.pathname.endsWith('/');
  url.pathname += isEndsWithSlash ? '' : '/';
  return {
    isEndsWithSlash: isEndsWithSlash && url.pathname !== '/',
    urlWithSlash: url.toString(),
  };
};

export function handler(req: Request, ctx: FreshContext) {
  if (ctx.destination === 'route') {
    if (containsUppercase(req.url)) {
      // redirect once , when you pass for example /Register
      return Response.redirect(req.url.toLowerCase(), 301);
    }
    const { isEndsWithSlash, urlWithSlash } = trailingSlash(req.url);
    if (!isEndsWithSlash) {
      // redirects inifinite times when I pass for example /register
      return Response.redirect(urlWithSlash, 301);
    }
  }
  return ctx.next();
}

I've attached my middleware above. I've also shown places where it works ,and where it isn't . Spent all day on trying to find out what is wrong . I can't find out . I see that req.url param and ctx.url.hostname is the same , as it was ( old one ) , after redirects . Can someone help to find out ? Here is fresh version "$fresh/": "https://deno.land/x/fresh@1.6.5/",

[marvinhagemeister]

You're fighting against Fresh's built in trailing slash handling. By default Fresh will redirect any route with a trailing slash to the route without one. Then you detect that in your middleware and redirect to the route with the trailing slash. Then Fresh sees that the route has a trailing slash and redirects back to the route without one, etc. You basically created a loop.

To tell Fresh to always use trailing slash routes set this in your fresh.config.ts and delete the trailing slash logic from your code:

import { defineConfig } from "$fresh/server.ts";

export default defineConfig({
  router: {
    trailingSlash: true,
  },
});

Furthermore your middleware will also lowercase the search params of an URL which can break your site if you use them elsewhere. This will turn urls like https://example.com/foo/bar?param=MY_PARAM into https://example.com/foo/bar?param=my_param which seems like an unintended transformation.

Taking this into account and by reusing the already existing URL instance instead of creating a new one, the middleware code can be simplified even further.

import { FreshContext } from "$fresh/server.ts";

export function handler(_req: Request, ctx: FreshContext) {
  if (
    (ctx.destination === "route" || ctx.destination === "notFound") &&
    /[A-Z]/.test(ctx.url.pathname)
  ) {
    ctx.url.pathname = ctx.url.pathname.toLowerCase();
    return Response.redirect(ctx.url, 301);
  }
  return ctx.next();
}

P.S.: By adding the language to the fenced code block you can make your code be syntax highlighted on GitHub, see https://docs.github.com/en/get-started/writing-on-github/working-with-advanced-formatting/creating-and-highlighting-code-blocks

[marvinhagemeister]

Yes, that's what I mean with that you're going to fight against Fresh if you try to do trailing slash handling yourself.

• trailingSlash: true -> I always want trailing slashes, redirect all urls without trailing slashes to routes with trailing slashes
• trailingSlash: false (default value) -> I never want trailing slashes, always redirect urls ending with a slash to routes without a trailing slash

Since the latter is the implicit default value, routes with trailing slashes will be automatically redirected.

[andriiradkevych]

What is the solution then ? Then it is unsolvable , when I need trailing slash and also transform to lower case ? @marvinhagemeister

[marvinhagemeister]

I don't understand. The original snippet I posted addresses your problem. It solves the infinite redirect issue and redirects to uppercase routes to the lowercase one. Is there another issue that I'm missing? Maybe you can rephrase the problem you're facing?

[andriiradkevych]

I don't know why , but I see Permanent redirect 308 , when I go to path like /page , and when I check it https://www.redirect-checker.org/index.php here , I see infinite loop of

domain/page
308 Permanent Redirect
domain/page/
308 Permanent Redirect
domain/page
308 Permanent Redirect
domain/page/
308 Permanent Redirect
domain/page
308 Permanent Redirect
domain/page/
308 Permanent Redirect
domain/page

@marvinhagemeister on localhost I also see this 308 redirect but only one

[andriiradkevych]

this bug was cause on igress side , ingress was fighting , by removing /