# YxzQrCode

**Repository Path**: itxz-repository/yxz-qr-code

## Basic Information

- **Project Name**: YxzQrCode
- **Description**: 一款功能完整的微信小程序二维码工具，支持扫码识别、生成二维码和条形码等功能
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: develop
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2025-06-21
- **Last Updated**: 2025-08-25

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 小籽二维码 - 微信小程序

<div align="center">
  <img src="assets/icons/qrcode_logo.png" alt="小籽二维码" width="120">
  <h3>扫码生成 · 简单便捷</h3>
  <p>一款功能完整的微信小程序二维码工具，支持扫码识别、生成二维码和条形码等功能</p>
</div>

## ✨ 主要功能

### 🔍 扫码识别
- **智能双模式**：支持微信原生扫码和自定义摄像头两种模式
- **相册识别**：优先使用微信原生识别，失败后可选择服务器识别
- **离线友好**：离线状态下自动禁用相册识别功能
- **多格式支持**：二维码、条形码等多种格式智能识别
- **结果处理**：统一的扫码结果展示界面，支持复制和分享

### 📱 二维码生成  
- **混合生成策略**：本地生成（标准二维码）+ 服务器生成（微型二维码）
- **智能策略选择**：根据配置和网络状态自动选择最佳生成方式
- **离线支持**：标准二维码支持完全离线生成
- **自定义样式**：支持颜色、尺寸等参数自定义
- **高清输出**：自适应屏幕分辨率，生成高质量图片

### 📊 条形码生成
- **本地优先**：默认使用本地JsBarcode库生成，速度快、无网络依赖
- **多格式支持**：Code128、Code39、EAN-13、EAN-8、ITF等标准格式
- **配置灵活**：可在配置文件中调整各类型码的生成策略
- **服务器备选**：支持配置服务器作为备选生成方案
- **自适应布局**：条形码自动适配容器尺寸

### 📝 扫码记录
- **自动保存**：所有扫码和生成操作自动记录
- **统一管理**：扫码记录、生成记录分类展示
- **快速操作**：支持复制、分享、删除等便捷操作
- **数据统计**：显示使用统计和记录数量

## 🛠️ 技术特点

- **智能混合架构**：本地生成 + 服务器生成，兼顾性能与功能完整性
- **离线优先设计**：核心功能支持完全离线使用，网络异常时自动降级
- **配置化策略**：通过配置文件灵活控制各功能的生成策略和行为
- **状态管理优化**：全局状态管理，页面间状态同步和错误恢复
- **组件化开发**：统一的UI组件（如扫码结果弹窗），提升代码复用性
- **错误处理机制**：完善的错误分类处理，用户友好的错误提示
- **性能优化**：调试输出清理、懒加载、Canvas绘制优化
- **iOS风格界面**：现代化设计风格，流畅的用户体验

## 📁 项目结构

```
QrCode/
├── app.js                    # 应用入口文件
├── app.json                  # 应用配置文件
├── app.wxss                  # 全局样式文件
├── assets/                   # 静态资源目录
│   ├── icons/               # 图标文件
│   └── js/                  # 第三方JS库
├── config/                   # 配置文件目录
│   ├── api-config.js        # API配置模板
│   ├── api-config.local.js  # 本地API配置（需创建）
│   └── config-manager.js    # 配置管理器
├── pages/                    # 页面目录
│   ├── index/               # 首页
│   ├── custom-scan/         # 自定义扫码页面
│   ├── generate-qr/         # 二维码生成页面
│   ├── generate-barcode/    # 条形码生成页面
│   ├── generate-result/     # 生成结果页面
│   └── history/             # 历史记录页面
├── components/               # 自定义组件
│   └── scan-result-modal/  # 扫码结果弹窗组件
└── utils/                    # 工具类目录
    ├── api-service.js       # API服务
    ├── history-manager.js   # 历史记录管理
    ├── jsbarcode-util.js    # 条形码生成工具
    ├── message-util.js      # 消息提示工具
    ├── qrcode.js           # 二维码工具
    └── util.js             # 通用工具函数
```

## 🚀 快速开始

### 环境要求
- 微信开发者工具
- Node.js (可选，用于开发工具)

### 安装步骤

1. **克隆项目**
   ```bash
   git clone [项目地址]
   cd QrCode
   ```

