图片修复功能支持指定图片中需要修复的区域，并对其中的主体进行识别，通过 AI 算法智能填充与周围区域相似的图片纹理，从而快速、准确地修复图片中的瑕疵，提高工作效率、降低成本。本文将介绍如何使用 腾讯云数据万象（CI）的 图像修复 能力，快速涂抹修复图片瑕疵。
摄影后期制作时，修复图片瑕疵及背景杂物，帮助摄影师节省时间和精力。
修复老照片中的划痕、污渍等瑕疵。
电商平台中的商品图片修复，提升商品图片的质量和美观度，吸引更多的消费者。
创建数据万象存储桶，详情请参见 存储桶操作。
上传待处理的图片 到存储桶中。
参考 图片瑕疵涂抹修复创建 html 文件，根据原图大小来初始化 Canvas 画布，原图为存储在存储桶中的图片：
<canvas id="canvas"></canvas><script type="text/javascript"> const canvas = document.getElementById('canvas'); // 原图存储在 Bucket 中，原图地址为： const imgSrc = `https://${config.Bucket}.cos.${config.Region}.myqcloud.com/${config.FileName}`; const img = new Image(); img.crossOrigin = 'anonymous'; // 跨域设置，必须 img.onload = () => { // 获取图片尺寸初始化画布 const context = canvas.getContext('2d'); originWidth = img.width; originHeight = img.height; canvas.width = originWidth; canvas.height = originHeight; context.clearRect(0, 0, originWidth, originHeight); }; img.src = imgSrc;</script>
说明
若存储桶为私有读，则对象地址需要携带签名，详情请参见 请求签名。
若存在跨域问题，则需要进行存储桶跨域访问 CORS 设置，详情请参见 设置跨域访问。
原图效果示例：
下面以鼠标标记涂抹区域为例，介绍制作遮罩图的方法。
// 使用鼠标标记涂抹区域
function setCanvasDraw(context) {
const context = canvas.getContext('2d');
let isDrawing = false;
let y = 0;
// 画线条标记涂抹区域
const drawLine = (context, x0, y0, x1, y1) => {
context.beginPath();
context.strokeStyle = 'white'; // 涂抹区域为白色
context.lineWidth = 30;
context.moveTo(x0, y0);
context.lineTo(x1, y1);
context.lineJoin = 'round';
context.lineCap = 'round';
context.stroke();
};
// 鼠标按下：开始涂抹
canvas.addEventListener('mousedown', event => {
x = event.layerX;
y = event.layerY;
isDrawing = true;
});
// 鼠标移动：持续涂抹
canvas.addEventListener('mousemove', event => {
if (isDrawing) {
drawLine(context, x, y, event.layerX, event.layerY);
x = event.layerX;
y = event.layerY;
}
});
// 鼠标抬起：结束涂抹
canvas.addEventListener('mouseup', event => {
if (isDrawing) {
drawLine(context, x, y, event.layerX, event.layerY);
x = 0;
y = 0;
isDrawing = false;
}
});
}
遮罩图示例（白色为涂抹区域）：
注意
遮罩图需与原图相同尺寸，背景为黑色，需要涂抹的区域为白色。
最后将 Canvas 遮罩图上传到存储桶中，详情请参见 上传图片。
获取原始图片地址，格式为：
https://${config.Bucket}.cos.${config.Region}.myqcloud.com/source.jpg
获取遮罩图地址，格式为：
https://${config.Bucket}.cos.${config.Region}.myqcloud.com/mask.jpg
获取修复后的图片，有三种方法：
下载时处理，适用于直接下载并展示修复后图片的场景。使用方法可参见 图像修复 API，在图片地址后拼接 ci-process=ImageRepair 、访问签名q-sign-algorithm= 和 MaskPic=遮罩图地址 URL 安全的 Base64 编码，即：
https://${config.Bucket}.cos.${config.Region}.myqcloud.com/source.jpg?q-sign-algorithm=<signature>&ci-process=ImageRepair&MaskPic=aHR0cDovL2V4xxxxxxxxxxxxxxxxxxxxxxxxxxxxx
上传时处理，适用于将修复图持久化存储的场景。使用方法可参见 上传时处理，在上传原图的时候在请求头中加入处理参数，即：
PUT /source.jpg HTTP/1.1
Host: ${config.Bucket}.cos.${config.Region}.myqcloud.com
Date: Wed, 28 Oct 2022 20:32:00 GMT
Authorization: q-sign-algorithm=sha1&q-ak=AKID....&q-signature=d010f....8dbc
Pic-Operations: {"is_pic_info":1,"rules":[{"fileid":"result.jpg","rule":"ci-process=ImageRepair&MaskPic=aHR0cDovL2V4xxxxxxxxxxxxxxxxxxxxxxxxxxxxx"}]}
Content-Length: 1024
[Image Object]
云上数据处理，适用于原图已存储在存储桶中，并且需要将修复后的图片存入到存储桶中的场景。使用方法可参见 云上数据处理：
POST /source.jpg?image_process HTTP/1.1Host: ${config.Bucket}.cos.${config.Region}.myqcloud.comDate: Wed, 28 Oct 2022 20:32:00 GMTAuthorization: q-sign-algorithm=sha1&q-ak=AKID....&q-signature=d010f....8dbcPic-Operations: {"is_pic_info":1,"rules":[{"fileid":"result.jpg","rule":"ci-process=ImageRepair&MaskPic=aHR0cDovL2V4xxxxxxxxxxxxxxxxxxxxxxxxxxxxx"}]}Content-Length: 0
图片修复后效果如下：
说明
图片修复计费规则参见 图像修复费用。
图片存储在存储桶中，涉及到 对象存储相关费用。
具体代码可参见 cos-demo 图片瑕疵涂抹修复。
您可使用腾讯云对象存储控制台，在 智能工具箱 栏目中使用示例图片或自行上传图片，体验图片修复的实际效果。
