Next.js: assetPrefix does not work for all _next URLs

[callumlocke]

Expected Behavior

If you have assetPrefix: '/foo' in your config, this should cause all requests on the client for /_next/* to be made to /foo/_next/* instead.

Current Behavior

The assetPrefix setting does not apply to certain /_next URLs, including chunks, HMR requests, and pings.

Steps to Reproduce (for bugs)

1. Make a Next 3 project
2. Set an assetPrefix
3. Create a chunk by doing a dynamic import(...)
4. Inspect in devtools to see what's being requested

Context

How the assetPrefix: '/foo' setting affects various URLs:

• ✅ page bundles: /foo/_next/1502390442393/page/pay-gap/about
• ✅ main, commons etc: /foo/_next/1502390442393/main.js
• ❌ chunks: /_next/webpack/chunks/---data-418bc291-7d03-4c09-a3b6-334ad7682fc1.js
• ❌ webpack-hmr: /_next/webpack-hmr
• ❌ pings: /_next/on-demand-entries-ping?page=/some/page

(I'm not sure if the above list is complete.)

Why this matters: I'm behind a routing layer that only sends me requests starting with /app-name. If a request does not start with /app-name, it will never reach my server. I need to be able to make all /_next requests go through /app-name/_next so that they reach my app. (Once they reach my app, the corresponding serverside workaround is easy: you can just strip off the prefix and then manually call Next's handler, as various people have suggested in #257.)

Your Environment

| Tech | Version |
|---------|---------|
| next | 3 |
| node | 8 |
| OS | macOS Sierra |
| browser | Chrome |

[callumlocke]

I found a workaround to get chunks working:

module.exports = {
  assetPrefix: '/foo',
  webpack: (config) => {
    config.output.publicPath = `/foo${config.output.publicPath}`;
    return config;
  },
};

But I still think there should be a single place that you can prefix/customise the /_next and have it work for everything (hot module replacement, chunks, whatever).

[timneutkens]

See https://github.com/zeit/next.js/pull/2901