1

app.py

@@ -34,6 +34,8 @@ except ImportError as e:
         pass
     class AutoProcessor:
         pass
+    class GenerationConfig:
+        pass
     def process_vision_info(*args, **kwargs):
         raise ImportError("qwen_vl_utils not available")
 
@@ -538,7 +540,10 @@ async def analyze_simple(request: AnalyzeRequest):
     接收 JSON 格式的请求，包含 base64 图片和提示词
     返回标准化的分析结果
     """
+    logger.info(f"收到图片分析请求: prompt='{request.prompt}', image_length={len(request.image) if request.image else 0}")
+
     if not QWEN_VL_AVAILABLE:
+        logger.error(f"Qwen-VL 依赖不可用: {IMPORT_ERROR}")
         return AnalyzeResponse(
             success=False,
             prompt=request.prompt,
@@ -548,6 +553,7 @@ async def analyze_simple(request: AnalyzeRequest):
         )
 
     if model is None or processor is None:
+        logger.error("模型未加载")
         return AnalyzeResponse(
             success=False,
             prompt=request.prompt,
@@ -557,22 +563,31 @@ async def analyze_simple(request: AnalyzeRequest):
         )
 
     start_time = time.time()
+    logger.info("开始处理图片分析请求...")
 
     try:
         # 处理 base64 图片
+        logger.info("开始处理 base64 图片数据...")
         image_data = request.image
         if image_data.startswith('data:image'):
             # 移除 data:image/xxx;base64, 前缀
             image_data = image_data.split(',')[1]
+            logger.info("移除了 data URL 前缀")
 
+        logger.info(f"解码 base64 数据，长度: {len(image_data)}")
         image_bytes = base64.b64decode(image_data)
+        logger.info(f"解码后字节数: {len(image_bytes)}")
+
         pil_image = Image.open(io.BytesIO(image_bytes))
+        logger.info(f"图片加载成功: {pil_image.size}, 模式: {pil_image.mode}")
 
         # 确保图片是 RGB 格式
         if pil_image.mode != 'RGB':
             pil_image = pil_image.convert('RGB')
+            logger.info("图片已转换为 RGB 模式")
 
         # 准备消息格式
+        logger.info("准备模型输入消息...")
         messages = [
             {
                 "role": "user",
@@ -587,10 +602,13 @@ async def analyze_simple(request: AnalyzeRequest):
         ]
 
         # 处理输入
+        logger.info("应用聊天模板...")
         text = processor.apply_chat_template(
             messages, tokenize=False, add_generation_prompt=True
         )
+        logger.info("处理视觉信息...")
         image_inputs, video_inputs = process_vision_info(messages)
+        logger.info("处理器编码输入...")
         inputs = processor(
             text=[text],
             images=image_inputs,
@@ -598,8 +616,10 @@ async def analyze_simple(request: AnalyzeRequest):
             padding=True,
             return_tensors="pt",
         )
+        logger.info(f"输入处理完成，input_ids shape: {inputs.input_ids.shape if hasattr(inputs, 'input_ids') else 'N/A'}")
 
         # 生成回答
+        logger.info("开始模型生成...")
         with torch.no_grad():
             # 使用 GenerationConfig 来避免警告并确保参数正确
             generation_config = GenerationConfig(
@@ -609,17 +629,24 @@ async def analyze_simple(request: AnalyzeRequest):
                 eos_token_id=processor.tokenizer.eos_token_id,
                 use_cache=True
             )
+            logger.info(f"生成配置: max_new_tokens=512, do_sample=False")
             generated_ids = model.generate(**inputs, generation_config=generation_config)
+            logger.info(f"生成完成，输出 shape: {generated_ids.shape}")
 
+        logger.info("开始解码生成的文本...")
         generated_ids_trimmed = [
             out_ids[len(in_ids):] for in_ids, out_ids in zip(inputs.input_ids, generated_ids)
         ]
+        logger.info(f"修剪后的 token 数量: {[len(ids) for ids in generated_ids_trimmed]}")
 
         output_text = processor.batch_decode(
             generated_ids_trimmed, skip_special_tokens=True, clean_up_tokenization_spaces=False
         )[0]
 
         processing_time = time.time() - start_time
+        logger.info(f"分析完成，处理时间: {processing_time:.2f}秒")
+        logger.info(f"生成的文本长度: {len(output_text)} 字符")
+        logger.info(f"生成的文本预览: {output_text[:100]}...")
 
         return AnalyzeResponse(
             success=True,
@@ -703,3 +730,8 @@ def clear_cache():
 def web_interface():
     """返回 Web 界面"""
     return FileResponse("static/index.html")
+
+@app.get("/test-upload")
+def test_upload_interface():
+    """返回图片上传测试界面"""
+    return FileResponse("test_upload.html")

static/index.html

@@ -623,22 +623,48 @@
             result.style.display = 'none';
 
             try {
+                console.log('开始图片分析...');
+                console.log('文件信息:', {
+                    name: file.name,
+                    size: file.size,
+                    type: file.type
+                });
+
                 // 将图片转换为 base64
+                console.log('正在转换图片为 base64...');
                 const base64Image = await fileToBase64(file);
+                console.log('Base64 转换完成，长度:', base64Image.length);
 
                 // 优先使用 JSON API
+                console.log('发送分析请求到 /analyze...');
+                const requestData = {
+                    image: base64Image,
+                    prompt: question
+                };
+                console.log('请求数据:', {
+                    prompt: question,
+                    imageLength: base64Image.length,
+                    imagePrefix: base64Image.substring(0, 50) + '...'
+                });
+
                 const response = await fetch('/analyze', {
                     method: 'POST',
                     headers: {
                         'Content-Type': 'application/json'
                     },
-                    body: JSON.stringify({
-                        image: base64Image,
-                        prompt: question
-                    })
+                    body: JSON.stringify(requestData)
                 });
 
+                console.log('收到响应:', response.status, response.statusText);
+
+                if (!response.ok) {
+                    const errorText = await response.text();
+                    console.error('响应错误:', errorText);
+                    throw new Error(`HTTP ${response.status}: ${response.statusText}\n${errorText}`);
+                }
+
                 const data = await response.json();
+                console.log('解析响应数据:', data);
 
                 if (data.success) {
                     result.innerHTML = `

test_upload.html

@@ -0,0 +1,250 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>图片上传测试</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            max-width: 800px;
+            margin: 0 auto;
+            padding: 20px;
+        }
+        .test-area {
+            border: 2px solid #ddd;
+            padding: 20px;
+            margin: 20px 0;
+            border-radius: 8px;
+        }
+        button {
+            background: #007bff;
+            color: white;
+            border: none;
+            padding: 10px 20px;
+            border-radius: 5px;
+            cursor: pointer;
+            margin: 5px;
+        }
+        button:hover {
+            background: #0056b3;
+        }
+        .result {
+            background: #f8f9fa;
+            padding: 15px;
+            margin: 10px 0;
+            border-radius: 5px;
+            border-left: 4px solid #007bff;
+        }
+        .error {
+            border-left-color: #dc3545;
+            background: #f8d7da;
+        }
+        .success {
+            border-left-color: #28a745;
+            background: #d4edda;
+        }
+        input[type="file"] {
+            margin: 10px 0;
+        }
+        textarea {
+            width: 100%;
+            height: 80px;
+            margin: 10px 0;
+            padding: 10px;
+        }
+        .log {
+            background: #f1f1f1;
+            padding: 10px;
+            margin: 10px 0;
+            border-radius: 5px;
+            font-family: monospace;
+            font-size: 12px;
+            max-height: 200px;
+            overflow-y: auto;
+        }
+    </style>
+</head>
+<body>
+    <h1>🧪 图片上传分析测试</h1>
+    
+    <div class="test-area">
+        <h3>1. 创建测试图片</h3>
+        <button onclick="createTestImage()">创建测试图片</button>
+        <canvas id="testCanvas" width="200" height="150" style="border: 1px solid #ddd; margin: 10px;"></canvas>
+    </div>
+    
+    <div class="test-area">
+        <h3>2. 上传图片测试</h3>
+        <input type="file" id="imageFile" accept="image/*">
+        <textarea id="prompt" placeholder="输入问题">请详细描述这张图片的内容</textarea>
+        <br>
+        <button onclick="testUpload()">测试上传分析</button>
+        <button onclick="clearLog()">清空日志</button>
+    </div>
+    
+    <div class="test-area">
+        <h3>3. 测试结果</h3>
+        <div id="result"></div>
+    </div>
+    
+    <div class="test-area">
+        <h3>4. 调试日志</h3>
+        <div id="log" class="log"></div>
+    </div>
+
+    <script>
+        let logMessages = [];
+        
+        function log(message) {
+            const timestamp = new Date().toLocaleTimeString();
+            const logMessage = `[${timestamp}] ${message}`;
+            logMessages.push(logMessage);
+            console.log(logMessage);
+            updateLogDisplay();
+        }
+        
+        function updateLogDisplay() {
+            const logDiv = document.getElementById('log');
+            logDiv.innerHTML = logMessages.join('<br>');
+            logDiv.scrollTop = logDiv.scrollHeight;
+        }
+        
+        function clearLog() {
+            logMessages = [];
+            updateLogDisplay();
+        }
+        
+        function createTestImage() {
+            log('创建测试图片...');
+            const canvas = document.getElementById('testCanvas');
+            const ctx = canvas.getContext('2d');
+            
+            // 清空画布
+            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            
+            // 绘制背景
+            ctx.fillStyle = '#lightblue';
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+            
+            // 绘制红色矩形
+            ctx.fillStyle = '#red';
+            ctx.fillRect(50, 50, 100, 50);
+            
+            // 绘制黄色圆形
+            ctx.fillStyle = '#yellow';
+            ctx.beginPath();
+            ctx.arc(100, 75, 20, 0, 2 * Math.PI);
+            ctx.fill();
+            
+            // 绘制文字
+            ctx.fillStyle = '#black';
+            ctx.font = '16px Arial';
+            ctx.fillText('Test Image', 60, 120);
+            
+            // 转换为 blob 并设置到文件输入
+            canvas.toBlob(blob => {
+                const file = new File([blob], 'test-image.png', { type: 'image/png' });
+                const dataTransfer = new DataTransfer();
+                dataTransfer.items.add(file);
+                document.getElementById('imageFile').files = dataTransfer.files;
+                log('测试图片创建完成并已选中');
+            });
+        }
+        
+        function fileToBase64(file) {
+            return new Promise((resolve, reject) => {
+                const reader = new FileReader();
+                reader.readAsDataURL(file);
+                reader.onload = () => resolve(reader.result);
+                reader.onerror = error => reject(error);
+            });
+        }
+        
+        async function testUpload() {
+            const fileInput = document.getElementById('imageFile');
+            const prompt = document.getElementById('prompt').value;
+            const resultDiv = document.getElementById('result');
+            
+            if (!fileInput.files[0]) {
+                log('❌ 请先选择或创建测试图片');
+                return;
+            }
+            
+            const file = fileInput.files[0];
+            log(`开始测试上传: ${file.name} (${file.size} bytes, ${file.type})`);
+            
+            resultDiv.innerHTML = '<div class="result">🔄 正在分析...</div>';
+            
+            try {
+                // 转换为 base64
+                log('转换图片为 base64...');
+                const base64 = await fileToBase64(file);
+                log(`Base64 转换完成，长度: ${base64.length}`);
+                
+                // 发送请求
+                log('发送分析请求...');
+                const requestData = {
+                    image: base64,
+                    prompt: prompt
+                };
+                
+                const response = await fetch('/analyze', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json'
+                    },
+                    body: JSON.stringify(requestData)
+                });
+                
+                log(`收到响应: ${response.status} ${response.statusText}`);
+                
+                if (!response.ok) {
+                    const errorText = await response.text();
+                    log(`❌ 响应错误: ${errorText}`);
+                    throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+                }
+                
+                const data = await response.json();
+                log(`响应数据: ${JSON.stringify(data, null, 2)}`);
+                
+                if (data.success) {
+                    resultDiv.innerHTML = `
+                        <div class="result success">
+                            <h4>✅ 分析成功</h4>
+                            <p><strong>问题:</strong> ${data.prompt}</p>
+                            <p><strong>回答:</strong> ${data.response}</p>
+                            <p><strong>处理时间:</strong> ${data.processing_time.toFixed(2)}秒</p>
+                            <p><strong>图片信息:</strong> ${data.image_info.size} (${data.image_info.mode})</p>
+                        </div>
+                    `;
+                    log('✅ 分析成功完成');
+                } else {
+                    resultDiv.innerHTML = `
+                        <div class="result error">
+                            <h4>❌ 分析失败</h4>
+                            <p><strong>错误:</strong> ${data.error}</p>
+                        </div>
+                    `;
+                    log(`❌ 分析失败: ${data.error}`);
+                }
+                
+            } catch (error) {
+                log(`❌ 请求异常: ${error.message}`);
+                resultDiv.innerHTML = `
+                    <div class="result error">
+                        <h4>❌ 请求失败</h4>
+                        <p><strong>错误:</strong> ${error.message}</p>
+                    </div>
+                `;
+            }
+        }
+        
+        // 页面加载时的初始化
+        window.addEventListener('load', () => {
+            log('页面加载完成');
+            log('可以创建测试图片或上传自己的图片进行测试');
+        });
+    </script>
+</body>
+</html>