I got this case where after deployment to Heroku, my cookies are not set to the client. When running localhost, the cookies are set as expected and its working, but after deployed to Heroku the cookies are set on the backend web app instead of the client (where I want it to be set).
The client is deployed as the first web app below, and the server as the later, so they are separated

When I log on into the client after it has been deployed (react), the cookie is not set there but on the backend app instead. So the cookie is set successfully, but not to my client side.

Why are the cookies ending up here?! I want cookie on client

My express, cookie-parser, cors app looks like like this:
const express = require("express");
const cors = require("cors");
const morgan = require("morgan");
const mongoose = require("mongoose");
var cookieParser = require("cookie-parser");
const app = express();
const PORT = process.env.PORT || 4040;
require("dotenv").config();
//connect to db
mongoose.connect(
process.env.MONGODB_URI ||
`mongodb+srv://${process.env.MONGODB_USER}:${process.env.MONGODB_PASSWORD}@shopproject.xaroy.mongodb.net/shopitems?retryWrites=true&w=majority`,
{
useNewUrlParser: true,
useUnifiedTopology: true,
}
);
mongoose.connection.on("connected", () => {
console.log("Connected to Mongodb");
});
//middleware
app.set("trust proxy", 1);
app.use(express.json());
app.use(express.urlencoded({ extended: true }));
app.use(cookieParser());
app.use(
cors({
origin: ["https://gigvilla.herokuapp.com", "http://gigvilla.com"],
credentials: true,
allowedHeaders: [
"Content-Type",
"Accept",
"Origin",
"X-Requested-With",
"Authorization",
"Set-Cookie",
],
})
);
//http req logger
app.use(morgan("tiny"));
app.get("/", (req, res) => {
res.cookie("trol", "valle").send("hello");
});
//Getting routes to app
const authRoutes = require("./routes/auth");
const shopRoutes = require("./routes/shop");
const storeRoutes = require("./routes/store");
//below test
app.use(authRoutes);
app.use(shopRoutes);
app.use(storeRoutes);
// app.use(storeRoutes);
//test
app.listen(PORT, console.log(`server is running at ${PORT}`));
with the following snippet sending the cookie
exports.loginUser = async (req, res, next) => {
//Validate
const { error } = loginValidation(req.body);
if (error) return res.status(400).send(error.details[0].message);
//Check for existing user
const user = await User.findOne({ email: req.body.email.toLowerCase() });
if (!user) return res.status(400).send("Email does not exist");
if (user.authenticated === false) return res.status(400).send("Not verified");
//Password is correct
const validPass = await bcrypt.compare(req.body.password, user.password);
if (!validPass) return res.status(400).send("Invalid password");
//Create and assign JWT token
const token = jwt.sign(
{ userId: user._id, userName: user.user },
process.env.JWT_TOKEN_SECRET
);
res
.status(202)
.cookie("Authorization", "Bearer " + token, {
httpOnly: true,
maxAge: 3600000,
sameSite: "none",
secure: true,
})
.cookie("just testing", "my name is", {
httpOnly: false,
maxAge: 3600000,
sameSite: "none",
secure: true,
path: "/",
})
.json({ userName: user.user });
};
Anyone know how to solve this? Getting very desperate at this point.. (16 hours in..)