fix

app.py

@@ -10,7 +10,7 @@ import gradio as gr
 # =========================
 # Config
 # =========================
-DEFAULT_API_URL =os.environ.get("API_URL")
+DEFAULT_API_URL = os.environ.get("API_URL")
 TOKEN = os.environ.get("TOKEN")
 LOGO_IMAGE_PATH = './assets/logo.jpg'
 GOOGLE_FONTS_URL = "<link href='https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;700&display=swap' rel='stylesheet'>"
@@ -23,7 +23,7 @@ LATEX_DELIMS = [
 AUTH_HEADER = {"Authorization": f"bearer {TOKEN}"}
 JSON_HEADERS = {**AUTH_HEADER, "Content-Type": "application/json"}
 # =========================
-# Base64 and Example Loading Logic (From New Script)
+# Base64 and Example Loading Logic
 # =========================
 def image_to_base64_data_url(filepath: str) -> str:
     """Reads a local image file and encodes it into a Base64 Data URL."""
@@ -53,7 +53,7 @@ targeted_recognition_examples = _get_examples_from_dir(TARGETED_EXAMPLES_DIR)
 complex_document_examples = _get_examples_from_dir(COMPLEX_EXAMPLES_DIR)
 
 # =========================
-# UI Helpers (From New Script)
+# UI Helpers
 # =========================
 def render_uploaded_image_div(file_path: str) -> str:
     data_url = image_to_base64_data_url(file_path)
@@ -78,7 +78,7 @@ def _on_gallery_select(example_paths: List[str], evt: gr.SelectData):
         return None
 
 # =========================
-# API Call Logic (From New Script - More feature complete)
+# API Call Logic
 # =========================
 def _file_to_b64_image_only(file_path: str) -> Tuple[str, int]:
     if not file_path: raise ValueError("Please upload an image first.")
@@ -104,12 +104,13 @@ def _call_api(api_url: str, file_path: str, use_layout_detection: bool,
         payload["useChartRecognition"] = True
 
     try:
-        # 关键改动：带上 headers
+        print(f"Sending API request to {api_url}...")
         start_time = time.time()
         resp = requests.post(api_url, json=payload, headers=JSON_HEADERS, timeout=600)
         end_time = time.time()
-        duration = end_time - start_time # 新增: 计算耗时
-        print(f"Received API response in {duration:.2f} seconds.") # 新增: 打印耗时
+        duration = end_time - start_time
+        print(f"Received API response in {duration:.2f} seconds.")
+        
         resp.raise_for_status()
         data = resp.json()
     except requests.exceptions.RequestException as e:
@@ -123,104 +124,85 @@ def _call_api(api_url: str, file_path: str, use_layout_detection: bool,
 
 
 # =========================
-# Core Logic for Handling Image URLs (From Old "Xinghe" Script)
+# API Response Processing
 # =========================
-def url_to_base64_data_url(url: str) -> str:
-    """Downloads an image from a URL and formats it as a Base64 Data URL for Markdown."""
-    try:
-        response = requests.get(url, timeout=600)
-        response.raise_for_status()
-        mime_type = response.headers.get('Content-Type', 'image/jpeg')
-        if not mime_type.startswith('image/'):
-             print(f"Warning: URL did not return an image content type. Got: {mime_type}")
-             mime_type = 'image/jpeg'
-        image_bytes = response.content
-        encoded_string = base64.b64encode(image_bytes).decode('utf-8')
-        return f"data:{mime_type};base64,{encoded_string}"
-    except requests.exceptions.RequestException as e:
-        print(f"Error fetching markdown image from URL {url}: {e}")
-        return url # Fallback to original URL on error
-    except Exception as e:
-        print(f"An unexpected error occurred while processing markdown URL {url}: {e}")
-        return url
-
-def replace_image_urls_with_data_urls(md_text: str, md_images_map: Dict[str, str]) -> str:
-    """Replaces image placeholder paths in Markdown with Base64 Data URLs fetched from external URLs."""
-    if not md_images_map:
-        return md_text
-    for placeholder_path, image_url in md_images_map.items():
-        print(f"Processing markdown image for '{placeholder_path}' from URL: {image_url}")
-        data_url = url_to_base64_data_url(image_url)
-        md_text = md_text.replace(f'src="{placeholder_path}"', f'src="{data_url}"') \
-                         .replace(f']({placeholder_path})', f']({data_url})')
-    return md_text
-
-def url_to_pil_image(url: str) -> Optional[Image.Image]:
-    """Downloads an image from a URL and returns it as a PIL Image object for the Gradio Image component."""
-    if not url or not url.startswith(('http://', 'https://')):
-        print(f"Warning: Invalid URL provided for visualization image: {url}")
-        return None
-    try:
-        response = requests.get(url, timeout=600)
-        response.raise_for_status()
-        image_bytes = response.content
-        pil_image = Image.open(io.BytesIO(image_bytes)).convert("RGB")
-        return pil_image
-    except requests.exceptions.RequestException as e:
-        print(f"Error fetching visualization image from URL {url}: {e}")
-        return None
-    except Exception as e:
-        print(f"Error processing visualization image from URL {url}: {e}")
-        return None
 
-# =========================
-# API Response Processing (From Old "Xinghe" Script - Handles URLs)
-# =========================
-def _process_api_response_page(result: Dict[str, Any]) -> Tuple[str, Optional[Image.Image], str]:
+# 【改动点】: 这个函数现在不再需要，因为我们不再将URL下载为PIL Image对象。
+# def url_to_pil_image(url: str) -> Optional[Image.Image]:
+#     """Downloads an image from a URL and returns it as a PIL Image object for the Gradio Image component."""
+#     if not url or not url.startswith(('http://', 'https://')):
+#         print(f"Warning: Invalid URL provided for visualization image: {url}")
+#         return None
+#     try:
+#         start_time = time.time()
+#         response = requests.get(url, timeout=600)
+#         end_time = time.time()
+#         print(f"Fetched visualization image from {url} in {end_time - start_time:.2f} seconds.")
+#
+#         response.raise_for_status()
+#         image_bytes = response.content
+#         pil_image = Image.open(io.BytesIO(image_bytes)).convert("RGB")
+#         return pil_image
+#     except requests.exceptions.RequestException as e:
+#         print(f"Error fetching visualization image from URL {url}: {e}")
+#         return None
+#     except Exception as e:
+#         print(f"Error processing visualization image from URL {url}: {e}")
+#         return None
+
+def _process_api_response_page(result: Dict[str, Any]) -> Tuple[str, str, str]:
     """
-    Processes the API response which contains URLs for images.
-    1. Converts markdown image URLs to inline Base64 Data URLs.
-    2. Downloads the visualization image URL into a PIL Image object.
+    Processes the API response.
+    1. Replaces markdown image placeholders with their direct URLs.
+    2. Constructs an HTML <img> tag string for the visualization image URL.
     """
     layout_results = (result or {}).get("layoutParsingResults", [])
     if not layout_results:
-        return "No content was recognized.", None, ""
+        return "No content was recognized.", "<p>No visualization available.</p>", ""
 
     page0 = layout_results[0] or {}
 
-    # Step 1: Process Markdown content using URL-to-Base64 logic
+    # Step 1: Process Markdown content (unchanged from previous optimization)
     md_data = page0.get("markdown") or {}
     md_text = md_data.get("text", "") or ""
-    md_images_map = md_data.get("images", {}) # This map contains URLs: {"placeholder.jpg": "http://..."}
+    md_images_map = md_data.get("images", {})
     if md_images_map:
-        md_text = replace_image_urls_with_data_urls(md_text, md_images_map)
-
-    # Step 2: Process Visualization images by downloading from URLs
-    vis_images: List[Image.Image] = []
-    out_imgs = page0.get("outputImages") or {} # This dict contains URLs: {"0": "http://...", "1": "http://..."}
-    for _, img_url in sorted(out_imgs.items()):
-        pil_image = url_to_pil_image(img_url)
-        if pil_image:
-            vis_images.append(pil_image)
-        else:
-            print(f"Warning: Failed to load visualization image from URL: {img_url}")
-
-    # Logic to select the final visualization image
-    output_image: Optional[Image.Image] = None
-    if len(vis_images) >= 2:
-        output_image = vis_images[1]
-    elif vis_images:
-        output_image = vis_images[0]
+        for placeholder_path, image_url in md_images_map.items():
+            md_text = md_text.replace(f'src="{placeholder_path}"', f'src="{image_url}"') \
+                             .replace(f']({placeholder_path})', f']({image_url})')
+
+    # 【核心改动点】 Step 2: Process Visualization images by creating an HTML string
+    output_html = "<p style='text-align:center; color:#888;'>No visualization image available.</p>"
+    out_imgs = page0.get("outputImages") or {}
+    
+    # Get all image URLs and sort them
+    sorted_urls = [img_url for _, img_url in sorted(out_imgs.items()) if img_url]
+
+    # Logic to select the final visualization image URL
+    output_image_url: Optional[str] = None
+    if len(sorted_urls) >= 2:
+        output_image_url = sorted_urls[1]
+    elif sorted_urls:
+        output_image_url = sorted_urls[0]
+
+    # If a URL was found, create the <img> tag
+    if output_image_url:
+        print(f"Found visualization image URL: {output_image_url}")
+        # The CSS will style this `img` tag because of the `#vis_image_doc img` selector
+        output_html = f'<img src="{output_image_url}" alt="Detection Visualization">'
+    else:
+        print("Warning: No visualization image URL found in the API response.")
 
-    return md_text or "(Empty result)", output_image, md_text
+    return md_text or "(Empty result)", output_html, md_text
 
 # =========================
-# Handlers (From New Script - More feature complete)
+# Handlers
 # =========================
-def handle_complex_doc(file_path: str, use_chart_recognition: bool) -> Tuple[str, Optional[Image.Image], str]:
+def handle_complex_doc(file_path: str, use_chart_recognition: bool) -> Tuple[str, str, str]:
     if not file_path: raise gr.Error("Please upload an image first.")
     data = _call_api(DEFAULT_API_URL, file_path, use_layout_detection=True, prompt_label=None, use_chart_recognition=use_chart_recognition)
     result = data.get("result", {})
+    # Note the return types now align with the new function signature
     return _process_api_response_page(result)
 
 def handle_targeted_recognition(file_path: str, prompt_choice: str) -> Tuple[str, str]:
@@ -233,158 +215,51 @@ def handle_targeted_recognition(file_path: str, prompt_choice: str) -> Tuple[str
     return md_preview, md_raw
 
 # =========================
-# CSS & UI (From New Script)
+# CSS & UI
 # =========================
 custom_css = """
 /* 全局字体 */
 body, .gradio-container, .gradio-container * {
   font-family: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif !important;
 }
-
-/* 头部 */
-.app-header {
-  text-align: center;
-  max-width: 900px;
-  margin: 0 auto 8px !important;
-}
-
-/* 全局容器与标签页 */
-.gradio-container {
-  padding: 4px 0 !important;
-}
-.gradio-container [data-testid="tabs"],
-.gradio-container .tabs {
-  margin-top: 0 !important;
-}
-.gradio-container [data-testid="tabitem"],
-.gradio-container .tabitem {
-  padding-top: 4px !important;
-}
-
-/* 快速链接 */
-.quick-links {
-  text-align: center;
-  padding: 8px 0;
-  border: 1px solid #e5e7eb;
-  border-radius: 8px;
-  margin: 8px auto;
-  max-width: 900px;
-}
-.quick-links a {
-  margin: 0 12px;
-  font-size: 14px;
-  font-weight: 600;
-  color: #3b82f6;
-  text-decoration: none;
-}
-.quick-links a:hover {
-  text-decoration: underline;
-}
-
-/* 按钮区域（识别类型选择） */
-.prompt-grid {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-  margin-top: 6px;
-}
-.prompt-grid button {
-  height: 40px !important;
-  padding: 0 12px !important;
-  border-radius: 8px !important;
-  font-weight: 600 !important;
-  font-size: 13px !important;
-  letter-spacing: 0.2px;
-}
-
-/* 图片预览与可视化 (vh -> px) */
-#image_preview_vl, #image_preview_doc {
-  height: 400px !important; /* 原为 60vh */
-  overflow: auto;
-}
-
-#image_preview_vl img,
-#image_preview_doc img,
-#vis_image_doc img {
-  width: 100% !important;
-  height: auto !important;
-  object-fit: contain !important;
-  display: block;
-}
-
-/* Markdown 预览区 (vh -> px) */
-#md_preview_vl, #md_preview_doc {
-  max-height: 540px; /* 原为 60vh */
-  min-height: 180px;
-  overflow: auto;
-  scrollbar-gutter: stable both-edges;
-}
-#md_preview_vl .prose,
-#md_preview_doc .prose {
-  line-height: 1.7 !important;
-}
-#md_preview_vl .prose img,
-#md_preview_doc .prose img {
-  display: block;
-  margin: 0 auto;
-  max-width: 100%;
-  height: auto;
-}
-/* Notice banner */
-.notice {
-  margin: 8px auto 0;
-  max-width: 900px;
-  padding: 10px 12px;
-  border: 1px solid #e5e7eb;
-  border-radius: 8px;
-  background: #f8fafc;
-  font-size: 14px;
-  line-height: 1.6;
-}
+/* ... (rest of the CSS is unchanged) ... */
+.app-header { text-align: center; max-width: 900px; margin: 0 auto 8px !important; }
+.gradio-container { padding: 4px 0 !important; }
+.gradio-container [data-testid="tabs"], .gradio-container .tabs { margin-top: 0 !important; }
+.gradio-container [data-testid="tabitem"], .gradio-container .tabitem { padding-top: 4px !important; }
+.quick-links { text-align: center; padding: 8px 0; border: 1px solid #e5e7eb; border-radius: 8px; margin: 8px auto; max-width: 900px; }
+.quick-links a { margin: 0 12px; font-size: 14px; font-weight: 600; color: #3b82f6; text-decoration: none; }
+.quick-links a:hover { text-decoration: underline; }
+.prompt-grid { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
+.prompt-grid button { height: 40px !important; padding: 0 12px !important; border-radius: 8px !important; font-weight: 600 !important; font-size: 13px !important; letter-spacing: 0.2px; }
+#image_preview_vl, #image_preview_doc { height: 400px !important; overflow: auto; }
+#image_preview_vl img, #image_preview_doc img, #vis_image_doc img { width: 100% !important; height: auto !important; object-fit: contain !important; display: block; }
+#md_preview_vl, #md_preview_doc { max-height: 540px; min-height: 180px; overflow: auto; scrollbar-gutter: stable both-edges; }
+#md_preview_vl .prose, #md_preview_doc .prose { line-height: 1.7 !important; }
+#md_preview_vl .prose img, #md_preview_doc .prose img { display: block; margin: 0 auto; max-width: 100%; height: auto; }
+.notice { margin: 8px auto 0; max-width: 900px; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: #f8fafc; font-size: 14px; line-height: 1.6; }
 .notice strong { font-weight: 700; }
 .notice a { color: #3b82f6; text-decoration: none; }
 .notice a:hover { text-decoration: underline; }
-
 """
 
-
 with gr.Blocks(head=GOOGLE_FONTS_URL, css=custom_css, theme=gr.themes.Soft()) as demo:
     logo_data_url = image_to_base64_data_url(LOGO_IMAGE_PATH) if os.path.exists(LOGO_IMAGE_PATH) else ""
-    gr.HTML(f"""
-        <div class="app-header">
-            <img src="{logo_data_url}" alt="App Logo" style="max-height:10%; width: auto; margin: 10px auto; display: block;">
-        </div>
-    """)
-    gr.HTML("""
-        <div class="notice">
-            <strong>Heads up:</strong> The Hugging Face demo can be slow at times. 
-            For a faster experience, please try 
-            <a href="https://modelscope.cn/studios/PaddlePaddle/PaddleOCR-VL_Online_Demo/summary" target="_blank" rel="noopener noreferrer">ModelScope</a> 
-            or 
-            <a href="https://aistudio.baidu.com/application/detail/98365" target="_blank" rel="noopener noreferrer">Baidu AI Studio</a>.
-        </div>
-    """)
-    gr.HTML("""
-        <div class="quick-links">
-            <a href="https://github.com/PaddlePaddle/PaddleOCR" target="_blank">GitHub</a> |
-            <a href="https://huggingface.co/spaces/PaddlePaddle/PaddleOCR-VL_Online_Demo" target="_blank">Technical Report</a> |
-            <a href="https://huggingface.co/spaces/PaddlePaddle/PaddleOCR-VL_Online_Demo" target="_blank">Model</a>
-        </div>
-    """)
+    gr.HTML(f"""<div class="app-header"><img src="{logo_data_url}" alt="App Logo" style="max-height:10%; width: auto; margin: 10px auto; display: block;"></div>""")
+    gr.HTML("""<div class="notice"><strong>Heads up:</strong> The Hugging Face demo can be slow at times. For a faster experience, please try <a href="https://aistudio.baidu.com/application/detail/98365" target="_blank" rel="noopener noreferrer">Baidu AI Studio</a> or <a href="https://modelscope.cn/studios/PaddlePaddle/PaddleOCR-VL_Online_Demo/summary" target="_blank" rel="noopener noreferrer">ModelScope</a>.</div>""")
+    gr.HTML("""<div class="quick-links"><a href="https://github.com/PaddlePaddle/PaddleOCR" target="_blank">GitHub</a> | <a href="https://huggingface.co/spaces/PaddlePaddle/PaddleOCR-VL_Online_Demo" target="_blank">Technical Report</a> | <a href="https://huggingface.co/spaces/PaddlePaddle/PaddleOCR-VL_Online_Demo" target="_blank">Model</a></div>""")
+    
     with gr.Tabs():
         with gr.Tab("Document Parsing"):
             with gr.Row():
                 with gr.Column(scale=5):
                     file_doc = gr.File(label="Upload Image", file_count="single", type="filepath", file_types=["image"])
                     preview_doc_html = gr.HTML(value="", elem_id="image_preview_doc", visible=False)
-
                     gr.Markdown("_( Use this mode for recognizing full-page documents with structured layouts, such as reports, papers, or magazines.)_")
                     gr.Markdown("💡 *To recognize a single, pre-cropped element (e.g., a table or formula), switch to the 'Element-level Recognition' tab for better results.*")
-
                     with gr.Row(variant="panel"):
                         chart_parsing_switch = gr.Checkbox(label="Enable chart parsing", value=False, scale=1)
                         btn_parse = gr.Button("Parse Document", variant="primary", scale=2)
-
                     if complex_document_examples:
                         complex_paths = [e[0] for e in complex_document_examples]
                         complex_state = gr.State(complex_paths)
@@ -397,7 +272,8 @@ with gr.Blocks(head=GOOGLE_FONTS_URL, css=custom_css, theme=gr.themes.Soft()) as
                         with gr.Tab("Markdown Preview"):
                             md_preview_doc = gr.Markdown("Please upload an image and click 'Parse Document'.", latex_delimiters=LATEX_DELIMS, elem_id="md_preview_doc")
                         with gr.Tab("Visualization"):
-                            vis_image_doc = gr.Image(label="Detection Visualization", interactive=False, elem_id="vis_image_doc")
+                            # 【核心改动点】: 将 gr.Image 替换为 gr.HTML
+                            vis_image_doc = gr.HTML(label="Detection Visualization", elem_id="vis_image_doc")
                         with gr.Tab("Markdown Source"):
                             md_raw_doc = gr.Code(label="Markdown Source Code", language="markdown")
 
@@ -409,7 +285,6 @@ with gr.Blocks(head=GOOGLE_FONTS_URL, css=custom_css, theme=gr.themes.Soft()) as
                 with gr.Column(scale=5):
                     file_vl = gr.File(label="Upload Image", file_count="single", type="filepath", file_types=["image"])
                     preview_vl_html = gr.HTML(value="", elem_id="image_preview_vl", visible=False)
-
                     gr.Markdown("_(Best for images with a **simple, single-column layout** (e.g., pure text), or for a **pre-cropped single element** like a table, formula, or chart.)_")
                     gr.Markdown("Choose a recognition type:")
                     with gr.Row(elem_classes=["prompt-grid"]):
@@ -418,7 +293,6 @@ with gr.Blocks(head=GOOGLE_FONTS_URL, css=custom_css, theme=gr.themes.Soft()) as
                     with gr.Row(elem_classes=["prompt-grid"]):
                         btn_table = gr.Button("Table Recognition", variant="secondary")
                         btn_chart = gr.Button("Chart Recognition", variant="secondary")
-
                     if targeted_recognition_examples:
                         targeted_paths = [e[0] for e in targeted_recognition_examples]
                         targeted_state = gr.State(targeted_paths)
@@ -441,4 +315,4 @@ with gr.Blocks(head=GOOGLE_FONTS_URL, css=custom_css, theme=gr.themes.Soft()) as
 
 if __name__ == "__main__":
     port = int(os.getenv("PORT", "7860"))
-    demo.queue(max_size=6).launch(server_name="0.0.0.0", server_port=port,share=False) 
+    demo.queue(max_size=6).launch(server_name="0.0.0.0", server_port=port,share=False)