Gemini 无损去水印神器:基于数学算法的纯前端解决方案

Gemini 无损去水印神器:基于数学算法的纯前端解决方案

🎯 Gemini 无损去水印神器:基于数学算法的纯前端解决方案

🔗 项目地址:gemini-watermark-remover
🌐 在线体验:banana.ovo.re
⭐ 如果觉得有用,请给项目点个 Star!

📖 引言

随着 Google Gemini AI 图像生成功能的普及,越来越多的用户开始使用它来创作各种精美的图片。然而,Gemini 生成的图片右下角都会带有一个半透明的水印 Logo,这在某些场景下可能会影响图片的使用效果。

今天给大家推荐一个开源项目 gemini-watermark-remover,它能够完美无损地移除 Gemini 图片上的可见水印,而且完全在浏览器端运行,无需上传图片到服务器,充分保护用户隐私!


✨ 核心特性

🔒 100% 客户端处理,隐私至上

  • 无需后端服务器:所有图片处理都在浏览器本地完成
  • 零数据上传:图片永远不会离开你的设备
  • 即开即用:打开网页即可使用,无需注册登录

🎯 数学精确,非 AI 模型

  • 基于反向 Alpha 混合算法(Reverse Alpha Blending)
  • 不依赖 AI 模型的"幻觉"式修复
  • 数学公式保证结果的像素级精确
  • 真正的"无损"去水印

🚀 智能检测,自动适配

  • 自动识别 48×48 或 96×96 两种水印尺寸
  • 根据图片尺寸智能选择处理策略
  • 支持各种分辨率的 Gemini 生成图片

🎨 简洁易用,体验流畅

  • 拖拽上传或点击选择
  • 实时处理,秒级完成
  • 一键下载处理后的图片
  • 支持多语言界面(中文/英文)

🌐 跨平台兼容

  • ✅ Chrome 90+
  • ✅ Firefox 88+
  • ✅ Safari 14+
  • ✅ Edge 90+

🔬 技术原理深度解析

Gemini 的水印添加方式

Gemini 使用标准的 Alpha 混合(Alpha Compositing)技术来添加水印:

watermarked = α × logo + (1 - α) × original 

其中:

  • watermarked:带水印的像素值
  • α:Alpha 通道值(0.0-1.0,控制透明度)
  • logo:水印 Logo 的颜色值(白色 = 255)
  • original:原始像素值(我们要恢复的目标)

反向求解算法

既然知道了 Gemini 添加水印的公式,我们就可以通过数学逆运算来恢复原始图像:

original = (watermarked - α × logo) / (1 - α) 

关键步骤:

  1. 捕获 Alpha 通道:在纯色背景上提取水印,重建 Alpha 映射表
  2. 应用逆公式:对每个像素应用反向混合公式
  3. 边界处理:限制 Alpha 值范围,避免除零错误
  4. 像素裁剪:确保结果在 [0, 255] 范围内

水印检测规则

项目实现了智能的水印检测机制:

图像尺寸条件水印尺寸右边距下边距
宽 > 1024 高 > 102496×9664px64px
其他情况48×4832px32px

💻 核心代码实现

1. Alpha Map 计算

