直接双击打开html文件无法测试cookie和localstorage，因file://协议下document.cookie被禁用（chrome 94+直接拒绝），localstorage虽可读写但storage事件不触发；必须使用http服务（如vs code live server或npx http-server）才能完整模拟真实环境。
为什么直接双击打开HTML文件无法测试Cookie和localStorage
因为浏览器在file://协议下会禁用document.cookie写入（部分浏览器静默失败，Chrome 94+直接拒绝）且localStorage虽可读写但部分API行为异常（如storage事件不触发）。必须走http://或https://协议才能完整模拟真实环境。
用VSCode内置Live Server插件启动HTTP服务
这是最轻量、无需配置的方案，适合日常调试：
- 安装官方插件
Live Server（作者：Ritwick Dey） - 右键你的
index.html→ 选择Open with Live Server - VSCode会自动在终端输出类似
Starting server on http://127.0.0.1:5500的地址，浏览器将打开该URL - 此时
document.cookie = "test=123"和localStorage.setItem("key", "val")均可正常工作
手动启动本地HTTP服务器（无插件依赖）
当Live Server插件不可用或需自定义端口/HTTPS时，可用Node.js快速起服：
- 确保已安装
node（终端运行node -v验证） - 在项目根目录执行：
npx http-server -p 8080 - 访问
http://localhost:8080即可，http-server默认支持CORS和静态资源服务 - 注意：不要用
python -m http.server，它不支持Set-Cookie响应头（无Access-Control-Allow-Origin等必要头），会导致Cookie写入失败
测试Cookie和localStorage时容易忽略的细节
即使跑在HTTP下，仍可能因以下原因导致行为不符合预期：
-
document.cookie写入必须带path=/（否则默认为当前路径，子页面读不到）；若要跨域共享还需domain和SameSite设置 -
localStorage是协议+域名+端口三级隔离的，http://localhost:5500和http://127.0.0.1:5500视为不同源，数据不互通 - 修改
localStorage后，同一页面内其他脚本不会自动感知变更，需手动监听window.addEventListener('storage', handler) - 使用
http://localhost而非http://127.0.0.1更稳妥，某些旧版浏览器对127.0.0.1的Cookie策略更严格
真正卡住人的往往不是语法，而是协议、域名、路径这三者的隐式绑定关系。每次改完记得清空浏览器对应站点的存储再试。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
