Reputation: 1531
I am trying to make a cross-domain POST using nuxt
and axios
this.$axios.$post('https://hooks.zapier.com/hooks/catch/111111/xxxxx/', { name: 'Jose', })
CORS is blocking me, so I installed nuxt/proxy
and setup like this:
proxy: {
'/zapier': {
target: 'https://hooks.zapier.com',
pathRewrite: {
'^/zapier': '/',
},
},
},
this.$axios.$post('https://localhost:3000/zapier/hooks/catch/111111/xxxxx/', { name: 'Jose', })
ā But I still receive the same error response:
{
"message": "Network Error",
"name": "Error",
"stack": "Error: Network Error\n at createError (http://localhost:3000/_nuxt/commons.app.js:771:15)\n at XMLHttpRequest.handleError (http://localhost:3000/_nuxt/commons.app.js:306:14)",
"config": {
"url": "https://localhost:3000/zapier/hooks/catch/111111/xxxxx/",
"method": "post",
"data": "{\\"name\":\"Jose\"}",
"headers": {
"Accept": "application/json, text/plain, */*",
"Content-Type": "application/json;charset=utf-8"
},
"baseURL": "http://localhost:3000/",
"transformRequest": [
null
],
"transformResponse": [
null
],
"timeout": 0,
"xsrfCookieName": "XSRF-TOKEN",
"xsrfHeaderName": "X-XSRF-TOKEN",
"maxContentLength": -1
}
}
Can someone point what is wrong?
(Or if this is even possible? I am using Netlify, so it's necessary that runs on client-side)
Upvotes: 0
Views: 685
Reputation: 1531
Almost there...
On dev mode I could achieve the desired result with the following setup:
axios: {
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
},
proxy: {
'/zapier/': {
target: 'https://hooks.zapier.com/',
pathRewrite: { '^/zapier/': '' },
changeOrigin: true,
},
},
But proxy does not work on static sites šŖ
Upvotes: 1