[Bug]: 404s with dynamic routes and reverse-proxy using basePath

[audreyshub]

Steps to reproduce

1. Go to https://www.tourlane.de/traveller-crossing

2. Login using the following credentials:

   email: [email protected]
   password: netlifytest

3. On the landing page, click either the "South America" or "Europa" continent chip, or any of the links on the pink sidebar (Inspirationen deutsch or Angebote1)

Expected behavior:
Page is served correctly

Actual behavior:
We get a 404 page

Now repeat the exact same steps but instead of using the reverse-proxy from tourlane.de, visit directly the netlify site (https://traveller-crossing.netlify.app/) you will see that this error doesn't happen. Something interesting to note is that after visiting some of the pages on the netlify site, and going back to try to visit them from the reverse-proxy version (https://www.tourlane.de/traveller-crossing) they will work, as it seems that a cached version is being served.

1. Visit https://www.tourlane.de/traveller-crossing/inspiration/south-america
2. you will get a 404
3. visit https://traveller-crossing.netlify.app/traveller-crossing/inspiration/south-america
4. page will be served just fine
5. visit https://www.tourlane.de/traveller-crossing/inspiration/south-america again
6. page will be served just fine 🤯

There seems to be some configuration off with dynamic routes and reverse-proxy on Netlify using basePath.

This is working in Vercel.

A link to a reproduction repository

No response

Plugin version

@netlify/[email protected]

More information about your build

• I am building using the CLI
• I am building using file-based configuration (netlify.toml)

What OS are you using?

No response

Your netlify.toml file

netlify.toml

[build]
  publish = ".next"

[[plugins]]
  package = "@netlify/plugin-nextjs"

[[redirects]]
  from = "/"
  to = "/traveller-crossing"

next.config.js

module.exports = {
  reactStrictMode: true,
  basePath: '/traveller-crossing',
  async redirects() {
    return [
      {
        source: '/',
        destination: '/traveller-crossing',
        permanent: true,
        basePath: false,
      },
    ];
  },
};

Relevant log output (or link to your logs)

Build logs

https://app.netlify.com/sites/traveller-crossing/deploys/61b21a476247e800071ebf01

[MelvinPeepers]

Customer updated to release version (December 14 2021) and still seeing issue.

[audreyshub]

Minimal repo and steps to reproduce:

Repository: https://github.com/RaulEscobarRivas/gatsby-proxy

Steps to reproduce:

1. visit https://gatsby-proxy.netlify.app/
2. click the "Go To NextJS App" link
3. click the "Dynamic Path Page" link

Expected Result

Dynamic path page is served

Actual Result

404

Humio query showing request_id

[overlordofmu]

There is a 404 for this URL:

https://gatsby-proxy.netlify.app/reverse-proxy-basepath/_next/data/wnRuKQmcM-j2bVEZonseW/dynamic/dynamic-1.json

That is being proxied by one of these autogenerated rules:

/reverse-proxy-basepath  https://nextjs-dynamic-path.netlify.app/reverse-proxy-basepath/  200
/reverse-proxy-basepath/*  https://nextjs-dynamic-path.netlify.app/reverse-proxy-basepath/:splat  200

to here:

https://nextjs-dynamic-path.netlify.app/reverse-proxy-basepath/_next/data/wnRuKQmcM-j2bVEZonseW/dynamic/dynamic-1.json

It should work but it doesn't. However, the direct URL (not proxied) does work, examples below. The first request is the direct request which returns a 200. The second is proxied and is a 404:

$ curl --compressed -svo /dev/null https://nextjs-dynamic-path.netlify.app/reverse-proxy-basepath/_next/data/wnRuKQmcM-j2bVEZonseW/dynamic/dynamic-1.json  2>&1 | egrep '^(<|>) '
> GET /reverse-proxy-basepath/_next/data/wnRuKQmcM-j2bVEZonseW/dynamic/dynamic-1.json HTTP/2
> Host: nextjs-dynamic-path.netlify.app
> User-Agent: curl/7.64.1
> Accept: */*
> Accept-Encoding: deflate, gzip
>
< HTTP/2 200
< cache-control: public, max-age=0, must-revalidate
< content-type: application/json
< date: Thu, 20 Jan 2022 00:35:44 GMT
< etag: "34-SkKCVZwZYMBbGAzWd/9mcAu5E5o"
< x-nf-request-id: 01FTTAA97JWXWK9DWG3WN638DD
< content-length: 52
< x-render-mode: odb
< age: 1069286
< server: Netlify
<

$ curl --compressed -svo /dev/null https://gatsby-proxy.netlify.app/reverse-proxy-basepath/_next/data/wnRuKQmcM-j2bVEZonseW/dynamic/dynamic-1.json  2>&1 | egrep '^(<|>) '
> GET /reverse-proxy-basepath/_next/data/wnRuKQmcM-j2bVEZonseW/dynamic/dynamic-1.json HTTP/2
> Host: gatsby-proxy.netlify.app
> User-Agent: curl/7.64.1
> Accept: */*
> Accept-Encoding: deflate, gzip
>
< HTTP/2 404
< cache-control: no-cache
< content-type: text/html; charset=utf-8
< date: Tue, 01 Feb 2022 09:37:45 GMT
< etag: "9e7-N0ueuxOLpK1kCWuguv5CBsBLev4-df"
< server: Netlify
< x-nf-request-id: 01FTTABC8NZV98M9C11ARNBJRY
< age: 1
< vary: Accept-Encoding
< x-powered-by: Next.js
< x-render-mode: odb
< content-encoding: gzip
<