serveStatic API doesn't work as expected since 9.3.2

[elias551]

Bug report

Describe the bug

When using a custom server, the API app.serveStatic(req, res, filePath) is used to return static files, but the server returns a 404 error page, even though the file is present on disk.

I'm using a custom server.js to run next and serve a service worker config produced at runtime by next-offline.

After upgrading from 9.3.1 to 9.3.2, the file cannot be served as the server returns a 404.

To Reproduce

With the following server.js:

const fs = require("fs")
const { createServer } = require("http")
const { join } = require("path")
const { parse } = require("url")

const next = require("next")

const app = next({ dev: process.env.NODE_ENV !== "production" })
const handle = app.getRequestHandler()

app.prepare().then(() => {
  createServer((req, res) => {
    const parsedUrl = parse(req.url, true)
    const { pathname } = parsedUrl

    if (pathname === "/service-worker.js") {
      const filePath = join(__dirname, ".next", pathname)
      console.log({
        filePath,
        exists: fs.existsSync(filePath),
        files: fs.readdirSync(join(__dirname, ".next")),
      })

      app.serveStatic(req, res, filePath)
    } else {
      handle(req, res, parsedUrl)
    }
  }).listen(3000, () => {
    console.log(`> Ready on http://localhost:${3000}`)
  })
})

in your shell run

rm -rf node_modules .next
yarn add next@9.3.1
node server.js

The file content is correctly served at http://localhost:3000/service-worker.js

Then run:

rm -rf node_modules .next
yarn add next@9.3.2
node server.js

The url http://localhost:3000/service-worker.js returns a 404 and shows the default error page.

Expected behavior

The file should be served consistently accross versions

Screenshots

N/A

System information

• OS: linux ubuntu 18.04
• Browser (if applies): any
• Version of Next.js: 9.3.2

Additional context

Here is the console.log extract from server.js showing that the file is present when the 404 is returned:

{ filePath:
   '/pathtomyproject/.next/service-worker.js',
  exists: true,
  files:
   [ 'build-manifest.json',
     'cache',
     'react-loadable-manifest.json',
     'server',
     'service-worker.js',
     'static' ] }

[elias551]

At first I was thinking that embedding minified versions of send was causing the issue, but it's not the case prior to 9.3.4. Furthermore it's the same version (send@0.17.1) that is used in next 9.3.1 and 9.3.2 .

The error seems to be thrown here:
https://github.com/zeit/next.js/blob/v9.3.1/packages/next/next-server/server/serve-static.ts

I stopped debugging after this file as I don't know how to go further :(

[ferrettinico]

I can confirm this. Downloaded the code from scratch and just get 404 on every blog page

[brookslyrette]

I can confirm this issue as well. I have a similar setup to serve a service worker and I'm getting the same result.

[armand1m]

I can confirm this issue on 9.3.5. Downgrading back to 9.3.1 solves it.

[armand1m]

redacted

[armand1m]

have anyone checked if this is fixed on 9.4.x?

[elias551]

The error is still present on 9.4.0

[karandatwani92]

need to use /service-worker.js on latest next.js

[Timer]

serveStatic cannot be used to serve files Next.js did not generate itself. This was a necessary security change for https://github.com/zeit/next.js/releases/tag/v9.3.2.

You can move this file into public/ to have Next.js serve it automatically.

[imekachi]

For those who's looking for the solution,
checkout this #11624 (comment)

workboxOpts: {
  swDest: "../public/service-worker.js",
},

This works for me.

[PlopTheReal]

I'm uploading files to /public but I can't serve anymore those files (404) unless I trigger a rebuild.
Is there is any way to dynamically server files?

[balazsorban44]

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.