/** * 从背景捕获图像计算 Alpha 通道 */exportfunctioncalculateAlphaMap(bgCaptureImageData){const{ width, height, data }= bgCaptureImageData;const alphaMap =newFloat32Array(width * height);// 对每个像素,取 RGB 三通道最大值并归一化到 [0, 1]for(let i =0; i < alphaMap.length; i++){const idx = i *4;// RGBA 格式,每像素 4 字节const r = data[idx];const g = data[idx +1];const b = data[idx +2];// 取三通道最大值作为亮度值const maxChannel = Math.max(r, g, b);// 归一化到 [0, 1] 范围 alphaMap[i]= maxChannel /255.0;}return alphaMap;}

2. 反向 Alpha 混合

/** * 使用反向 Alpha 混合移除水印 */exportfunctionremoveWatermark(imageData, alphaMap, position){const{ x, y, width, height }= position;constALPHA_THRESHOLD=0.002;// 忽略极小 alpha 值(噪声)constMAX_ALPHA=0.99;// 避免除以接近零的值constLOGO_VALUE=255;// 白色水印的颜色值// 处理水印区域的每个像素for(let row =0; row < height; row++){for(let col =0; col < width; col++){// 计算在原图中的索引const imgIdx =((y + row)* imageData.width +(x + col))*4;const alphaIdx = row * width + col;let alpha = alphaMap[alphaIdx];// 跳过极小 alpha 值if(alpha <ALPHA_THRESHOLD)continue;// 限制 alpha 值避免除零 alpha = Math.min(alpha,MAX_ALPHA);const oneMinusAlpha =1.0- alpha;// 对每个 RGB 通道应用反向混合for(let c =0; c <3; c++){const watermarked = imageData.data[imgIdx + c];// 反向 alpha 混合公式const original =(watermarked - alpha *LOGO_VALUE)/ oneMinusAlpha;// 裁剪到 [0, 255] 范围 imageData.data[imgIdx + c]= Math.max(0, Math.min(255, Math.round(original)));}}}}

3. 主引擎协调

/** * 水印引擎类 - 协调整个处理流程 */exportclassWatermarkEngine{asyncremoveWatermarkFromImage(image){// 1. 创建 Canvas 处理图像const canvas = document.createElement('canvas'); canvas.width = image.width; canvas.height = image.height;const ctx = canvas.getContext('2d'); ctx.drawImage(image,0,0);// 2. 获取图像数据const imageData = ctx.getImageData(0,0, canvas.width, canvas.height);// 3. 检测水印配置const config =detectWatermarkConfig(canvas.width, canvas.height);const position =calculateWatermarkPosition(canvas.width, canvas.height, config);// 4. 获取对应尺寸的 alpha mapconst alphaMap =awaitthis.getAlphaMap(config.logoSize);// 5. 移除水印removeWatermark(imageData, alphaMap, position);// 6. 写回 Canvas ctx.putImageData(imageData,0,0);return canvas;}}

🎬 效果展示

无损对比图

下图展示了原图与去水印后的像素级差异对比,可以看到除了水印区域外,其他部分完全一致

无损 diff 示例

实际案例

原图(带水印)处理后(无水印)
示例1
在这里插入图片描述
处理后1
在这里插入图片描述

🚀 使用方法

方式一:在线网站(推荐)

  1. 打开 banana.ovo.re
  2. 拖拽或点击选择带水印的 Gemini 图片
  3. 等待自动处理(通常只需 1-2 秒)
  4. 点击下载按钮保存处理后的图片

方式二:油猴脚本(进阶)

如果你经常使用 Gemini,可以安装油猴脚本实现自动去水印

  1. 安装 TampermonkeyGreasemonkey
  2. 打开脚本地址:gemini-watermark-remover.user.js
  3. 点击安装
  4. 在 Gemini 对话页面,点击"复制图片"或"下载图片"时会自动去除水印

方式三:本地部署

# 克隆项目git clone https://github.com/journey-ad/gemini-watermark-remover.git cd gemini-watermark-remover # 安装依赖pnpminstall# 开发模式pnpm dev # 生产构建pnpm build # 本地预览pnpm serve 

📁 项目结构

gemini-watermark-remover/ ├── public/ │ ├── index.html # 主页面 │ └── terms.html # 使用条款 ├── src/ │ ├── core/ # 核心算法模块 │ │ ├── alphaMap.js # Alpha 通道计算 │ │ ├── blendModes.js # 反向混合算法 │ │ └── watermarkEngine.js # 主引擎协调器 │ ├── assets/ # 预捕获的水印资源 │ │ ├── bg_48.png # 48×48 水印 Alpha 图 │ │ └── bg_96.png # 96×96 水印 Alpha 图 │ ├── i18n/ # 国际化语言文件 │ ├── userscript/ # 油猴脚本 │ ├── app.js # 网站应用入口 │ └── i18n.js # 国际化工具 ├── docs/ # 示例图片 ├── dist/ # 构建输出 └── build.js # 构建脚本 

🎓 技术亮点总结

1. 数学严谨性

  • 基于标准的 Alpha 混合公式
  • 通过逆运算精确恢复原始像素
  • 避免了 AI 模型的不确定性

2. 性能优化

  • 使用 Float32ArrayUint8ClampedArray 提升计算效率
  • Alpha Map 缓存机制减少重复计算
  • Canvas API 硬件加速

3. 边界处理

  • ALPHA_THRESHOLD:过滤噪声
  • MAX_ALPHA:避免除零错误
  • 像素值裁剪:确保结果合法

4. 工程化实践

  • ES6 模块化设计
  • 清晰的代码注释
  • 完善的错误处理
  • 国际化支持

⚠️ 重要说明

局限性

  1. 仅移除可见水印:只能去除右下角的半透明 Logo
  2. 无法处理隐形水印:不能去除 SynthID 等隐写水印
  3. 版本依赖:针对 Gemini 当前(2025年)的水印模式设计

免责声明

⚠️ 本工具仅供个人学习研究使用

移除水印可能涉及法律问题,请确保你的使用行为符合:当地法律法规Gemini 服务条款知识产权相关规定

作者不鼓励将本工具用于侵权、虚假陈述或其他非法用途。

本软件按"原样"提供,不提供任何形式的保证。

🌟 为什么推荐这个项目?

1. 技术价值

  • 展示了如何用纯数学方法解决实际问题
  • 代码简洁优雅,适合学习 Canvas API 和图像处理
  • 完整的工程化实践案例

2. 实用价值

  • 真正解决了 Gemini 用户的痛点
  • 完全免费开源
  • 隐私保护做得很好

3. 学习价值

  • 理解 Alpha 混合原理
  • 学习浏览器端图像处理
  • 掌握 TypedArray 的使用

🔗 相关资源


🎉 总结

gemini-watermark-remover 是一个技术上严谨、实用性强、隐私保护到位的开源项目。它用优雅的数学方法解决了 Gemini 图片水印问题,代码质量高,值得学习和使用。

如果你:

  • 经常使用 Gemini 生成图片
  • 对图像处理算法感兴趣
  • 想学习浏览器端的高性能计算
  • 关注用户隐私保护

那么这个项目绝对值得你关注!

别忘了给项目点个 ⭐ Star,支持开源!


📮 互动交流

欢迎在评论区分享:

  • 你使用这个工具的体验
  • 对算法原理的理解和疑问
  • 其他有趣的图像处理技巧

让我们一起学习进步!💪


Read more

Flink History Server 集群停了也能看已完成作业的 Web UI 与 REST 数据

1. History Server 能解决什么问题 典型痛点 * 集群关闭后,Web UI 上的作业页面消失,无法回看 DAG、算子指标、异常栈、配置 * 需要统一的“历史作业”入口做复盘对比(上线前后、参数变更前后) * 需要对接外部系统(监控、运维平台、审计平台)通过 API 拉取作业归档数据 History Server 提供能力 * 展示 JobManager 归档下来的已完成作业状态与统计信息 * 提供 REST API(返回 JSON)便于系统集成 * 支持跳转到你们已有的日志平台(Log Integration) 2. 工作机制:JM 负责“归档”,History Server 负责“展示”

AWS Kiro 账号池管理系统 | 将 Amazon Q Developer API 转换为 OpenAI 兼容格式 | 支持多账号池、OIDC 自动认证、令牌自动刷新、Web 管理控制台 | Go

AWS Kiro 账号池管理系统 | 将 Amazon Q Developer API 转换为 OpenAI 兼容格式 | 支持多账号池、OIDC 自动认证、令牌自动刷新、Web 管理控制台 | Go

Claude API - AWS Kiro 账号池管理 | OpenAI 兼容代理服务 项目地址在wget 里面 web页面访问把后缀.git删掉即可 效果图 AWS Kiro 账号池管理系统 - 将 Amazon Q Developer (Kiro) API 转换为 OpenAI 兼容格式的企业级 Go 代理服务。支持多账号池管理、OIDC 自动认证、令牌自动刷新、流式响应、完整的 Web 管理控制台。 关键词: AWS Kiro, Amazon Q Developer, Claude API, OpenAI Proxy, 账号池管理, OIDC 认证, Go

教育行业新机遇:用GLM-4.6V-Flash-WEB打造智能阅卷系统

教育行业新机遇:用GLM-4.6V-Flash-WEB打造智能阅卷系统 在一场全国性的中学期中考试后,某地教育局面临一个老问题:近十万份主观题试卷需要在五天内完成批改。以往靠抽调骨干教师集中阅卷的模式,不仅人力紧张、疲劳误判频发,还因评分标准执行不一引发争议。而今年,他们悄悄上线了一套基于 GLM-4.6V-Flash-WEB 的智能辅助阅卷系统——结果令人惊讶:90%的简答题实现自动评分,平均响应时间不到200毫秒,人工复核工作量减少70%,且评分一致性提升了45%。 这背后,正是多模态大模型技术向教育场景深度渗透的缩影。当AI不再只是“识别文字”,而是真正理解“学生写了什么、为什么这么写”,智能阅卷才从自动化工具迈向认知级助手。 从OCR到“类教师”理解:阅卷系统的代际跃迁 过去十年,教育科技领域的阅卷系统经历了三次迭代: * 第一代(纯OCR + 模板匹配):只能处理选择题卡或固定格式填空,对图像质量敏感,无法应对手写变体和开放性回答; * 第二代(NLP+规则引擎):引入关键词提取与句法分析,能初步判断语义相似度,但依赖大量人工编写规则,扩展性差; * 第三代(

前端API设计最佳实践:让你的API更优雅

前端API设计最佳实践:让你的API更优雅 毒舌时刻 API设计?听起来就像是后端工程师的事情,关前端什么事?你以为前端只需要调用API就可以了?别天真了!如果API设计得不好,前端开发会变得非常痛苦。 你以为随便设计个API就能用?别做梦了!我见过太多糟糕的API设计,比如返回的数据结构不一致,错误处理不规范,文档不完整,这些都会让前端开发者崩溃。 为什么你需要这个 1. 提高开发效率:良好的API设计可以减少前端开发的工作量,提高开发效率。 2. 减少错误:规范的API设计可以减少前端开发中的错误,提高代码的可靠性。 3. 改善用户体验:合理的API设计可以提高应用的响应速度,改善用户体验。 4. 便于维护:良好的API设计可以使代码更易于维护,减少后期的维护成本。 5. 促进团队协作:规范的API设计可以促进前后端团队的协作,减少沟通成本。 反面教材 // 这是一个典型的糟糕API设计 // 1. 不一致的命名规范 // 获取用户列表 fetch('/api/getUsers') .then(response