水印 0.4.2+

Facade API	可付费升级	需要 Univer 服务端	Univer on Node.js	Preset
✅	-	-	-	❌ 通过 plugin 引入

水印功能旨在为网页或应用提供灵活且安全的水印方案。通过该功能，开发者可以在页面上动态生成文本或图片水印，以防止内容未经授权的使用或传播。并支持多种配置。

水印支持三种设置方式，分别为 UI 界面、Facade API、和插件配置。水印类型支持三种类型，分别是用户信息类型、自定义图片类型、自定义文本类型，水印的展示只支持某一种类型的展示，优先级为用户信息类型 > 自定义图片类型 > 自定义文本类型。

Presets 安装


npm install @univerjs/watermark


pnpm add @univerjs/watermark


yarn add @univerjs/watermark


bun add @univerjs/watermark


import { createUniver, defaultTheme, LocaleType, merge } from '@univerjs/presets';
import { UniverSheetsCorePreset } from '@univerjs/presets/preset-sheets-core';
import UniverPresetSheetsCoreZhCN from '@univerjs/presets/preset-sheets-core/locales/zh-CN';
import { UniverWatermarkPlugin } from '@univerjs/watermark';
 
import '@univerjs/watermark/facade';
 
const { univerAPI } = createUniver({
  locale: LocaleType.ZH_CN,
  locales: {
    [LocaleType.ZH_CN]: merge(
      {},
      UniverPresetSheetsCoreZhCN,
    ),
  },
  theme: defaultTheme,
  presets: [
    UniverSheetsCorePreset(),
  ],
  plugins: [
    UniverWatermarkPlugin,
  ],
});

配置


const { univerAPI } = createUniver({
  // ...
  plugins: [
    [UniverWatermarkPlugin, { 
      // 文本水印配置
      textWatermarkSettings: {
        content: 'Hello, Univer!',
        fontSize: 16,
        color: 'rgb(0,0,0)',
        bold: false,
        italic: false,
        direction: 'ltr',
        x: 60,
        y: 36,
        repeat: true,
        spacingX: 200,
        spacingY: 100,
        rotate: 0,
        opacity: 0.15,
      },
    }],
  ],
});

完整的配置项参考 IUniverWatermarkConfig 。

手动组合安装


npm install @univerjs/watermark


pnpm add @univerjs/watermark


yarn add @univerjs/watermark


bun add @univerjs/watermark


import { LocaleType, merge, Univer } from '@univerjs/core';
import { defaultTheme } from "@univerjs/design";
import { UniverWatermarkPlugin } from '@univerjs/watermark';
 
import '@univerjs/watermark/facade';
 
const univer = new Univer({
  theme: defaultTheme,
  locale: LocaleType.ZH_CN,
});
 
univer.registerPlugin(UniverWatermarkPlugin);

配置


univer.registerPlugin(UniverWatermarkPlugin, {
  // 文本水印配置
  textWatermarkSettings: {
    content: 'Hello, Univer!',
    fontSize: 16,
    color: 'rgb(0,0,0)',
    bold: false,
    italic: false,
    direction: 'ltr',
    x: 60,
    y: 36,
    repeat: true,
    spacingX: 200,
    spacingY: 100,
    rotate: 0,
    opacity: 0.15,
  },
});

完整的配置项参考 IUniverWatermarkConfig 。

Facade API

完整 facade api 类型定义，请查看 FacadeAPI

设置水印


univerAPI.addWatermark("text", { content: "hello", repeat: true })

移除水印


univerAPI.deleteWatermark();