《AI大模型趣味实战》 No3：快速搭建一个漂亮的AI家庭网站-相册/时间线/日历/多用户/个性化配色/博客/聊天室/AI管家(下)

《AI大模型趣味实战》 No3：快速搭建一个漂亮的AI家庭网站-相册/时间线/日历/多用户/个性化配色/博客/聊天室/AI管家(下)

摘要

本文介绍了家庭网站V1.3版本的更新内容，主要聚焦于AI管家功能的优化与完善。V1.3版本对AI管家模块进行了全面升级，包括使用更快速的GLM-4-Flash模型、优化语音交互体验、改进用户界面以及增强系统稳定性。本文详细解析了这些改进的技术实现，包括语音识别与合成、WebSocket通信优化以及服务器启动机制的完善。

新增功能点和代码实现解析

1. 升级到GLM-4-Flash模型

V1.3版本将AI管家的底层模型从GLM-4升级到了GLM-4-Flash，这是一个更快速的大语言模型，能够提供更快的响应速度。

# 在utils.py中更新模型配置
def __init__(self, api_key=None, model=None):
    """初始化智谱AI助手"""
    self.api_key = api_key or current_app.config.get('ZHIPUAI_API_KEY')
    # 使用配置的模型
    self.model = model or current_app.config.get('ZHIPUAI_MODEL', 'glm-4-flash')

# 在config.py中设置默认模型
ZHIPUAI_MODEL = os.environ.get('ZHIPUAI_MODEL', 'glm-4-flash')

2. 优化语音识别与合成功能

V1.3版本简化了语音交互流程，移除了复杂的实时音视频API，转而使用更可靠的语音识别和浏览器原生语音合成功能。

def speech_to_text(self, audio_data):
    """将音频转换为文本"""
    try:
        current_app.logger.info("开始进行语音识别...")
        
        # 使用智谱AI的语音识别API
        url = "https://open.bigmodel.cn/api/paas/v3/audio/transcriptions"
        headers = self.get_auth_headers()
        
        # 准备文件数据
        files = {
            'file': ('audio.wav', audio_data, 'audio/wav')
        }
        
        # 准备表单数据
        data = {
            'model': 'whisper-1',  # 使用Whisper模型进行语音识别
            'language': 'zh'       # 指定语言为中文
        }
        
        # 发送请求并处理响应
        response = requests.post(url, headers=headers, files=files, data=data, timeout=30)
        # ...处理响应逻辑
    except Exception as e:
        # ...错误处理

前端语音合成实现：

function speakText(text) {
    if ('speechSynthesis' in window) {
        // 停止任何正在进行的语音
        window.speechSynthesis.cancel();
        
        const utterance = new SpeechSynthesisUtterance(text);
        utterance.lang = 'zh-CN';
        
        // 获取可用的语音
        const voices = window.speechSynthesis.getVoices();
        
        // 尝试找到中文女声
        const chineseVoice = voices.find(voice => 
            voice.lang.includes('zh') && voice.name.includes('Female')
        );
        
        if (chineseVoice) {
            utterance.voice = chineseVoice;
        }
        
        // 设置语速和音调
        utterance.rate = 1.0;  // 正常语速
        utterance.pitch = 1.0; // 正常音调
        
        // 播放语音
        window.speechSynthesis.speak(utterance);
    }
}

3. 改进WebSocket通信

V1.3版本优化了WebSocket通信机制，解决了连接不稳定和握手失败的问题：

# 在app/__init__.py中优化SocketIO配置
socketio = SocketIO(
    async_mode='eventlet', 
    cors_allowed_origins='*', 
    logger=True, 
    engineio_logger=True, 
    manage_session=False
)

# 初始化时设置更多参数
socketio.init_app(
    app, 
    cors_allowed_origins="*", 
    ping_timeout=60, 
    ping_interval=25, 
    transports=['websocket', 'polling'], 
    manage_session=False
)

前端WebSocket连接配置：

let socket = io({
    transports: ['websocket', 'polling'],
    reconnectionAttempts: 5,
    reconnectionDelay: 1000
});

4. 智能端口管理

V1.3版本增加了智能端口管理功能，可以自动检测端口占用并切换到可用端口：

