Why Are My httpOnly Cookies Not Stored or Sent with JavaScript Fetch in .NET?

Below are some items to check and adjust when working with httpOnly cookies in a cross-site (or different port) environment:

---

1. Cookie Attributes (SameSite / Secure)

Modern browsers enforce that cookies used in cross-site requests must specify:

• SameSite=None
• Secure

Make sure your server’s response sets the cookie with these attributes. For example, with .NET Core Identity you may need to configure your cookie options like so:

CSHARPCopied
services.ConfigureApplicationCookie(options =>
{
    options.Cookie.HttpOnly = true;
    options.Cookie.SameSite = SameSiteMode.None;
    options.Cookie.SecurePolicy = CookieSecurePolicy.Always;
});

---

2. Domain and Path Matching

Ensure that the cookie’s domain and path settings are correct for your deployment. If you’re using different ports (e.g. 7001 vs. 3000) or subdomains, the cookie might be considered third party by the browser. If necessary, explicitly specify the domain:

CSHARPCopied
options.Cookie.Domain = "localhost"; // adjust accordingly

---

3. CORS Settings and Credentials

You already have a CORS policy allowing credentials. Verify that:

• The client fetch request uses credentials: 'include'
• The server’s CORS settings allow the correct origin

Even though you have a wildcard (SetIsOriginAllowed(origin => true)), double-check that the Origin header is correctly sent by the browser.

---

4. Viewing httpOnly Cookie in DevTools

Remember that httpOnly cookies are not accessible via JavaScript (i.e. cannot be read via document.cookie) but they should appear in the Application > Cookies tab in Chrome’s dev tools if they are stored on the right domain.

If you do not see them there, check the following:

• Verify that the cookie is being sent with the expected domain (e.g. “localhost”) and path.
• If you’re running on different ports, it might be viewed under the port number corresponding to the response domain.
• Sometimes cookies from responses with a 204 (No Content) status might not update or persist as expected. You may need to ensure that the login endpoint returns a 200 with some content if you continue to have issues.

---

5. Logging and Debugging

Use browser developer tools to inspect the exact Set-Cookie header in the Network tab. This will help confirm that the cookie includes HttpOnly, SameSite=None, and Secure (if in a secure context). For example, you might see a header like:

Set-Cookie: .AspNetCore.Identity.Application=...; path=/; HttpOnly; Secure; SameSite=None

If any attribute is missing, adjust your backend configuration accordingly.

---

Summary

Even though you’re seeing the cookie in the Network tab, Chrome’s treatment of third-party cookies (due to port differences or domain mismatches) and attribute settings (SameSite/Secure) can cause it not to appear in the Cookies section or be sent on subsequent requests. Review the cookie attributes, domain/path settings, and CORS credentials to solve the problem.

These changes should help ensure that the cookie is properly stored and accessible for subsequent authenticated requests.