Next.js: Passing args in URL with `experimental.basePath` causes the page to constantly being reloaded.

[robertovg]

Bug report

Describe the bug

We are using next: "^9.4.1" in a project with experimental.basePath and when working with the project on development and we have params on URL the page constantly reloads making impossible to work on dev mode.

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

I generated a simple repo & code-sandbox to show the problem.

• Contains a basepath set to myPath
• Only contains a simple index page with a link to add params to the URL,

When you load the visit the project with params: Live Sandbox and click on the link, o directly go to the URL with params on the URL

The page loads correctly, but after a second it starts to reload from time to time.

If no params in the URL or experimental.basePath set, it works like as expected.

Expected behavior

I would like to work with experimental.basePath without unexpected page reloads.

Additional context

Obviously this is an experimental feature based on this PR but we will need sooner than later in our projects.

Thanks in advance 🙏

[ijjk]

Hi, it looks like you are setting both assetPrefix and basePath to the same path here. You only need to set basePath in this case since /_next requests will automatically be prefixed with the basePath

[DrUNE]

Hi, I think this is related problem https://github.com/zeit/next.js/issues/11992#issuecomment-621974763 here basePath used instead assetPrefix. Problem surface when basePath and assetPrefix used at the same time in the project for generating SSG for example for static site which need basePath for routing prefixes and the same time all static assets should be hosted on another domain or CDN

[robertovg]

Hi, it looks like you are setting both assetPrefix and basePath to the same path here. You only need to set basePath in this case since /_next requests will automatically be prefixed with the basePath

Yeah, but in our real case, we are routing this next.js application through Traefik through the same base_path, and we need both the app and the assets to be served inside the same base_path.
That's why we need to change both.

[designbyadrian]

I'm having the same issue without setting assetPrefix. I'm trying to narrow down the problem.

[tywmick]

Okay this is weird: after cloning @robertovg's repo, I experience those same reloading issues when I yarn dev, but when I yarn build && yarn start, going to http://localhost:3000/myPath?reloadsWithAnyParam=true no longer causes reloading.

I then thought that it must be a server-side rendering issue, but then I tried adding a getServerSideProps() to src/pages/index.js...

export async function getServerSideProps(context) {
  return {
    props: {},
  };
}

...and after yarn build confirmed for me that the index page would be server-side rendered at runtime, I still experienced no reloading issues after yarn start and visiting http://localhost:3000/myPath?reloadsWithAnyParam=true. So I am only experiencing the reloading bug in dev mode, regardless of how the page is rendered. 🤔

[tywmick]

Found which reload we're dealing with:

https://github.com/vercel/next.js/blob/ad145d347f7fed2b8200708d1f9d2040e71da07c/packages/next/client/dev/on-demand-entries-utils.js#L37

Continuing to investigate around there...