2. **配置项目**
   - 复制 `config/api-config.js` 为 `config/api-config.local.js`
   - 在 `config/api-config.local.js` 中配置服务器地址、企业代码等信息
   - 根据需要调整 `localGeneration` 配置以控制本地/服务器生成策略
   - 在 `project.config.json` 中填入您的小程序AppID
   
   > 💡 **配置说明**：项目会优先使用 `api-config.local.js`（不会上传到Git），如果不存在则使用默认的 `api-config.js`。新增的 `localGeneration` 配置可以灵活控制各类型码的生成方式。

3. **微信开发者工具导入**
   - 打开微信开发者工具
   - 选择"导入项目"
   - 选择项目目录
   - 确认AppID配置正确

4. **预览和调试**
   - 点击"编译"按钮
   - 使用"真机调试"测试摄像头功能
   - 可使用"预览"功能在手机上体验

> ⚠️ **重要提醒**：首次使用前请仔细阅读 [DEPLOYMENT.md](DEPLOYMENT.md) 文件了解如何正确配置敏感信息。

## 📋 功能详情

### 扫码功能
- 支持QR码、Data Matrix、PDF417等二维码格式
- 支持EAN、UPC、Code128等条形码格式
- 自动识别内容类型（URL、文本、WiFi配置等）
- 提供历史记录和快速操作

### 生成功能
- **混合生成策略**：本地生成（快速、离线）+ 服务器生成（功能完整）
- **智能策略选择**：根据码类型、网络状态、用户配置自动选择最佳方案
- **二维码生成**：标准二维码本地生成，微型二维码服务器生成
- **条形码生成**：支持Code128、Code39、EAN等格式的本地生成
- **配置化管理**：可通过配置文件灵活调整各类型码的生成策略
- **样式自定义**：颜色、尺寸、边距等参数调整

### 历史管理
- 自动保存所有操作记录
- 按日期、类型分类展示
- 支持搜索和筛选
- 数据导出和备份功能

## 🎨 界面预览

- **首页**：功能导航和快速操作
- **扫码页**：实时摄像头预览和识别
- **生成页**：参数配置和实时预览
- **历史页**：记录列表和详情查看

## 🔧 自定义配置

### API配置
修改 `config/api-config.local.js` 文件来配置后端服务和生成策略：

```javascript
const ApiConfig = {
  server: {
    environments: {
      development: 'http://127.0.0.1:8980',
      production: 'http://your-api-domain.com'
    },
    timeout: 30000
  },
  
  // 本地生成配置
  localGeneration: {
    enabled: true,
    strategies: {
      qr_standard: { useLocal: true, allowServerFallback: false },
      qr_micro: { useLocal: false, allowServerFallback: true },
      barcode_128: { useLocal: true, allowServerFallback: false }
      // 更多配置...
    }
  }
  // 其他配置...
}
```

### 生成策略配置
可以灵活配置各类型码的生成策略：

```javascript
// 配置示例
strategies: {
  // 标准二维码使用本地生成，快速且离线可用
  qr_standard: {
    useLocal: true,
    allowServerFallback: false
  },
  
  // 微型二维码使用服务器生成（本地不支持）
  qr_micro: {
    useLocal: false,
    allowServerFallback: true
  },
  
  // 条形码优先本地生成，服务器作为备选
  barcode_128: {
    useLocal: true,
    allowServerFallback: true
  }
}
```

## 📱 兼容性

- **微信版本**：要求微信7.0.0及以上版本
- **系统支持**：iOS 10.0+、Android 5.0+
- **功能权限**：需要摄像头、相册访问权限

## 🤝 贡献指南

欢迎提交Issue和Pull Request来帮助改进项目！

1. Fork 项目
2. 创建功能分支 (`git checkout -b feature/AmazingFeature`)
3. 提交更改 (`git commit -m 'Add some AmazingFeature'`)
4. 推送到分支 (`git push origin feature/AmazingFeature`)
5. 打开 Pull Request

## 📄 开源协议

本项目采用 MIT 协议开源 - 查看 [LICENSE](LICENSE) 文件了解详情。

## 👨‍💻 作者

- 如有疑问或建议，欢迎提交Issue

## 🙏 致谢

- 感谢微信小程序平台提供的开发框架
- 感谢开源社区提供的各种工具库和组件
- 感谢所有贡献者和用户的支持

---

<div align="center">
  <p>⭐ 如果这个项目对你有帮助，请给它一个星标！</p>
</div>