Netlify边缘函数无法触发重定向问题求助

我最近在研究Netlify的重定向功能，发现它原生不支持正则表达式，所以转而尝试用边缘函数来实现复杂的重定向逻辑。结果遇到了一个头疼的问题：边缘函数的日志明明显示已经走完了重定向的所有逻辑，但实际页面就是不跳转，还是停留在首页，URL也保持着请求的地址不变。

从Netlify的函数日志里能看到，函数确实被正常触发了，每一步的日志都打出来了：

Aug 14, 09:29:55 AM: 01K2KQRG info [category-redirects] Edge Function triggered for path: /category
Aug 14, 09:29:55 AM: 01K2KQRG info [category-redirects] Category path detected, processing redirect...
Aug 14, 09:29:55 AM: 01K2KQRG info [category-redirects] Type parameter: food
Aug 14, 09:29:55 AM: 01K2KQRG info [category-redirects] Redirecting to /blog?type=food

但奇怪的是，浏览器并没有跳转到/blog?type=food，还是显示首页，URL也保持着/category?type=food不变。

这是我最开始写的边缘函数代码：

export default async (req: Request, { cookies, geo }: Context) => {
  const url = new URL(req.url);
  const path = url.pathname;
  const searchParams = url.searchParams;

  console.log(`Edge Function triggered for path: ${path}`);

  // Handle category redirects with complex logic
  if (path === "/category") {
    console.log("Category path detected, processing redirect...");
    const type = searchParams.get("type");
    console.log(`Type parameter: ${type}`);

    if (type) {
      // Validate and transform the type parameter
      const validTypes = ["food", "drinks", "other"];
      const normalizedType = type.toLowerCase().trim();

      if (validTypes.includes(normalizedType)) {
        console.log(`Redirecting to /blog?type=${normalizedType}`);
        // Redirect to blog with the category
        return new URL(`/blog?type=${normalizedType}`, req.url);
      }
    }

    // If no valid type, redirect to blog without category
    console.log("No valid type, redirecting to /blog");
    return new URL("/blog", req.url);
  }
}

后来查了Netlify的相关说明才搞明白问题出在哪——直接返回URL对象不会触发重定向！Netlify边缘函数需要你明确返回一个带有重定向状态码的Response对象，浏览器才能识别到要执行跳转动作。

正确的做法是用Response.redirect()方法，传入目标URL和合适的状态码（302是临时重定向，301是永久重定向，根据你的业务需求选择即可）。

修改后的完整代码如下：

export default async (req: Request, { cookies, geo }: Context) => {
  const url = new URL(req.url);
  const path = url.pathname;
  const searchParams = url.searchParams;

  console.log(`Edge Function triggered for path: ${path}`);

  // Handle category redirects with complex logic
  if (path === "/category") {
    console.log("Category path detected, processing redirect...");
    const type = searchParams.get("type");
    console.log(`Type parameter: ${type}`);

    if (type) {
      // Validate and transform the type parameter
      const validTypes = ["food", "drinks", "other"];
      const normalizedType = type.toLowerCase().trim();

      if (validTypes.includes(normalizedType)) {
        console.log(`Redirecting to /blog?type=${normalizedType}`);
        // 改用Response.redirect实现标准重定向
        return Response.redirect(new URL(`/blog?type=${normalizedType}`, req.url), 302);
      }
    }

    // If no valid type, redirect to blog without category
    console.log("No valid type, redirecting to /blog");
    return Response.redirect(new URL("/blog", req.url), 302);
  }

  // 必须加上这句，确保非重定向逻辑的请求能正常处理
  return fetch(req);
}

这里还有个容易忽略的细节：一定要在函数最后加上return fetch(req);，这样当请求不匹配重定向逻辑时，会继续正常处理原请求，不会导致其他页面无法访问。

改完之后重新部署，再测试就正常跳转了，浏览器URL也会自动更新为目标地址，终于解决了这个问题！

内容来源于stack exchange