def is_port_in_use(port):
    """检查端口是否被占用"""
    with socket.socket(socket.AF_INET, socket.SOCK_STREAM) as s:
        return s.connect_ex(('localhost', port)) == 0

# 检查端口是否被占用
if is_port_in_use(port):
    print(f"警告: 端口 {port} 已被占用，尝试使用其他端口...")
    # 尝试其他端口
    for test_port in range(5001, 5010):
        if not is_port_in_use(test_port):
            port = test_port
            print(f"使用端口 {port}")
            break
    else:
        print("错误: 无法找到可用端口，请手动关闭占用端口的进程")
        sys.exit(1)

5. 端口释放工具

V1.3版本提供了一个实用工具脚本，用于释放被占用的端口：

def kill_process_on_port(port):
    """关闭占用指定端口的进程"""
    try:
        # 查找占用端口的进程
        result = subprocess.check_output(f'netstat -ano | findstr :{port}', shell=True).decode()
        if not result:
            print(f"端口 {port} 没有被占用")
            return False
        
        # 解析进程ID并关闭进程
        lines = result.strip().split('\n')
        for line in lines:
            parts = [p for p in line.split(' ') if p]
            if len(parts) >= 5:
                pid = parts[-1]
                # ...获取进程信息并关闭进程
    except Exception as e:
        print(f"发生错误: {e}")
        return False

完善和修订部分

1. 修复typing indicator问题

V1.3版本修复了AI回复时多余的等待指示符问题：

// 添加一个函数来移除typing indicator
function removeTypingIndicator() {
    const typingIndicator = document.getElementById('typingIndicator');
    if (typingIndicator) {
        typingIndicator.remove();
    }
}

function appendTypingIndicator() {
    // 先移除已存在的typing indicator，避免重复
    const existingIndicator = document.getElementById('typingIndicator');
    if (existingIndicator) {
        existingIndicator.remove();
    }
    
    // ...创建新的typing indicator
}

后端也相应增加了关闭typing indicator的信号发送：

# 关闭AI正在输入的指示器
emit('typing_indicator', {'show': False})

2. 简化代码结构

V1.3版本移除了所有与视频处理相关的复杂代码，简化了整体架构：

• 删除了WebSocket相关的实时音视频处理代码
• 移除了视频模式切换功能
• 简化了ZhipuAIHelper类，只保留必要的HTTP API调用

3. 解决eventlet的monkey_patch问题

V1.3版本修复了eventlet的monkey_patch问题，确保在导入其他模块前进行monkey patching：

import eventlet
eventlet.monkey_patch()

# 之后再导入其他模块
import socket
import sys
import os
from app import create_app, socketio

4. 增强错误处理

V1.3版本增强了错误处理机制，提供更友好的错误提示：

try:
    # ...启动服务器
except OSError as e:
    if e.errno == 10048:  # 端口已被占用
        print(f"错误: 端口 {port} 已被占用，请关闭占用该端口的应用后重试")
        print(f"提示: 可以使用 'netstat -ano | findstr :{port}' 查找占用端口的进程")
    else:
        print(f"启动服务器时出错: {e}")
    sys.exit(1)
except KeyboardInterrupt:
    print("服务器已停止")
    sys.exit(0)

总结

家庭网站V1.3版本对AI管家功能进行了全面优化，主要体现在以下几个方面：

1. 性能提升：通过升级到GLM-4-Flash模型，大幅提高了AI响应速度。

2. 用户体验改进：优化了语音交互流程，使用更可靠的语音识别和合成方案，提供更流畅的对话体验。

3. 稳定性增强：改进了WebSocket通信机制，解决了连接不稳定和握手失败的问题；增加了智能端口管理和端口释放工具，提高了系统启动的可靠性。

4. 代码质量提升：简化了代码结构，移除了复杂的视频处理代码，增强了错误处理机制，使系统更加健壮。

V1.3版本的这些改进使AI管家功能更加稳定、高效，为用户提供了更好的交互体验。未来的版本将继续优化AI功能，可能会增加更多智能化特性，如情感分析、个性化推荐等，进一步提升家庭网站的智能化水平。