title: ExpressJS & AJAX - Session Returns Undefined
body: <h2><strong>Structure</strong></h2>
  <p>I have an API hosted on a secure server with HTTPS.</p>
  <p>as such: <code>https://example.com</code></p>
  <p>Also, I have a frontend <code>index.html</code> located on my Desktop.</p>
  <hr />
  <h2><strong>Goal</strong></h2>
  <p>I would like to send an ajax post request to the api and have the api save a value in the session and retrieve it. Like so:</p>
  <ol>
  <li>Index.html makes POST ajax request to API</li>
  <li>API saves a value in session</li>
  <li>Index.html makes POST ajax request to API</li>
  <li>API prints out the value in session</li>
  </ol>
  <hr />
  <h2>API Code</h2>
  <p>First I allowed connections from all origins by using <code>cors()</code>.
  And I have set up my <code>session()</code> as so.</p>
  <pre><code>app.use(
      cors({
          origin: true,
          optionsSuccessStatus: 200,
          credentials: true,
      })
  );
  app.options(
      '*',
      cors({
          origin: true,
          optionsSuccessStatus: 200,
          credentials: true,
      })
  );
  
  app.use(session({
      secret: &quot;wefwefwe&quot;,
      cookie: {
          sameSite: &quot;none&quot;,
          secure: false,
          maxAge: 360000000
      },
      saveUninitialized: false
  }))
  </code></pre>
  <p>And then there's these 2 routes which will be called by the <code>index.html</code></p>
  <pre><code>app.post('/createSession', async (req, res) =&gt; {
      req.session['test'] = &quot;HIIIII&quot;;
      res.send(&quot;200&quot;);
  })
  app.post('/getSession', async (req, res) =&gt; {
      console.log(req.session['test']);
      res.send(&quot;200&quot;);
  })
  </code></pre>
  <hr />
  <h2>AJAX Code</h2>
  <p>There are 2 ajax calls, one is to create the session and the other is to retrieve the session.</p>
  <pre><code>$.ajax({
          url: `https://example.com/createSession`, 
          type: &quot;POST&quot;,
          dataType: &quot;json&quot;,
          crossDomain: true,
          xhrFields: { withCredentials: true },
          success: function (result) {
              console.log(result);
          }
      });
  
  $.ajax({
          url: `https://example.com/getSession`, 
          type: &quot;POST&quot;,
          dataType: &quot;json&quot;,
          crossDomain: true,
          xhrFields: { withCredentials: true },
          success: function (result) {
              console.log(result);
          }
      });
  </code></pre>
  <hr />
  <h2>Problem</h2>
  <p>Upon POST to <code>/createSession</code>, I received this issue
  <a href="https://i.stack.imgur.com/sWuoW.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/sWuoW.png" alt="enter image description here" /></a></p>
  <p>However, when I changed secure to true - <code>secure: true</code>, The <code>/createSession</code> request doesn't even contain a <code>set-cookie</code> header.</p>
  <p>Thus, when I POST to <code>/getSession</code>, it shows as <code>undefined</code>.</p>
  <p>Could someone help me out with this please? For some reason I seem to get stuck with sessions on almost every project I embark on. :/</p>