# chat

**Repository Path**: yinpeide/chat

## Basic Information

- **Project Name**: chat
- **Description**: 我的福袋答微信小程序
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-11-06
- **Last Updated**: 2025-11-06

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 微信小程序 AI 对话（直接调用大模型API）

> 本项目为微信小程序前端，直接调用大模型API，无需后端服务器，开箱即用。

## 项目特点

- ✅ 直接调用大模型API，无需后端服务器
- ✅ 微信原生聊天界面风格
- ✅ 支持阿里云百炼、OpenAI等兼容接口
- ✅ 手机端输入法适配优化
- ✅ 一键发布到微信小程序

## 目录结构

```
chat/
  miniprogram/          # 微信小程序源码
    app.json
    app.js
    app.wxss
    project.config.json
    config/
      api-config.js     # API配置文件
    utils/
      api.js           # API调用工具
    pages/
      chat/
        index.{js,wxml,wxss,json}
```

## 一、本地开发调试

### 1. 配置API密钥

编辑 `miniprogram/config/api-config.js` 文件：

```javascript
const config = {
  apiKey: "你的API密钥",
  baseUrl: "https://dashscope.aliyuncs.com/compatible-mode", // 阿里云百炼
  defaultModel: "qwen2.5-7b-instruct"
};
```

**支持的API服务商：**
- 阿里云百炼：`https://dashscope.aliyuncs.com/compatible-mode`
- OpenAI：`https://api.openai.com`
- 其他兼容OpenAI接口的服务

### 2. 运行调试

1. 打开「微信开发者工具」
2. 导入 `miniprogram` 目录
3. 在模拟器中测试聊天功能
4. 真机调试：勾选「不校验合法域名」

## 二、发布到服务器

### 1. 准备域名和HTTPS证书

**必需条件：**
- 已备案的域名（微信小程序要求）
- 有效的HTTPS证书（443端口）
- 域名解析到你的服务器

**推荐方案：**
- 使用阿里云、腾讯云等云服务商
- 申请免费SSL证书（Let's Encrypt）
- 配置Nginx反向代理

### 2. 配置request合法域名

1. 登录[微信公众平台](https://mp.weixin.qq.com)
2. 进入「开发」→「开发管理」→「开发设置」
3. 在「服务器域名」→「request合法域名」中添加：
   ```
   https://dashscope.aliyuncs.com
   https://api.openai.com
   ```
   （根据你使用的API服务商添加对应域名）

### 3. 修改小程序配置

**方案一：使用环境变量（推荐）**

创建 `miniprogram/config/api-config.js`：

```javascript
// 根据环境自动切换配置
const isDev = false; // 发布时设为false

const devConfig = {
  apiKey: "你的测试密钥",
  baseUrl: "https://dashscope.aliyuncs.com/compatible-mode",
  defaultModel: "qwen2.5-7b-instruct"
};

const prodConfig = {
  apiKey: "你的生产密钥",
  baseUrl: "https://dashscope.aliyuncs.com/compatible-mode", 
  defaultModel: "qwen2.5-7b-instruct"
};

module.exports = isDev ? devConfig : prodConfig;
```

**方案二：动态配置**

修改 `miniprogram/utils/api.js`，支持从服务器获取配置：

```javascript
const config = require('../config/api-config');

// 动态获取配置（可选）
async function getConfig() {
  try {
    const res = await wx.request({
      url: 'https://你的域名.com/api/config',
      method: 'GET'
    });
    return res.data;
  } catch (err) {
    return config; // 降级到本地配置
  }
}
```

### 4. 上传代码

1. 在微信开发者工具中点击「上传」
2. 填写版本号和项目备注
3. 上传成功后到微信公众平台提交审核

### 5. 提交审核

1. 登录微信公众平台
2. 进入「版本管理」→「开发版本」
3. 点击「提交审核」
4. 填写功能页面和测试账号信息
5. 等待审核结果（通常1-3个工作日）

### 6. 发布上线

审核通过后：
1. 在「版本管理」中点击「发布」
2. 确认发布后，用户即可在微信中搜索使用

## 三、安全建议

### 1. API密钥保护

**❌ 不推荐：** 将真实API密钥直接写在代码中

**✅ 推荐方案：**

1. **使用测试密钥**：在代码中使用测试环境的API密钥
2. **服务端代理**：通过自己的服务器代理API调用
3. **动态配置**：从服务器动态获取API配置

### 2. 实现服务端代理（可选）

如果需要更好的安全性，可以部署一个简单的代理服务：

```javascript
// 代理服务器示例
app.post('/api/chat', async (req, res) => {
  const { messages } = req.body;
  const response = await fetch('https://dashscope.aliyuncs.com/compatible-mode/v1/chat/completions', {
    method: 'POST',
    headers: {
      'Authorization': `Bearer ${process.env.API_KEY}`,
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      model: 'qwen2.5-7b-instruct',
      messages
    })
  });
  const data = await response.json();
  res.json({ reply: data.choices[0].message.content });
});
```

## 四、常见问题

### Q: 真机调试提示"网络错误"
A: 检查request合法域名配置，确保API服务商域名已添加

### Q: 审核被拒
A: 常见原因：
- 缺少功能说明
- 需要提供测试账号
- 涉及敏感内容
- 功能过于简单

### Q: API调用失败
A: 检查：
- API密钥是否正确
- 账户余额是否充足
- 模型权限是否开通
- 网络连接是否正常

### Q: 输入法遮挡输入框
A: 已优化，如仍有问题请检查：
- `adjust-position="{{true}}"`
- `hold-keyboard="{{true}}"`
- 输入区域z-index设置

## 五、技术栈

- **前端**：微信小程序原生开发
- **API**：阿里云百炼/OpenAI兼容接口
- **部署**：微信小程序平台
- **证书**：HTTPS（必需）

## 六、更新日志

- v1.0.0：基础聊天功能
- v1.1.0：微信原生UI风格
- v1.2.0：输入法适配优化
- v1.3.0：直接API调用，无需后端