title: MERN Application is not storing session
body: <p>My MERN application is failing to store the session on the browser.  The backend is being hosted on Heroku and the client is being hosted by Vercel.  When I switch over to localhost, it works as expected, but on deployment, it fails to store any sessions.  If I try to log in a user, it will pass the authentication, but it won't store a session on my browser.</p>
  <p>I get this error:</p>
  <pre><code>    Access to XMLHttpRequest at 'https://myapp-backend.herokuapp.com/user' from origin 'https://myapp-client.vercel.app' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Credentials' header in the response is '' which must be 'true' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
  </code></pre>
  <p>Here is what I have.</p>
  <p>Server.js:</p>
  <pre><code>const url = process.env.MONGO_DB_URL
  
  mongoose.connect(url, {
    useNewUrlParser: true,
    useCreateIndex: true,
    useUnifiedTopology: true,
    useFindAndModify: false,
  })
  
  const db = mongoose.connection
  db.on('error', console.error.bind(console, 'connection error'))
  db.once('open', () =&gt; {
    console.log('connected to mongo database')
  })
  
  const app = express()
  
  app.set('views', path.join(__dirname, 'views'))
  
  app.use(
    mongoSanitize({
      replaceWith: '_',
    })
  )
  app.use(helmet())
  app.use(express.json())
  app.use(
    cors({
      origin: ['http://192.168.1.14:3000', 'https://myapp-client.vercel.app'],
      credentials: true,
    })
  )
  app.use(express.static(path.join(__dirname, 'public')))
  
  // express session middleware
  
  const store = MongoStore.create({
    mongoUrl: url,
    secret: process.env.MONGO_SECRET,
    touchAfter: 24 * 60 * 60,
  })
  
  store.on('error', err =&gt; {
    console.log(err)
  })
  
  app.use(
    session({
      store,
      name: 'rfts',
      secret: process.env.MONGO_SECRET,
      resave: false,
      saveUninitialized: true,
      cookie: {
        expires: Date.now() + 1000 * 60 * 60 * 24 * 3,
        maxAge: 1000 * 60 * 60 * 24 * 3,
        httpOnly: true,
        secure: true,
    })
  )
  
  app.use(cookieParser(process.env.COOKIE_SECRET))
  
  // passport middleware
  app.use(passport.initialize())
  app.use(passport.session())
  passport.use(new LocalStrategy(User.authenticate()))
  passport.serializeUser(User.serializeUser())
  passport.deserializeUser(User.deserializeUser())
  
  const PORT = process.env.PORT || 3001
  
  app.listen(PORT, () =&gt; {
    console.log(`listening on port ${PORT}`)
  })
  </code></pre>
  <p>And on the client, I use this to make calls to the server:</p>
  <pre><code>import axios from 'axios'
  
  const macUrl = 'http://192.168.1.14:3001'
  const localUrl = 'http://localhost:3001'
  const herokuUrl = 'https://myapp-backend.herokuapp.com'
  
  const axiosCall = axios.create({
    baseURL: herokuUrl,
    withCredentials: true,
  })
  
  export default axiosCall
  
  </code></pre>
  <p>ANY advice would be greatly appreciated!</p>