Upload app.py

Llama 3.2 90B Vision

app.py

@@ -0,0 +1,177 @@
+# -*- coding: utf-8 -*-
+# 財政部財政資訊中心 江信宗
+
+import gradio as gr
+import requests
+import base64
+import json
+import os
+from PIL import Image
+from io import BytesIO
+
+invoke_url = "https://ai.api.nvidia.com/v1/gr/meta/llama-3.2-90b-vision-instruct/chat/completions"
+stream = True
+
+def compress_image(image_path, max_size_kb=175):
+    max_size_bytes = max_size_kb * 1024
+    quality = 95
+    with Image.open(image_path) as img:
+        img.thumbnail((800, 800))
+        while True:
+            img_byte_arr = BytesIO()
+            img.save(img_byte_arr, format='JPEG', quality=quality)
+            if img_byte_arr.tell() <= max_size_bytes or quality <= 10:
+                return img_byte_arr.getvalue()
+            quality = max(quality - 10, 10)
+
+def process_image(image_path, api_key, question):
+    try:
+        compressed_image = compress_image(image_path)
+        image_b64 = base64.b64encode(compressed_image).decode()
+        assert len(image_b64) < 180_000, \
+            "Image is still too large after compression. Please try a smaller image."
+        prompt = f"{question} . Must reply to me in \"Traditional Chinese\"."
+        headers = {
+            "Authorization": f"Bearer {api_key}",
+            "Accept": "text/event-stream" if stream else "application/json"
+        }
+        payload = {
+            "model": 'meta/llama-3.2-90b-vision-instruct',
+            "messages": [
+                {
+                    "role": "user",
+                    "content": f'{prompt} <img src="data:image/jpeg;base64,{image_b64}" />'
+                }
+            ],
+            "max_tokens": 512,
+            "temperature": 1.00,
+            "top_p": 1.00,
+            "stream": stream
+        }
+        response = requests.post(invoke_url, headers=headers, json=payload, stream=True)
+        if response.status_code == 200:
+            full_response = ""
+            for line in response.iter_lines():
+                if line:
+                    line = line.decode('utf-8')
+                    if line.startswith('data: '):
+                        json_str = line[6:]
+                        if json_str.strip() == '[DONE]':
+                            break
+                        try:
+                            json_obj = json.loads(json_str)
+                            content = json_obj['choices'][0]['delta'].get('content', '')
+                            full_response += content
+                            yield full_response
+                        except json.JSONDecodeError:
+                            print(f"Failed to parse JSON: {json_str}")
+            return full_response
+        elif response.status_code == 402:
+            return "錯誤：API 帳號積分已過期。請至 NVIDIA 官網檢查您的帳號狀態。"
+        else:
+            error_message = f"錯誤 {response.status_code}: {response.text}"
+            print(error_message)
+            return f"發生錯誤。請稍後再試或聯繫管理員。錯誤代碼：{response.status_code}"
+    except Exception as e:
+        print(f"發生異常：{str(e)}")
+        return f"處理請求時發生錯誤：{str(e)}"
+
+custom_css = """
+.center-aligned {
+    text-align: center !important;
+    color: #ff4081;
+    text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
+    margin-bottom: -5px !important;
+}
+.gen-button {
+    border-radius: 10px !important;
+    background-color: #ff4081 !important;
+    color: white !important;
+    font-weight: bold !important;
+    transition: all 0.3s ease !important;
+}
+.gen-button:hover {
+    background-color: #f50057 !important;
+    transform: scale(1.05);
+}
+.gr-input, .gr-box, .gr-dropdown {
+    border-radius: 10px !important;
+    border: 2px solid #ff4081 !important;
+}
+.gr-input:focus, .gr-box:focus, .gr-dropdown:focus {
+    border-color: #f50057 !important;
+    box-shadow: 0 0 0 2px rgba(245,0,87,0.2) !important;
+}
+.input-background {
+    background-color: #B7E0FF !important;
+    padding: 15px !important;
+    border-radius: 10px !important;
+}
+.gr-box {
+    border-radius: 10px !important;
+    border: 2px solid #ff4081 !important;
+}
+.api-background {
+    background-color: #FFCFB3 !important;
+    padding: 15px !important;
+    border-radius: 10px !important;
+}
+.output-background {
+    background-color: #FFF4B5 !important;
+    padding: 15px !important;
+    border-radius: 10px !important;
+}
+.image-background {
+    border-radius: 10px !important;
+    border: 2px solid #B7E0FF !important;
+}
+.clear-button {
+    border-radius: 10px !important;
+    background-color: #333333 !important;
+    color: white !important;
+    font-weight: bold !important;
+    transition: all 0.3s ease !important;
+}
+.clear-button:hover {
+    background-color: #000000 !important;
+    transform: scale(1.05);
+}
+"""
+
+with gr.Blocks(theme=gr.themes.Monochrome(), css=custom_css) as demo:
+    gr.Markdown("# 👹 Llama 3.2 90B Vision. Deployed by 江信宗", elem_classes="center-aligned")
+    image_input = gr.Image(type="filepath", label="上傳圖片", elem_classes="image-background")
+    with gr.Row():
+        question_input = gr.Textbox(label="請輸入您的問題", placeholder="例如：What is in this image?", scale=2, elem_classes="input-background")
+        api_key_input = gr.Textbox(type="password", label="請輸入您的 API Key", placeholder="API authentication key for large language models", scale=1, elem_classes="api-background")
+    output = gr.Textbox(label="Vision Model 回覆", elem_classes="output-background", max_lines=20)
+    with gr.Row():
+        submit_button = gr.Button("傳送", variant="primary", scale=2, elem_classes="gen-button")
+        clear_button = gr.Button("清除", variant="secondary", scale=1, elem_classes="clear-button")
+        def clear_inputs():
+            gr.Info("已成功清除所有內容，歡迎繼續提問......")
+            return None, "", ""
+        clear_button.click(
+            fn=clear_inputs,
+            inputs=None,
+            outputs=[image_input, question_input, output]
+        )
+        submit_button.click(fn=process_image, inputs=[image_input, api_key_input, question_input], outputs=output)
+    gr.HTML("""
+        <script>
+            document.addEventListener('click', function(e) {
+                if (e.target && e.target.textContent === '清除') {
+                    var fileInput = document.querySelector('.upload-button input[type=file]');
+                    if (fileInput) {
+                        fileInput.value = '';
+                    }
+                }
+            });
+        </script>
+    """)
+
+if __name__ == "__main__":
+    if "SPACE_ID" in os.environ:
+        demo.queue().launch()
+    else:
+        demo.queue().launch(share=True, show_api=False)