Make the /_next/ URL prefix configurable

[teemuy]

Describe the feature you'd like to request

We are integrating our NextJS app into our partner's website which is also using NextJS for some of its pages, under a single URL hostname. They have a reverse nginx proxy routing traffic to each app based on URL path. We can't use basePath to prefix our application, as we have specific URL structure requirements for the integration and basePath would prefix those too. While we can rewrite some URLs in nginx, the main problem is the /_next/ URL structure clashing between the apps. To further complicate things, they are also using a language prefix in the URL and support multiple languages based on that.
SEO for the project was done before implementation was ready, and now we are unable to meet the specified URL structure.

Describe the solution you'd like

Ability to configure a different path to be used instead of /_next/ including everything that goes under its subpaths, without affecting page URLs (as basePath does).

Describe alternatives you've considered

basePath, assetPath, reverse proxy doing complex URL rewrites.

[davidsantucci-ph]

Same here. I really would love to see this soon.

[truefalse10]

I am facing the same problem. Our current workaround is to use the asset-prefix to serve static assets from a different location. For _next/data-assets we were not able to find a solution and had to opt-out of SSG. This can be done by including getInitialProps in _app.js and by serving all pages with getServersideProps. This solution is very ugly and you lose a lot of benefits of next.js. I would love to see the /_next/ path to be configurable in a future release

[carlosds731]

I'm having the same problem.

On next 9.5 the approach described here worked. When I updated to next 10 it stopped working.

Currently, I have to use a custom server with the module http-proxy-middleware.

// custom-server.js

import {createProxyMiddleware} from 'http-proxy-middleware';

const static_assets_prefix = 'foo';

// create the reverse proxy (without context)
const assetsProxy = createProxyMiddleware({
    target: `http://localhost:${port}`,
    pathRewrite: {
        '^/foo/_next': '/_next', // remove base path
    },
});

void (async (): Promise<void> => {
    // nextjs runtime
    await app.prepare();

    // custom server
    const server = express();

    // Use the reverse proxy for the assets
    server.use(`/${static_assets_prefix}`, assetsProxy );

    // eslint-disable-next-line @typescript-eslint/no-misused-promises
    server.get('*', (req, res) => handle(req, res));

    server.listen(port, () => {
        console.log(
            `> Ready on http://localhost:${port} NODE_ENV: ${process.env.NODE_ENV}`
        );
    });
})();

// next.config.js

module.export = {
assetPrefix:  'foo'
}

I would love that have this solved. Is the only thing holding me from deploying on vercel.

[solomon23]

This is a problem when running a nextjs app inside of Visual Studio Code Server. When you run the app it creates a proxy under /proxy/5173 but there's no reasonable way to make it work from there. You can use the assetPrefix but the api calls aren't going to work

[teemuy]

Seems there is an open issue about being able to change the prefix.

[tom-bart]

I literally saw over 100 requests for this feature and I'm surprised we haven't had an official response from Next team on the timeline and the ability to add it.

Webpack-hmr always hits to root /_next which makes it impossible to host more than one app on the single domain.

Can we have an update on this please?

[erlangparasu]

Any updates?

[Djay77]

We have the same need. 2 next.js app on the same domain... We really need to custom the _next/ folder !
I don't understand why this feature is not developped yet

[Djay77]

@ijjk @timneutkens