如何使用react-cookie-consent配置cookie的httpOnly与secure选项？

问题原因及解决方案 #

• httpOnly 属性无法通过前端JavaScript设置，这是浏览器的原生安全限制。该属性仅能通过服务端返回的Set-Cookie响应头配置，前端document.cookieAPI不支持写入该属性，因此你给前端组件传递httpOnly: true的配置不会生效，属于正常现象。react-cookie-consent底层依赖js-cookie实现Cookie操作，js-cookie也明确不支持设置httpOnly属性，不属于配置遗漏问题。
• 如果你要求Cookie同意标记必须为httpOnly，需要调整实现逻辑：监听用户点击同意按钮的事件，向后端发送请求，由后端接口返回带Set-Cookie响应头的结果，在响应头中完成httpOnly、secure、SameSite等属性的配置。
• 针对secure属性不生效的问题可按以下方向排查：
  1. 确认你使用的react-cookie-consent版本≥2.0.0，只有2.0以上版本才支持extraCookieOptions参数，低于该版本请先升级包版本。
  2. 本地调试时如果站点是HTTP协议，secure属性会被浏览器自动忽略，只有在HTTPS环境下该属性才会真正生效。
  3. 该组件的cookieSecurity参数本身默认会自动检测站点协议，HTTPS环境下自动设为true，和extraCookieOptions中的secure同时配置时，extraCookieOptions的优先级更高。

内容的提问来源于stack exchange，提问作者Vlado