I have problem with nuxt server-side API call when im using HTTPS. On client side everyting is fine and API works when im switching pages on client side via links, but when I hit Ctrl + f5 and data will be pre-fetched on server side, there is no actually API call and data is not provided. Even no error is thrown, but eveything works just fine with plain HTTP.
On my production server nodejs version - v10.9.0 And for HTTPS im using SNI SSL provided via my nodejs web hosting provider
This problem is similar to: .js/issues/2934 Except that the solution provided there does not work for me.
Edited:
This is the error im getting in store.js after axios get in nuxtServerInit: 'unable to verify the first certificate'
Edited 2:
After that Ive found:
And I applied plugin which extends axios:
plugins/axios.js:
import https from 'https';
export default function ({ $axios }) {
$axios.defaults.httpsAgent = new https.Agent({ rejectUnauthorized: false });
}
nuxt.config.js:
plugins: [
'@/plugins/axios',
]
It works now on server-side as good as on client-side. But I have another questions. Is this solution safe?
I have problem with nuxt server-side API call when im using HTTPS. On client side everyting is fine and API works when im switching pages on client side via links, but when I hit Ctrl + f5 and data will be pre-fetched on server side, there is no actually API call and data is not provided. Even no error is thrown, but eveything works just fine with plain HTTP.
On my production server nodejs version - v10.9.0 And for HTTPS im using SNI SSL provided via my nodejs web hosting provider
This problem is similar to: https://github.com/nuxt/nuxt.js/issues/2934 Except that the solution provided there does not work for me.
Edited:
This is the error im getting in store.js after axios get in nuxtServerInit: 'unable to verify the first certificate'
Edited 2:
After that Ive found: https://forum.vuejs.org/t/nuxtserverinit-with-axios-unable-to-verify-the-first-certificate/31010
And I applied plugin which extends axios:
plugins/axios.js:
import https from 'https';
export default function ({ $axios }) {
$axios.defaults.httpsAgent = new https.Agent({ rejectUnauthorized: false });
}
nuxt.config.js:
plugins: [
'@/plugins/axios',
]
It works now on server-side as good as on client-side. But I have another questions. Is this solution safe?
Share Improve this question edited Mar 31, 2019 at 13:16 Piosek asked Mar 31, 2019 at 11:04 PiosekPiosek 2601 gold badge4 silver badges16 bronze badges 3- 1 Do you use nuxt/axios ? Did you tried to log output of API calls and see what's there? – Aldarund Commented Mar 31, 2019 at 11:49
- Thanks for advice, stupid me. Yes, im using nuxt with Axios. Finally I manage how to get error. Thats what I get in catch block when in store.js I call API on server side: 'unable to verify the first certificate' – Piosek Commented Mar 31, 2019 at 12:33
- 1 Check it bundled all intermediate certificates – Aldarund Commented Mar 31, 2019 at 14:13
2 Answers
Reset to default 14I found this solution to be easier to manage:
export NODE_TLS_REJECT_UNAUTHORIZED=0 && yarn dev --env.NODE_TLS_REJECT_UNAUTHORIZED=0
Also it ensures that it is only run during development, where the issue with self signed certificates would most likely occur.
You could also add it to your package.json like so:
"scripts": {
"dev": "export NODE_TLS_REJECT_UNAUTHORIZED=0 && nuxt --env.NODE_TLS_REJECT_UNAUTHORIZED=0",
As a plugin
You could also create an plugins/axios.js
file
import https from 'https';
export default function ({
$axios,
store
}) {
const agent = new https.Agent({
rejectUnauthorized: false
});
$axios.onRequest(config => {
if (process.env.dev) {
config.httpsAgent = agent;
}
});
}
Be sure to add the plugin to your nuxt.config.js
file
Continuing the foobar's thought: for windows OS you need to write not "export", but "set" in package.json:
set NODE_TLS_REJECT_UNAUTHORIZED=0 && nuxt --env.NODE_TLS_REJECT_UNAUTHORIZED=0