Dynamic route handler fails occasionally on Windows with 404
Opened this issue · 6 comments
Environment
Nuxt project info:
- Operating System: Windows_NT
- Node Version: v18.13.0
- Nuxt Version: 3.7.0
- CLI Version: 3.7.3
- Nitro Version: 2.6.2
- Package Manager: pnpm@8.7.0
- Builder: -
- User Config: modules, runtimeConfig
- Runtime Modules: @nuxtjs/tailwindcss@6.8.0
- Build Modules: -
Reproduction
The following sandbox will produce the problem when the wayfinderContentDir
in nuxt.config.ts
is set to ./data
rather than ./data_mini
on a Windows machine
https://codesandbox.io/p/sandbox/naughty-platform-hrsvqk
This will sporadically require moving between the pages of /
and /craft/[id].vue
, where you can see the particular item with only the requested ID rather than it's name and description displayed.
Describe the bug
Occasionally instead of receiving an output, instead a dynamic route handler throws a 404 when under enough stress(?) on windows platforms.
Additional context
This problem seems to be when I have a large enough file loaded in the context of a route handler. The items.json
provided when stripped of the localization information drops from ~250kb, to ~45kb, and reduces or eliminates the problem.
In addition the problem does not seem to be reproducible on WSL, or in the code sandbox.
Logs
XHRGET
http://localhost:3000/api/item/Spectra_Ruins_C_GW3
[HTTP/1.1 404 Cannot find any path matching /api/item/Spectra_Ruins_C_GW3. 5ms]
statusCode 404
statusMessage "Cannot find any path matching /api/item/Spectra_Ruins_C_GW3."
stack []
+1
i use catch all routes for server api on my nuxt app
it works well on nuxt v3.6.5
but after update (3.6.5 -> 3.7.0) sometimes api response randomly returns 404 errors
and actually it didn't hit my server logs.
most weired thing is it happens only on dev server
- Operating System: Windows_NT
- Node Version: v18.17.1
- Nuxt Version: 3.7.0
- CLI Version: 3.7.3
- Nitro Version: 2.6.2
- Package Manager: yarn@1.22.19
- Builder: -
- User Config: telemetry, app, experimental, runtimeConfig, modules, devtools, css, imports, vite, build, image, pwa
- Runtime Modules: vite-plugin-vue-type-imports/nuxt, @nuxt/devtools@0.8.2, @nuxtjs/device@3.1.0, @vueuse/nuxt@10.4.1, @unocss/nuxt@0.55.3, @pinia/nuxt@0.4.11, @nuxt/image@1.0.0-rc.1, @vite-pwa/nuxt@0.1.0
- Build Modules: -
Would you see if this is possible to reproduce using just nitro? It seems like this might be a nitro issue.
Porting the example repo to a simple nitro with minimum changes, I pointed my nuxt app to source from it. I occasionally also see this 404 when going useFetch("http://localhost:3001/api/item/" + itemId)
on windows, but not while I'm in WSL.
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:3002/api/item/LootGoblinResource. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 404.
The config for nitro is:
const fat = true
export default defineNitroConfig({
runtimeConfig: {
wayfinderContentDir: fat ? "./data" : "./data_minified",
},
routeRules: {
'/api/**': {
cors: true,
headers: {
'Access-Control-Allow-Origin': "*"
}
}
}
});
In testing I've found that the smaller json makes it less frequent, but still results in the 404 upstream.
I should mention I am only running via pnpm run dev
for this. I have not tried it with the deploy'd version.
I meet the same problem when i sliced a file into chunks and upload with Promise.all
. I think the problem was caused by multiple post requests in the same time. When i use await
instead of Promise.all
, it works well. But i can not use await because of the efficiency.
By the way, the problem does not happen in production when use npm run build && npm run preview
.