Gemini AI图像去水印：基于反向Alpha混合算法的纯前端实现

这是一款专注于去除Gemini AI生成图片中水印的浏览器工具。它采用数学精确的算法，完全在用户本地浏览器中运行，无需依赖后端服务，保障了处理速度与用户隐私。

核心特性

• 纯前端实现 - 所有图像处理逻辑均在浏览器中完成，无需后端服务器支持，体现了现代前端工程化应用的强大能力。
• 隐私安全保障 - 您的图片数据不会离开本地设备，彻底避免了上传到第三方服务器的隐私风险。
• 算法驱动，非AI模型 - 基于精确的数学公式进行反向Alpha混合计算，结果稳定可预测，不依赖概率性的AI模型。
• 智能尺寸检测 - 工具可自动识别图像并匹配48×48或96×96两种标准水印尺寸。
• 操作极简 - 支持拖拽上传，一键即可完成水印去除与结果下载。
• 广泛兼容性 - 支持所有符合现代标准的桌面及移动端浏览器。

处理效果对比

下方展示了工具处理前后的效果对比。

示例	原图（带水印）	处理后（无水印）
示例一
示例二

使用方式

在线网页版

1. 访问工具官网：banana.ovo.re。
2. 将带水印的Gemini图片拖入网页区域，或点击按钮选择文件。
3. 页面将自动完成水印检测与移除处理。
4. 点击下载按钮，即可保存处理后的清晰图片。

浏览器脚本版（油猴脚本）

若希望在使用Gemini时自动去除复制或下载图片中的水印，可安装用户脚本：

1. 确保浏览器已安装用户脚本管理器（如Tampermonkey）。
2. 访问脚本地址安装gemini-watermark-remover.user.js。
3. 安装后，在Gemini对话页面进行正常操作，脚本将在后台自动处理水印。

开发与构建

项目基于现代前端工具链开发，构建命令如下：

# 安装项目依赖
pnpm install

# 启动本地开发服务器
pnpm dev

# 执行生产环境构建
pnpm build

# 预览生产构建产物
pnpm serve

算法原理深度解析

Gemini水印的添加机制

Gemini通过Alpha混合技术叠加水印，公式为：
watermarked = α × logo + (1 - α) × original
其中，watermarked代表最终带水印的像素值，α是透明度（Alpha通道），logo是水印logo的色值（通常为白色255），original是原始图像像素值。

水印的逆向移除算法

本工具的核心在于对上述公式进行逆向求解，以恢复原始图像：
original = (watermarked - α × 255) / (1 - α)
为了获取关键的透明度α，工具通过分析在纯色背景上捕获的水印logo图像，精确计算出每个像素点的Alpha值，从而应用反向公式复原图像。

水印检测规则

工具根据原始图像尺寸自动适配水印配置：

图像尺寸条件	水印尺寸	右边距	下边距
宽度 > 1024 且 高度 > 1024	96×96	64px	64px
其他情况	48×48	32px	32px

项目目录结构

gemini-watermark-remover/
├── public/                      # 静态资源
│   ├── index.html              # 应用主页面
│   └── terms.html              # 使用条款页面
├── src/                        # 源代码
│   ├── core/                   # 核心算法模块
│   │   ├── alphaMap.js         # Alpha通道映射计算
│   │   ├── blendModes.js       # 反向Alpha混合算法实现
│   │   └── watermarkEngine.js  # 水印处理主引擎
│   ├── assets/                 # 资源文件
│   │   ├── bg_48.png           # 48px水印背景图
│   │   └── bg_96.png           # 96px水印背景图
│   ├── i18n/                   # 国际化多语言文件
│   ├── userscript/             # 油猴脚本源码
│   ├── app.js                  # 应用入口
│   └── i18n.js                 # 国际化工具
├── dist/                       # 构建输出目录
├── build.js                    # 构建脚本
└── package.json

核心模块详解

alphaMap.js - 透明度计算

此模块负责从捕获的背景图中计算水印的Alpha通道映射。

export function calculateAlphaMap(bgCaptureImageData) {
    // 提取RGB通道最大值并归一化到[0, 1]区间
    const alphaMap = new Float32Array(width * height);
    for (let i = 0; i < alphaMap.length; i++) {
        const maxChannel = Math.max(r, g, b);
        alphaMap[i] = maxChannel / 255.0;
    }
    return alphaMap;
}

blendModes.js - 反向混合算法

实现核心的反向Alpha混合公式，用于逐像素恢复原始图像。

export function removeWatermark(imageData, alphaMap, position) {
    // 对每个像素应用公式：original = (watermarked - α × 255) / (1 - α)
    for (let row = 0; row < height; row++) {
        for (let col = 0; col < width; col++) {
            const alpha = Math.min(alphaMap[idx], MAX_ALPHA);
            const original = (watermarked - alpha * 255) / (1.0 - alpha);
            imageData.data[idx] = Math.max(0, Math.min(255, original));
        }
    }
}

watermarkEngine.js - 处理流程引擎

主引擎类，协调水印检测、Alpha映射获取与图像处理的全流程。

export class WatermarkEngine {
    async removeWatermarkFromImage(image) {
        // 1. 根据图像尺寸检测水印配置
        const config = detectWatermarkConfig(width, height);
        // 2. 获取对应尺寸的Alpha映射表
        const alphaMap = await this.getAlphaMap(config.logoSize);
        // 3. 应用算法移除水印
        removeWatermark(imageData, alphaMap, position);
        return canvas;
    }
}

浏览器兼容性

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

必需的浏览器特性支持：ES6模块、Canvas API、Async/Await、TypedArray（Float32Array, Uint8ClampedArray）。这种对底层API的运用，也是现代人工智能及图像处理应用在前端落地的技术基础之一。

项目资源

• 项目主页与源码：https://github.com/journey-ad/gemini-watermark-remover
• 用户脚本地址：https://greasyfork.org/zh-CN/scripts/559574-gemini-nanobanana-watermark-remover