Mongoose项目中HTTP/HTTPS同时访问Web UI Dashboard的Cookie冲突问题解析

在Mongoose项目（版本7.14及7.15）的web-ui-dashboard参考实现中，开发人员发现了一个关于HTTP和HTTPS协议同时访问时的Cookie处理问题。这个问题表现为当用户同时通过HTTP和HTTPS访问同一个Web UI Dashboard时，HTTP连接下的部分页面内容无法正常显示。

问题现象

当服务器同时启用HTTP（端口8000）和HTTPS（端口8443）服务时：

1. 单独使用HTTP访问时，所有功能页面（Dashboard、Settings、Firmware Update和Events）都能正常显示
2. 一旦有用户通过HTTPS登录后，HTTP连接下的Dashboard、Settings和Events页面将显示为空白
3. 通过HTTPS访问则始终能正常显示所有内容
4. 当HTTPS用户注销后，HTTP访问又恢复正常

问题根源分析

经过深入排查，发现问题源于现代浏览器对Cookie安全策略的实施。具体机制如下：

1. 当HTTPS连接设置了一个带有Secure属性的Cookie后
2. 浏览器会阻止同一域名下HTTP连接设置同名的Cookie
3. 在控制台会显示警告："尝试通过Set-Cookie标头设置Cookie的操作被禁止了，因为此标头不是通过安全连接发送的，而且会覆盖具有Secure属性的Cookie"
4. 这导致HTTP连接无法成功设置access_token，后续请求中浏览器无法提供有效的认证令牌
5. 服务器收到空令牌后返回403未授权响应，造成页面内容无法加载

解决方案

Mongoose项目团队提出了两种解决方案：

方案一：为HTTPS Cookie添加前缀（未成功）

最初尝试为HTTPS连接的Cookie值添加"s_"前缀：

mg_http_reply(c, 200, cookie, "{%m:%c%s%M%c}", 
              MG_ESC("user"), '"', c->is_tls ? "s_" : "", 
              MG_ESC(u->name), '"');

但这种方法未能解决问题，因为浏览器是根据Cookie名称而非值来进行安全策略判断的。

方案二：使用不同的Cookie名称（有效方案）

最终有效的解决方案是为HTTP和HTTPS连接使用完全不同的Cookie名称：

static void handle_login(struct mg_connection *c, struct user *u) {
  char cookie[256];
  const char *cookie_name = c->is_tls ? "secure_access_token" : "access_token";
  mg_snprintf(cookie, sizeof(cookie),
              "Set-Cookie: %s=%s; Path=/; "
              "%sHttpOnly; SameSite=Lax; Max-Age=%d\r\n",
              cookie_name, u->access_token, 
              c->is_tls ? "Secure; " : "", 3600 * 24);
  mg_http_reply(c, 200, cookie, "{%m:%m}", MG_ESC("user"), MG_ESC(u->name));
}

这个方案通过以下方式解决问题：

1. HTTPS连接使用"secure_access_token"作为Cookie名
2. HTTP连接继续使用"access_token"作为Cookie名
3. 两种连接的Cookie互不干扰，避免了浏览器的安全策略限制

技术背景延伸

这个问题的出现与现代Web安全机制密切相关：

1. Secure Cookie属性：标记为Secure的Cookie只能通过HTTPS连接传输，防止中间人攻击
2. 同源策略：虽然HTTP和HTTPS被视为不同协议，但浏览器对同一域名的Cookie处理有特殊规则
3. Cookie覆盖保护：浏览器防止低安全性的连接覆盖高安全性的Cookie，这是重要的安全特性

最佳实践建议

在实现同时支持HTTP和HTTPS的Web服务时，开发者应当：

1. 为不同安全级别的连接使用不同的Cookie名称
2. 确保HTTPS连接的Cookie始终设置Secure属性
3. 考虑逐步淘汰HTTP支持，全面转向HTTPS
4. 在必须支持双协议的场景下，做好充分的兼容性测试

这个问题展示了Web安全机制与实际业务需求之间的平衡考量，也体现了Mongoose项目团队对安全细节的重视。通过这个案例，开发者可以更好地理解现代浏览器安全策略对Web应用设计的影响。