I don't know what is going on with Nuxt and Axios, after the user session expire and the API returnsa a status 401, if I reload the page it get stuck and after a couple of minutes it return this error in console:
<--- Last few GCs --->
[85937:0x108000000] 4259490 ms: Mark-sweep 2025.8 (2050.9) -> 2025.0 (2050.9) MB, 1638.9 / 0.0 ms (average mu = 0.111, current mu = 0.006) allocation failure scavenge might not succeed
[85937:0x108000000] 4261994 ms: Mark-sweep 2025.9 (2050.9) -> 2025.0 (2051.2) MB, 2495.0 / 0.0 ms (average mu = 0.050, current mu = 0.004) allocation failure scavenge might not succeed
<--- JS stacktrace --->
==== JS stack trace =========================================
0: ExitFrame [pc: 0x100950919]
1: StubFrame [pc: 0x1009523cb]
Security context: 0x0e33ea8c08d1 <JSObject>
2: exec [0xe33ea8d49b1](this=0x0e3338818389 <JSRegExp <String[#10]: %[dfijoOs]>>,0x0e33ea8f5d61 <String[#51]: Cannot %s headers after they are sent to the client>)
3: [Symbol.match] [0xe33ea8d4899](this=0x0e3338818389 <JSRegExp <String[#10]: %[dfijoOs]>>,0x0e33ea8f5d61 <String[#51]: Cannot %s headers after they are sen...
FATAL ERROR: Ineffective mark-pacts near heap limit Allocation failed - JavaScript heap out of memory
Writing Node.js report to file: report.20200403.123410.85937.0.001.json
Node.js report pleted
1: 0x100080c68 node::Abort() [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
2: 0x100080dec node::errors::TryCatchScope::~TryCatchScope() [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
3: 0x100185167 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
4: 0x100185103 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
5: 0x10030b2f5 v8::internal::Heap::FatalProcessOutOfMemory(char const*) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
6: 0x10030c9c4 v8::internal::Heap::ReputeLimits(v8::internal::GarbageCollector) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
7: 0x100309837 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
8: 0x1003077fd v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
9: 0x100312fba v8::internal::Heap::AllocateRawWithLightRetry(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
10: 0x100313041 v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
11: 0x1002e035b v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationType, v8::internal::AllocationOrigin) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
12: 0x100618718 v8::internal::Runtime_AllocateInYoungGeneration(int, unsigned long*, v8::internal::Isolate*) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
13: 0x100950919 Builtins_CEntry_Return1_DontSaveFPRegs_ArgvOnStack_NoBuiltinExit [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
14: 0x1009523cb Builtins_SubString [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
The Node version I'm using is the 12.16.1
The Axios Plugin file is this:
import https from 'https'
export default function({ $axios, redirect }) {
const agent = new https.Agent({
rejectUnauthorized: false
})
// Axios default options
$axios.defaults.baseURL = process.env.apiBaseUrl
$axios.setHeader('Content-Type', 'application/json')
$axios.setHeader('Access-Control-Allow-Origin', '*')
$axios.onRequest(config => {
config.httpsAgent = agent
})
$axios.onError(({ response }) => {
const statusCode = response.status
const data = response.data
switch (statusCode) {
case 401:
redirect('/session-expired')
break
case 404:
let path = '/404'
redirect(path)
break
case 500:
return this.$nuxt.error({ statusCode })
default:
return false
}
})
}
The @nuxt/axios version is the latest: 5.9.7.
I think the issue is in the onError method because as soon as I ment it out I can run the application... Why does it happen?
I don't know what is going on with Nuxt and Axios, after the user session expire and the API returnsa a status 401, if I reload the page it get stuck and after a couple of minutes it return this error in console:
<--- Last few GCs --->
[85937:0x108000000] 4259490 ms: Mark-sweep 2025.8 (2050.9) -> 2025.0 (2050.9) MB, 1638.9 / 0.0 ms (average mu = 0.111, current mu = 0.006) allocation failure scavenge might not succeed
[85937:0x108000000] 4261994 ms: Mark-sweep 2025.9 (2050.9) -> 2025.0 (2051.2) MB, 2495.0 / 0.0 ms (average mu = 0.050, current mu = 0.004) allocation failure scavenge might not succeed
<--- JS stacktrace --->
==== JS stack trace =========================================
0: ExitFrame [pc: 0x100950919]
1: StubFrame [pc: 0x1009523cb]
Security context: 0x0e33ea8c08d1 <JSObject>
2: exec [0xe33ea8d49b1](this=0x0e3338818389 <JSRegExp <String[#10]: %[dfijoOs]>>,0x0e33ea8f5d61 <String[#51]: Cannot %s headers after they are sent to the client>)
3: [Symbol.match] [0xe33ea8d4899](this=0x0e3338818389 <JSRegExp <String[#10]: %[dfijoOs]>>,0x0e33ea8f5d61 <String[#51]: Cannot %s headers after they are sen...
FATAL ERROR: Ineffective mark-pacts near heap limit Allocation failed - JavaScript heap out of memory
Writing Node.js report to file: report.20200403.123410.85937.0.001.json
Node.js report pleted
1: 0x100080c68 node::Abort() [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
2: 0x100080dec node::errors::TryCatchScope::~TryCatchScope() [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
3: 0x100185167 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
4: 0x100185103 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
5: 0x10030b2f5 v8::internal::Heap::FatalProcessOutOfMemory(char const*) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
6: 0x10030c9c4 v8::internal::Heap::ReputeLimits(v8::internal::GarbageCollector) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
7: 0x100309837 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
8: 0x1003077fd v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
9: 0x100312fba v8::internal::Heap::AllocateRawWithLightRetry(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
10: 0x100313041 v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
11: 0x1002e035b v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationType, v8::internal::AllocationOrigin) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
12: 0x100618718 v8::internal::Runtime_AllocateInYoungGeneration(int, unsigned long*, v8::internal::Isolate*) [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
13: 0x100950919 Builtins_CEntry_Return1_DontSaveFPRegs_ArgvOnStack_NoBuiltinExit [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
14: 0x1009523cb Builtins_SubString [/Users/aaa/.nvm/versions/node/v12.16.1/bin/node]
The Node version I'm using is the 12.16.1
The Axios Plugin file is this:
import https from 'https'
export default function({ $axios, redirect }) {
const agent = new https.Agent({
rejectUnauthorized: false
})
// Axios default options
$axios.defaults.baseURL = process.env.apiBaseUrl
$axios.setHeader('Content-Type', 'application/json')
$axios.setHeader('Access-Control-Allow-Origin', '*')
$axios.onRequest(config => {
config.httpsAgent = agent
})
$axios.onError(({ response }) => {
const statusCode = response.status
const data = response.data
switch (statusCode) {
case 401:
redirect('/session-expired')
break
case 404:
let path = '/404'
redirect(path)
break
case 500:
return this.$nuxt.error({ statusCode })
default:
return false
}
})
}
The @nuxt/axios version is the latest: 5.9.7.
I think the issue is in the onError method because as soon as I ment it out I can run the application... Why does it happen?
- What is your nuxt version? – Aplet123 Commented Apr 3, 2020 at 10:59
- Nuxt version is: 2.11.0 – Ayeye Brazo Commented Apr 3, 2020 at 11:51
4 Answers
Reset to default 5Nuxt's dev mode appears to have a long history of having memory leaks. Try adding standalone: true to the build object in your nuxt.config, so it might look something like this:
export default {
build: {
standalone: true,
}
}
If that doesn't help you, maybe some of these github issues and pull requests can: #6478 #5452 #286 #685
I had this issue too but I found a very obvious answer.
Please, check name of your ponents. In my case I had 2 ponents which have the same name.
export default {
name: "Test"
}
With this I wasn't able to run my app and I had same error as you. Maybe that will help someone
In my case, the problem was Axios, In Nuxt Config,
axios: {
baseURL: process.env.BASE_ENDPOINT_URL,
// Proxy: true,
headers: {
Authorization: `bearer ${process.env.STRAPI_TOKEN}`,
'Content-Type': 'application/json',
},
},
The baseURL wasn't pointing to anything because I haven't added it to my .env file.
You can check that or add a fallback incase.
I experienced this is and after some research I found it was because I was had not set the Axios baseURL. My setup was attempting to set the axios baseURL dynamically at runtime by grabbing the subdomain from a wildcard setup (*.example.).
The problem is that in a SSR application, requests will be made to your backend before rendering the application and this often happens on reload.
You'd have to write a plugin that ensures that the axios baseURL is present on the server and on the client.