如何使用Google Web App展示基于用户名定制的网页并解决显示异常问题

• 你的页面闪现后弹出警告的核心原因大概率是首次访问状态判断和后续数据拉取逻辑的时序冲突：你当前的代码在检测到首次访问、加载欢迎页的同时，可能已经触发了Google Sheet数据拉取逻辑，一旦拉取请求出现跨域、权限报错，或者JS逻辑抛出未捕获的异常，就会触发你代码里的兜底跳转逻辑，直接切到警告页，导致正常页面只显示1秒。
• 你可以先打开浏览器控制台（按F12），切换到Console和Network标签，刷新页面复现问题，就能直接定位具体报错：重点看是不是存在跨域错误、Google Sheet API调用返回403/404错误、或者JS变量未定义的运行时报错。

你要实现的「提交用户名→拉取Google Sheet对应数据→生成定制表单」的需求，推荐用更稳定的方案实现，从根源避免报错和页面异常：

1. 用Google Apps Script做中间代理层，避免前端直接调用Google Sheet API引发的权限、跨域问题：
   • 给你存储数据的Google Sheet绑定一个Apps Script，编写doPost方法接收前端传递的用户名参数，在Sheet中匹配对应用户的表单配置数据后，以JSON格式返回给前端
   • 将该Apps Script部署为公开Web应用，访问权限设置为任何人，甚至匿名用户，部署完成后就能得到一个无跨域限制的接口地址
2. 调整页面的逻辑执行顺序，避免状态冲突：
   • 页面初始化时，先判断首次访问状态，确认是首次访问就直接渲染欢迎页和用户名提交表单，此时不要触发任何数据拉取逻辑
   • 用户提交用户名后，先显示加载状态，再请求上面部署的Apps Script接口
   • 接口返回成功时，根据返回的定制数据渲染对应表单页面；接口返回失败（比如用户名不存在、请求异常）时，在当前页显示友好的错误提示即可，不要做全页面跳转
3. 可以额外做页面渲染优化：默认给页面根容器加display: none的样式，等所有状态判断、页面内容准备完成后，再把容器设置为显示，彻底避免页面闪现的问题。

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