研发效能 用 AI 写了一个 chrome 插件,网页自定义水印的工具,用来区分当前页面是 测试/生产 环境,根据域名匹配

kakaxixixi · 2026年06月07日 · 最后由 kakaxixixi 回复于 2026年06月29日 · 9250 次阅读

这个想法是某天晚上灵机一动,可以在页面上打上文字水印,用来区分当前是哪个环境
也算是真正 vibe coding 出了一个真正有点用处的工具

✨ 怎么用:点图标 → 加配置 → 填域名和水印文字 → 搞定!

亮点:

🌐 域名匹配 · 配一次,子域名全生效
🎨 随心调整 · 颜色/透明度/字号/密度
📋 多套配置 · 不同域名不同配置,一键复制,随时开关

有需要的大佬们可以在这安装

https://chromewebstore.google.com/detail/djimnchdlbbedppeedlcmebbmehcloeb

配置页面

效果预览(给 百度 打上一个 "百度" 的文字水印)

共收到 13 条回复 时间 点赞

还不错。

我配置了怎么不生效呢

不错哦,这个测试工具我喜欢

蹦出两字 “好玩”

对 何斌 回复

我知道了,应该是后面的".com" ".cn" 这种没加上,比如配置 “baidu.com” 会生效,光 “baidu” 这个不会生效,后缀还是要加一下的

需要网站后缀的吗?那 ip 访问的也不适用了

可以尝试本地配置域名

可以配置 ip 地址,因为当前网页域名是用这个方法获取的 window.location.hostname

对 kakaxixixi 回复

为啥一定要后缀呢,主要是为了匹配更精确一点

为啥不添加到 title 上面 我这边就是前端篡改 title 比如<原来 title> [版本 - 分支名]

对 陈子昂 回复

title 不太明显吧,在整个页面上加上水印比较显眼一些,而且可以换不同颜色

需要 登录 后方可回复, 如果你还没有账号请点击这里 注册。