Proxy error with React/Express but only intermittently
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
I have an Express API that I'm sending requests to from a React front end.
router.get("/", (req, res, next) => {
res.set({ "Access-Control-Allow-Origin": "*" });
Todo.find({}).then(todos => res.json({ todos }));
});
I have a proxy call in my package.json on the client side:
"proxy": "http://localhost:8080",
From the front end action I'm sending a request to the API
export const getTodos = () => {
return function(dispatch) {
axios
.get("/api/crudify")
.then(res =>
dispatch({
type: GET_TODOS,
payload: res.data.todos
})
)
.catch(err => console.log(err));
};
};
Everything seems to work fine, but randomly my console will give me a Proxy error, which causes the server to respond with a 500
If I save and refresh the error goes away, than comes back a short time later. Anybody have any insight on this one?
reactjs api express proxy redux-thunk
asked Nov 16 '18 at 14:17
DmitriyDmitriy
633316
add a comment |
I have an Express API that I'm sending requests to from a React front end.
router.get("/", (req, res, next) => {
res.set({ "Access-Control-Allow-Origin": "*" });
Todo.find({}).then(todos => res.json({ todos }));
});
I have a proxy call in my package.json on the client side:
"proxy": "http://localhost:8080",
From the front end action I'm sending a request to the API
export const getTodos = () => {
return function(dispatch) {
axios
.get("/api/crudify")
.then(res =>
dispatch({
type: GET_TODOS,
payload: res.data.todos
})
)
.catch(err => console.log(err));
};
};
Everything seems to work fine, but randomly my console will give me a Proxy error, which causes the server to respond with a 500
If I save and refresh the error goes away, than comes back a short time later. Anybody have any insight on this one?
reactjs api express proxy redux-thunk
asked Nov 16 '18 at 14:17
DmitriyDmitriy
633316
If your Express server is behind the proxy, you don't need theAccess-Control-Allow-Originheader. Don't you want the Express route to berouter.get("/crudify", ... );?
– Tholle
Nov 16 '18 at 14:20
1
I set the route location on the app side (outside of the express router) 'app.use("/api/crudify", todos);', I will try removing the Access-Control-Allow-Origin header, thanks
– Dmitriy
Nov 16 '18 at 14:22
Just an update, removing the header didn't solve the issue.
– Dmitriy
Nov 16 '18 at 14:32
add a comment |
I have an Express API that I'm sending requests to from a React front end.
router.get("/", (req, res, next) => {
res.set({ "Access-Control-Allow-Origin": "*" });
Todo.find({}).then(todos => res.json({ todos }));
});
I have a proxy call in my package.json on the client side:
"proxy": "http://localhost:8080",
From the front end action I'm sending a request to the API
export const getTodos = () => {
return function(dispatch) {
axios
.get("/api/crudify")
.then(res =>
dispatch({
type: GET_TODOS,
payload: res.data.todos
})
)
.catch(err => console.log(err));
};
};
Everything seems to work fine, but randomly my console will give me a Proxy error, which causes the server to respond with a 500
If I save and refresh the error goes away, than comes back a short time later. Anybody have any insight on this one?
reactjs api express proxy redux-thunk
asked Nov 16 '18 at 14:17
DmitriyDmitriy
633316
I have an Express API that I'm sending requests to from a React front end.
router.get("/", (req, res, next) => {
res.set({ "Access-Control-Allow-Origin": "*" });
Todo.find({}).then(todos => res.json({ todos }));
});
I have a proxy call in my package.json on the client side:
"proxy": "http://localhost:8080",
From the front end action I'm sending a request to the API
export const getTodos = () => {
return function(dispatch) {
axios
.get("/api/crudify")
.then(res =>
dispatch({
type: GET_TODOS,
payload: res.data.todos
})
)
.catch(err => console.log(err));
};
};
Everything seems to work fine, but randomly my console will give me a Proxy error, which causes the server to respond with a 500
If I save and refresh the error goes away, than comes back a short time later. Anybody have any insight on this one?
reactjs api express proxy redux-thunk
reactjs api express proxy redux-thunk
asked Nov 16 '18 at 14:17
DmitriyDmitriy
633316
asked Nov 16 '18 at 14:17
DmitriyDmitriy
633316
asked Nov 16 '18 at 14:17
DmitriyDmitriy
633316
asked Nov 16 '18 at 14:17
DmitriyDmitriy
633316
asked Nov 16 '18 at 14:17
DmitriyDmitriy
633316
633316
If your Express server is behind the proxy, you don't need theAccess-Control-Allow-Originheader. Don't you want the Express route to berouter.get("/crudify", ... );?
– Tholle
Nov 16 '18 at 14:20
1
I set the route location on the app side (outside of the express router) 'app.use("/api/crudify", todos);', I will try removing the Access-Control-Allow-Origin header, thanks
– Dmitriy
Nov 16 '18 at 14:22
Just an update, removing the header didn't solve the issue.
– Dmitriy
Nov 16 '18 at 14:32
add a comment |
If your Express server is behind the proxy, you don't need theAccess-Control-Allow-Originheader. Don't you want the Express route to berouter.get("/crudify", ... );?
– Tholle
Nov 16 '18 at 14:20
1
I set the route location on the app side (outside of the express router) 'app.use("/api/crudify", todos);', I will try removing the Access-Control-Allow-Origin header, thanks
– Dmitriy
Nov 16 '18 at 14:22
Just an update, removing the header didn't solve the issue.
– Dmitriy
Nov 16 '18 at 14:32
If your Express server is behind the proxy, you don't need the
Access-Control-Allow-Origin header. Don't you want the Express route to be router.get("/crudify", ... );?– Tholle
Nov 16 '18 at 14:20
If your Express server is behind the proxy, you don't need the
Access-Control-Allow-Origin header. Don't you want the Express route to be router.get("/crudify", ... );?– Tholle
Nov 16 '18 at 14:20
1
1
I set the route location on the app side (outside of the express router) 'app.use("/api/crudify", todos);', I will try removing the Access-Control-Allow-Origin header, thanks
– Dmitriy
Nov 16 '18 at 14:22
I set the route location on the app side (outside of the express router) 'app.use("/api/crudify", todos);', I will try removing the Access-Control-Allow-Origin header, thanks
– Dmitriy
Nov 16 '18 at 14:22
Just an update, removing the header didn't solve the issue.
– Dmitriy
Nov 16 '18 at 14:32
Just an update, removing the header didn't solve the issue.
– Dmitriy
Nov 16 '18 at 14:32
add a comment |
1 Answer
1
active
oldest
votes
The issue I was having was nodemon was refreshing the node server and it was having a conflict with the front end React app, so adding --ignore frontend/ in my package.json seems to have fixed it.
"server": "nodemon server --ignore frontend"
answered Nov 16 '18 at 16:51
DmitriyDmitriy
633316
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53339611%2fproxy-error-with-react-express-but-only-intermittently%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
The issue I was having was nodemon was refreshing the node server and it was having a conflict with the front end React app, so adding --ignore frontend/ in my package.json seems to have fixed it.
"server": "nodemon server --ignore frontend"
answered Nov 16 '18 at 16:51
DmitriyDmitriy
633316
add a comment |
The issue I was having was nodemon was refreshing the node server and it was having a conflict with the front end React app, so adding --ignore frontend/ in my package.json seems to have fixed it.
"server": "nodemon server --ignore frontend"
answered Nov 16 '18 at 16:51
DmitriyDmitriy
633316
add a comment |
The issue I was having was nodemon was refreshing the node server and it was having a conflict with the front end React app, so adding --ignore frontend/ in my package.json seems to have fixed it.
"server": "nodemon server --ignore frontend"
answered Nov 16 '18 at 16:51
DmitriyDmitriy
633316
The issue I was having was nodemon was refreshing the node server and it was having a conflict with the front end React app, so adding --ignore frontend/ in my package.json seems to have fixed it.
"server": "nodemon server --ignore frontend"
answered Nov 16 '18 at 16:51
DmitriyDmitriy
633316
answered Nov 16 '18 at 16:51
DmitriyDmitriy
633316
answered Nov 16 '18 at 16:51
DmitriyDmitriy
633316
answered Nov 16 '18 at 16:51
DmitriyDmitriy
633316
633316
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53339611%2fproxy-error-with-react-express-but-only-intermittently%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
If your Express server is behind the proxy, you don't need the
Access-Control-Allow-Originheader. Don't you want the Express route to berouter.get("/crudify", ... );?– Tholle
Nov 16 '18 at 14:20
1
I set the route location on the app side (outside of the express router) 'app.use("/api/crudify", todos);', I will try removing the Access-Control-Allow-Origin header, thanks
– Dmitriy
Nov 16 '18 at 14:22
Just an update, removing the header didn't solve the issue.
– Dmitriy
Nov 16 '18 at 14:32