Replit部署的聊天页面Cookie存储姓名功能突发失效求排查

你的Cookie功能失效主要有几个原因，对应修复如下：

1. checkname函数逻辑判断错误 #

checkname里的判断条件逻辑错误，user == "" && user == null 永远不会成立——getCookie找不到对应Cookie时返回空字符串，不可能同时等于空字符串和null。需改成逻辑或（||）：

function checkname() {
  let user = getCookie("name");
  // 修复判断条件：空字符串 或 null 时触发名字输入
  if (user === "" || user === null) {
    checkCookie();
  } else {
    document.getElementById("welcome").innerHTML = "Welcome Back " + user;
    document.getElementById("name").value = user;
  }
}

2. Replit HTTPS环境下Cookie属性缺失 #

Replit部署的站点默认是HTTPS，现代浏览器要求HTTPS环境下的Cookie必须添加Secure属性才能被存储；同时页面包含iframe子资源，需设置SameSite属性避免被浏览器拦截。修改setCookie函数：

function setCookie(cname,cvalue,exdays) {
  const d = new Date();
  d.setTime(d.getTime() + (exdays*24*60*60*1000));
  let expires = "expires=" + d.toUTCString();
  // 添加Secure和SameSite属性，适配HTTPS环境
  document.cookie = `${cname}=${cvalue};${expires};path=/;Secure;SameSite=Lax`;
}

3. 全局变量冲突风险 #

checkCookie里的user = prompt(...)未声明变量，会成为全局变量引发潜在冲突，添加let声明：

function checkCookie() {
  // 添加let声明变量
  let user = prompt("Please enter your name (your name wont be on the internet, use your real name. this is a school chat):","");
  if (user !== "" && user !== null) {
    setCookie("name", user, 30);
    let user = getCookie("name");
    document.getElementById("name").value = user;
  } else {
    checkCookie();
  }
}

4. HTML结构错误 #

你的<body>标签过早闭合，导致<p>、<form>等元素处于<body>外部，会引发DOM元素获取异常。调整<body>闭合位置：

<body onload="checkname()">
  <p id="welcome"></p>
  <form action="https://online-chat-2.red78massive157.repl.co" method="post">
      Name: <br><input name="name" type="text" id="name" readonly/><br>
      Message: <br><input name="message" type="text" style='height:100px; width:1000px' required/><br>
      <input value="Send" type="submit"/>
  </form>
  <button onclick="checkCookie()">Change name</button>
  <br><br>
  <iframe src="https://online-chat-2.red78massive157.repl.co/chat" style='height:1000px; width:500px'/>
</body> <!-- 移至所有内容后闭合 -->
</html>

应用以上修改后，Cookie功能即可恢复正常。

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