update

app.py

@@ -1,7 +1,8 @@
 import gradio as gr
 import os
+import urllib.parse # 新增：用於處理網址編碼
 
-# 獲取當前絕對路徑，確保讀取檔案無誤
+# 獲取當前絕對路徑
 BASE_DIR = os.path.abspath(os.getcwd())
 
 SCENES = [
@@ -28,57 +29,80 @@ SCENES = [
 gallery_items = [(item["thumb"], item["name"]) for item in SCENES]
 
 def load_scene(evt: gr.SelectData, request: gr.Request):
-    """
-    載入選定的場景並生成自動播放的 iframe 連結
-    request: 用來獲取當前 Gradio 的網址 (localhost 或 share link)
-    """
     index = evt.index
     scene = SCENES[index]
     
+    # 組合絕對路徑
     full_model_path = os.path.join(BASE_DIR, scene["model"])
     
     if not os.path.exists(full_model_path):
         return (
-            "<div style='text-align:center; padding:50px'>⚠️ File not found</div>",
+            "<div style='text-align:center; padding:50px; color:red'>⚠️ File not found</div>",
             None,
-            f"**⚠️ Error:** File not found: {scene['model']}"
+            f"**⚠️ Error:** File not found: {full_model_path}"
         )
     
-    # 1. 取得你目前的 Gradio 伺服器網址 (例如 https://xxxx.gradio.live 或 http://127.0.0.1:7860)
-    # 注意：如果是在本地跑且沒有 share=True，這個網址通常是 http
+    # --- 關鍵修正開始 ---
+    
+    # 1. 處理 Windows 路徑 (將 \ 轉為 /)
+    # Gradio 的 file路由需要正斜線，且不能有磁碟機代號之後的雙反斜線混亂
+    clean_path = full_model_path.replace("\\", "/")
+    
+    # 2. 判斷網址 (這是最容易報錯的地方)
+    base_url = "http://127.0.0.1:7860" # 預設值
+    is_https = False
+    
     if request:
-        host = request.headers.get("host") # e.g. "7213...gradio.live"
-        # 判斷是 http 還是 https (Gradio Share 連結通常是 https)
-        protocol = "https" if "gradio.live" in host else "http"
-        base_url = f"{protocol}://{host}"
-    else:
-        base_url = "http://127.0.0.1:7860"
+        host = request.headers.get("host")
+        if "gradio.live" in host:
+            base_url = f"https://{host}"
+            is_https = True
+        else:
+            base_url = f"http://{host}"
 
-    # 2. 組合檔案的下載連結 (Gradio 的 /file/ 路徑)
-    # 注意 Windows路徑的反斜線可能需要處理，但在 Gradio file serving 通常沒問題
-    file_url = f"{base_url}/file={full_model_path}"
+    # 3. 組合檔案連結並進行 URL 編碼
+    # 我們只對路徑部分進行編碼，避免空白變成無效字元
+    # 瀏覽器看到的連結會類似: https://xxx.gradio.live/file=D:/Path/To/File.ply
+    file_url = f"{base_url}/file={clean_path}"
     
-    # 3. 組合外部 Viewer 的連結 (利用 ?url= 參數)
-    viewer_url = f"https://antimatter15.com/splat/?url={file_url}"
+    # 對 file_url 再進行一次完整編碼，因為它將作為 ?url= 的參數傳遞給外部網站
+    # 外部網站讀取時會解碼一次
+    encoded_file_url = urllib.parse.quote(file_url, safe=':/')
     
-    print(f"🔗 Generated Link: {viewer_url}") # Debug 用，可以在終端機看到連結
-
-    # 4. 生成 HTML
-    html = f"""
-    <iframe 
-        src="{viewer_url}" 
-        width="100%" 
-        height="600px" 
-        frameborder="0"
-        allow="camera; gpu"
-        style="border-radius: 8px; background: #000;"
-    ></iframe>
-    """
+    # 4. 組合外部 Viewer 連結
+    viewer_url = f"https://antimatter15.com/splat/?url={encoded_file_url}"
     
+    print(f"🔗 Base URL: {base_url}")
+    print(f"📂 File URL: {file_url}")
+    print(f"🚀 Final Viewer URL: {viewer_url}")
+
+    # --- 關鍵修正結束 ---
+
     # 提示訊息
-    status_msg = f"**{scene['name']}** - Auto-loading via External Viewer..."
-    if protocol == "http":
-        status_msg += "\n\n⚠️ **Note:** If screen is black, use `share=True` (see explanation)."
+    if not is_https:
+        status_msg = f"""
+        ### ⚠️ 警告：無法載入 (CORS Error)
+        偵測到您正在使用 **Localhost (http)**。
+        由於安全性限制，外部 Viewer (https) 無法讀取您的本機檔案。
+        
+        **請解決：**
+        1. 查看終端機 (Terminal)。
+        2. 複製 **Running on public URL: https://xxxx.gradio.live** 的連結。
+        3. 用該連結開啟網頁，即可正常顯示。
+        """
+        html = f"<div style='background:#333; color:white; padding:20px; border-radius:10px;'>{status_msg}</div>"
+    else:
+        status_msg = f"**{scene['name']}** Loaded successfully from {base_url}"
+        html = f"""
+        <iframe 
+            src="{viewer_url}" 
+            width="100%" 
+            height="600px" 
+            frameborder="0"
+            allow="camera; display-capture"
+            style="border-radius: 8px; background: #000;"
+        ></iframe>
+        """
 
     return (
         html,
@@ -86,11 +110,9 @@ def load_scene(evt: gr.SelectData, request: gr.Request):
         status_msg
     )
 
-# --- UI ---
+# --- UI (保持不變) ---
 with gr.Blocks(title="RGS-SLAM Demo") as demo:
-    
     gr.Markdown("# 🚀 RGS-SLAM Gaussian Splatting Viewer")
-    
     with gr.Row():
         with gr.Column(scale=1):
             gr.Markdown("### 📂 Select Scene")
@@ -102,26 +124,21 @@ with gr.Blocks(title="RGS-SLAM Demo") as demo:
                 object_fit="contain",
                 allow_preview=False
             )
-        
         with gr.Column(scale=3):
             status = gr.Markdown("**👈 Select a scene to auto-load**")
-            
             with gr.Tab("🎯 3D Viewer"):
-                # 初始狀態為空
                 viewer_frame = gr.HTML(
                     value="<div style='text-align: center; padding: 100px; color: #666;'>Select a scene</div>"
                 )
-            
             with gr.Tab("📍 Camera Trajectory"):
                 trajectory_img = gr.Image(label="Camera Path", height=600)
     
     scene_gallery.select(
         fn=load_scene,
-        inputs=None, # inputs 不需要顯式傳入，gr.SelectData 會自動處理
+        inputs=None,
         outputs=[viewer_frame, trajectory_img, status]
     )
 
 if __name__ == "__main__":
-    # 關鍵：allowed_paths 允許 Gradio 讀取當前資料夾的檔案
-    # 建議開啟 share=True 以解決 HTTPS 跨域問題
-    demo.launch(share=True, allowed_paths=[BASE_DIR])
+    # 這裡必須保留 share=True
+    demo.launch(share=True, allowed_paths=[BASE_DIR])