serving static files under the .next/ folder but different url location

Question

There is a stack that uses Next.js as the main dependency. Each page is an independent application. An index page uses www.domain.com/_next/*.js so its base path configured as a / root. Also, another application has a base path same as the homepage but a little difference which is using a query string in the URL.

if the URL is www.domain.com/ then it is a homepage, if the URL is www.domain.com?key=value it means it is a different page and the request will be redirected to the associated application by the Nginx and Load Balancers. So, the problem is:

• the main page is serving its statics under the www.domain.com/_next/*.js
• the page that parses query strings is serving its statics under the same location same as MainPage www.domain.com/_next/*.js

These applications have different statics created by different pipelines also there is a cache mechanism. Is there a way to solve that conflict just by making some configuration in Next.js?

Answer 1

• You can use the basePath settings introduced in Next.js 9.5 (https://nextjs.org/docs/api-reference/next.config.js/basepath) But your .next/ folder would be changed, something like yourdomain.com/yourbasepath/_next

• If you want to change only the .next/ folder location assetPrefix can be used. I think you can take a look at assetPrefix https://github.com/vercel/next.js/issues/5602#issuecomment-673382891

• Or we can setup the custom server, for example the Express and custom the base asset path via Express (https://expressjs.com/en/starter/static-files.html)

  app.use('/static', express.static('public'))
  

P/s: The asker choose the assetPrefix solution