隐形水印嵌入技术详解
2025-07-06
21
参考资料
隐形水印嵌入技术详解
隐形水印嵌入技术详解（含HTML代码示例）
1. 图片水印技术
1.1 频域水印（DCT变换）
<!-- 客户端JavaScript实现DCT水印 -->
<script>
// 使用canvas处理图像
function embedDCTWatermark(imageData, watermarkText) {
const blockSize = 8;
const strength = 5; // 水印强度
// 转换为灰度图像并分块
for(let y=0; y<imageData.height; y+=blockSize) {
for(let x=0; x<imageData.width; x+=blockSize) {
// 对每个8x8块进行DCT变换
// 在中频系数嵌入水印信息
// 逆DCT变换回空域
}
}
return watermarkedData;
}
</script>1.2 LSB水印（最低有效位）
<!-- 使用canvas的像素操作 -->
<canvas id="watermarkCanvas"></canvas>
<script>
function embedLSBWatermark(image, watermark) {
const canvas = document.getElementById('watermarkCanvas');
const ctx = canvas.getContext('2d');
ctx.drawImage(image, 0, 0);
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
const data = imageData.data;
// 将水印转换为二进制
const binaryWatermark = stringToBinary(watermark);
let wmIndex = 0;
// 在RGB通道的LSB嵌入
for(let i=0; i<data.length; i+=4) {
if(wmIndex < binaryWatermark.length) {
// 红色通道LSB
data[i] = (data[i] & 0xFE) | parseInt(binaryWatermark.charAt(wmIndex++));
}
// 可继续嵌入到绿色和蓝色通道
}
ctx.putImageData(imageData, 0, 0);
return canvas.toDataURL();
}
</script>2. 文本水印技术
2.1 不可见Unicode字符
<!-- 在文本中插入零宽度字符 -->
<script>
function embedTextWatermark(originalText, userId) {
// 将用户ID转换为零宽度Unicode序列
const zeroWidthChars = ['\u200B', '\u200C', '\u200D', '\uFEFF'];
let watermarkedText = originalText;
let binaryId = userId.toString(2);
// 每2位用一个零宽度字符表示
for(let i=0; i<binaryId.length; i+=2) {
const bits = binaryId.substr(i, 2);
const zIndex = parseInt(bits, 2);
watermarkedText += zeroWidthChars[zIndex];
}
return watermarkedText;
}
</script>2.2 CSS微调水印
<style>
.watermarked {
letter-spacing: 0.1px; /* 正常间距 */
}
.watermarked::after {
content: "\200B\200C\200D"; /* 零宽度字符 */
font-size: 0;
}
</style>
<script>
function applyTextWatermark(elementId, watermark) {
const element = document.getElementById(elementId);
element.classList.add('watermarked');
// 通过伪元素添加不可见水印
const style = document.createElement('style');
style.textContent = `#${elementId}::after {
content: "${stringToUnicode(watermark)}";
}`;
document.head.appendChild(style);
}
</script>3. 水印检测代码
<script>
// 检测图片LSB水印
function detectLSBWatermark(imageData) {
let binary = '';
const data = imageData.data;
for(let i=0; i<data.length; i+=4) {
// 提取红色通道LSB
binary += (data[i] & 1).toString();
if(binary.length % 8 === 0) {
const char = binaryToChar(binary.substr(-8));
if(char === '\0') break; // 假设以null字符结束
}
}
return binaryToString(binary);
}
// 检测文本零宽度水印
function detectTextWatermark(text) {
const zeroWidthRegex = /[\u200B-\u200D\uFEFF]+/g;
const matches = text.match(zeroWidthRegex);
if(!matches) return null;
let binary = '';
matches 