Wedding Website

宾客输入名字,就能找到自己的座位。

私人客户 · 2026

这是为一场私人婚礼做的网站。宾客到场后,只要输入自己的名字,就能立刻看到自己坐在哪一桌、哪个位置,还有整个会场的座位图。

试用一下

可交互演示

新人的宾客名单一直在变,直到婚礼前一周都还在改,而且他们完全不想学一个新工具来管理名单。我做的东西必须让他们继续用原来的方式改名单——也就是在一个表格里改——网站自己跟着更新就行。它还得能在手机上用,在婚礼现场用,在信号不稳定的地方用,面对的是从没见过这个网站的宾客。

新人把宾客名单放在一个 Google 表格里,和他们原本的习惯一样。网站直接读取这个表格,所以只要表格一改,网站上的内容也会跟着变,完全不需要任何人去碰网站本身。宾客只要在一个输入框里打上自己的名字,就能立刻得到答案。

我还确保了就算 Google 服务出问题,网站也能继续用:网站自己保存了一份最新的宾客名单副本,出问题时就用这份副本,而不是直接显示错误。婚礼当天,一个打不开的网站比没有网站还糟糕。

技术细节写给技术读者

用 Next.js 搭建,部署在 Cloudflare Workers 上,通过 wrangler 发布。宾客名单来自一个公开发布的 Google 表格,在构建时和按固定时间读取为 CSV 格式,并提交了一份 snapshot.json 作为读取失败时的备用数据——网站会退回到虽然不是最新、但仍然准确的数据,而不是报错。姓名匹配对大小写、空格,以及同一位宾客的泰文和英文拼写差异都做了标准化处理。座位位置只需通过一个仅在开发环境使用的校准工具设置一次,它会把每张桌子的坐标换算成场地平面图的比例位置,这样即使换了场地照片,座位图依然能用。访问需要 URL 中的一个专属代码,防止宾客名单被外部随意查看,测试也覆盖了 CSV 解析、姓名匹配和快照回退这几个部分。

上面的演示用的是虚构的宾客名单重新搭建的版本。真实网站保存着宾客的真实姓名和地址,所以从不会嵌入在这里。