更新记录

1.0.0（2026-04-07） 下载此版本

1.0.0 初始版本发布

• 核心功能：支持图片2倍高清/4倍超清放大，本地Canvas处理，无需上传云端
• 安全能力：集成微信云开发内容安全检测，违规图片拦截，合规性保障
• 交互体验：深色UI设计，多状态反馈（检测中/通过/不通过），操作流程清晰
• 实用功能：图片尺寸实时显示、结果预览、相册保存、广告位集成
• 兼容性：支持uni-app/uni-app x，适配微信小程序，多端兼容

平台兼容性

uni-app(3.7.3)

其他

图片高清化插件使用说明

📌 插件介绍

xyy-imghd 是一款专为 uni-app 微信小程序 打造的本地AI图片高清化增强工具，支持2倍高清/4倍超清放大，集成微信云开发内容安全检测，全程本地Canvas处理。

✨ 核心功能

• 🖼️ 多档放大：支持2倍高清、4倍超清两种增强模式，满足不同场景需求
• 🔒 隐私安全：全程本地Canvas处理，图片不上传第三方服务器
• 🛡️ 合规检测：集成微信云开发内容安全检测，自动拦截违规图片
• 🎨 精美UI：深色主题设计，流畅动画，操作简单直观
• 📱 实用交互：图片尺寸实时显示、结果预览、一键保存到相册
• 📢 广告集成：内置自定义广告位，方便开发者变现

📦 环境要求

• uni-app 版本：3.0.0+
• Vue 版本：Vue2 / Vue3 均兼容
• 运行平台：微信小程序（核心功能依赖微信云开发）
• 微信小程序基础库：2.10.0+
• 云开发环境：需开通微信小程序云开发（用于内容安全检测）

🚀 快速上手

1. 安装与引入

1. 下载插件源码，将组件文件放入项目的 components 目录下
2. 在需要使用的页面的 pages.json 中配置组件：

   {
   "usingComponents": {
   "xyy-imghd": "/components/xyy-imghd/xyy-imghd"
   }
   }

3. 在页面的 vue 文件中使用组件：

   <template>
   <view>
   <xyy-imghd></xyy-imghd>
   </view>
   </template>

2. 云开发配置（必做，用于安全检测）

2.1 开通云开发

1. 登录微信小程序后台，开通「云开发」服务，创建云环境
2. 在项目 app.js 中初始化云开发：

   App({
   onLaunch() {
   if (wx.cloud) {
     wx.cloud.init({
       env: '你的云环境ID', // 替换为自己的云环境ID
       traceUser: true
     })
   }
   }
   })

2.2 创建安全检测云函数

1. 在云开发控制台中，新建云函数 checkImageSecurity
2. 编写云函数代码（用于调用微信内容安全API）：

   
   // cloudfunctions/checkImageSecurity/index.js
   const cloud = require('wx-server-sdk')
   cloud.init({
   env: cloud.DYNAMIC_CURRENT_ENV
   })

// 内容安全检测API const security = cloud.openapi.security

exports.main = async (event, context) => { const { fileID } = event

try { // 调用微信内容安全-图片检测API const res = await security.imgSecCheck({ media: { contentType: 'image/jpeg', fileID: fileID } })

if (res.errCode === 0) {
  return {
    code: 200,
    message: '检测通过',
    result: res.result
  }
} else {
  return {
    code: 400,
    message: '检测不通过',
    result: res.result
  }
}

} catch (error) { return { code: 500, message: '检测失败', error: error } } }

3.  上传并部署云函数，确保云函数权限正常

### 3. 权限配置
在 `app.json` 中添加以下权限：
```json
{
  "permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于小程序位置接口的效果展示"
    },
    "scope.writePhotosAlbum": {
      "desc": "用于保存高清图片到相册"
    }
  },
  "requiredPrivateInfos": [
    "chooseImage",
    "saveImageToPhotosAlbum"
  ]
}

🎯 使用流程

1. 选择图片：点击上传区域，从相册选择需要增强的图片
2. 安全检测：自动进行图片内容安全检测，检测中/通过/不通过均有明确提示
3. 选择模式：检测通过后，选择「2倍高清」或「4倍超清」模式
4. 开始处理：点击「开始处理」，本地Canvas实时生成高清图片
5. 保存结果：处理完成后，可预览高清图，一键保存到手机相册

⚙️ 自定义配置

1. 样式自定义

组件内置深色主题，可通过修改 style 部分的样式变量，自定义主题色、圆角、间距等，适配项目整体风格。

2. 增强参数调整

在 applyEnhancement 方法中，可调整以下参数，自定义增强效果：

// 对比度（默认1.1，范围0.5-2.0）
const contrast = 1.1;
// 亮度（默认0，范围-100到100）
const brightness = 0;

📝 注意事项

1. 平台兼容性：核心功能仅支持微信小程序，其他小程序/APP/H5端需自行适配云开发逻辑
2. 性能说明：4倍放大模式下，大尺寸图片处理时间会稍长，建议控制原图尺寸在2000×2000以内
3. 隐私合规：组件已集成内容安全检测，符合微信小程序合规要求，需确保云函数正常部署
4. 云存储清理：组件会自动清理安全检测产生的临时图片，无需手动操作
5. 权限申请：首次保存图片时，会申请相册权限，需引导用户授权

🐛 常见问题

Q1: 云开发环境未配置，安全检测不可用？

A: 请先开通微信小程序云开发，在 app.js 中正确初始化云环境，并部署 checkImageSecurity 云函数。

Q2: 图片处理失败？

A: 请检查：① 图片是否过大（建议不超过5MB）；② Canvas节点是否正常渲染；③ 微信小程序基础库版本是否达标。

Q3: 安全检测失败？

A: 请检查：① 云函数是否正常部署；② 云环境权限是否开通；③ 图片是否包含违规内容。

Q4: 保存图片失败？

A: 请检查：① 是否授权相册权限；② 图片是否正常生成；③ 小程序基础库版本是否支持 saveImageToPhotosAlbum。

📄 更新日志

1.0.0 初始版本发布

• 核心功能：支持图片2倍高清/4倍超清放大，本地Canvas处理
• 安全能力：集成微信云开发内容安全检测，违规图片拦截
• 交互体验：深色UI设计，多状态反馈，操作流程清晰
• 实用功能：图片尺寸显示、结果预览、相册保存、广告位集成

📞 联系方式

如有问题或功能建议，可通过评论区留言联系作者。

📄 开源协议

本插件遵循 MIT 开源协议，可免费用于个人及商业项目，使用时请保留作者信息。