error - TypeError: result.response.headers is not iterable

What version of Next.js are you using? 12.0.7

What version of Node.js are you using? v16.13.1

What browser are you using? Edge

What operating system are you using? windows 11

How are you deploying your application? next dev

I used stable ver and 1.3.0-canary.7

Describe the Bug I setup lib as normal with the new nextjs ver and use normal middleware under ./pages but the lib throw and error - TypeError: result.response.headers is not iterable when add middleware file and when remove this file get work I use next js with typescript

Expected Behavior I expected to see the application running without any error and loaded translated

To Reproduce create middleware file under pages and run yarn dev

i18n.js

module.exports = {
  locales: ['en-US', 'en-EG', 'ar-EG', 'en-SA', 'ar-SA', 'en-AE', 'ar-AE'],
  defaultLocale: 'en-US',
  localeDetection: true,
  pages: {
    '*': ['common'],
    // '/': ['common'],
    // '/about': ['about'],
  },
  // interpolation: {
  //   prefix: '${',
  //   suffix: '}',
  // },
  logBuild: true,
  loadLocaleFrom: (l, n) =>
    import(`./public/locales/${l}/${n}`).then((m) => m.default),
};

And /pages/_middleware.ts:

import type { NextRequest, NextFetchEvent } from 'next/server';
import { getToken } from 'next-auth/jwt';
import { NextResponse } from 'next/server';

export default async function Middleware(req: NextRequest | any, ev: NextFetchEvent) {
  console.log(`Middleware req: ${JSON.stringify(req)}`);
  console.log(`Middleware ev: ${JSON.stringify(ev)}`);
  const secret = process.env.SECRET;

  if (req.nextUrl.pathname === '/middleware-protected') {
    const session = await getToken({ req, secret });
    console.log(`Middleware session: ${JSON.stringify(session)}`);

    // You could also check for any property on the session object,
    // like role === "admin" or name === "John Doe", etc.
    if (!session) return NextResponse.redirect('/api/auth/signin');
    // If user is authenticated, continue.
  }

  return NextResponse.next();
}

The issue is happen when add async await to fun I think not handled async functions

[pytnik89]

@nasraldin thx for suggestion, but external middlewares, like withAuth from next-auth fails the same.

[MrPumpking]

This is caused by this line:

https://github.com/vinissimus/next-translate/blob/49f580c6d292712a0720a104de3b487e7c11d4ae/src/plugin/utils.ts#L48

It skips the page only if it the path (the variable is named page but it actually is a file path) starts with _middleware. So if you have placed your middleware inside of a directory in the pages folder then the value of page would be /directoryName/_middleware, and this line would return false.

I’ll post a PR with a fix soon. In the meantime you can use this patch with patch-package:

next-translate+1.4.0.patch

diff --git a/node_modules/next-translate/lib/cjs/plugin/utils.js b/node_modules/next-translate/lib/cjs/plugin/utils.js
index 9dc18ba..a4f441a 100644
--- a/node_modules/next-translate/lib/cjs/plugin/utils.js
+++ b/node_modules/next-translate/lib/cjs/plugin/utils.js
@@ -20,10 +20,11 @@ function hasExportName(data, name) {
 }
 exports.hasExportName = hasExportName;
 function isPageToIgnore(page) {
+    var fileName = page.substring(page.lastIndexOf('/') + 1);
     return Boolean(page.startsWith('/api/') ||
         page.startsWith('/api.') ||
         page.startsWith('/_document.') ||
-        page.startsWith('_middleware') ||
+        fileName.startsWith('_middleware') ||
         page.match(specFileOrFolderRgx));
 }
 exports.isPageToIgnore = isPageToIgnore;