feat: add gradio api integration for instantid face swap uploads

Author: purvanshjoshi

app.py

@@ -2,8 +2,11 @@
 from fastapi.middleware.cors import CORSMiddleware
 from pydantic import BaseModel
 from huggingface_hub import InferenceClient
+from gradio_client import Client, handle_file
 import os
 import io
+import base64
+import tempfile
 
 app = FastAPI()
 
@@ -28,6 +31,7 @@ class GenerateRequest(BaseModel):
     prompt: str
     negative_prompt: str = ""
     seed: int = None
+    face_image_base64: str = None
 
 @app.get("/")
 def read_root():
@@ -36,6 +40,52 @@ def read_root():
 @app.post("/api/generate")
 async def generate_image(req: GenerateRequest):
     try:
+        # Branch 1: Face Swap using InstantID (Gradio API Hack)
+        if req.face_image_base64:
+            base64_data = req.face_image_base64
+            if "," in base64_data:
+                base64_data = base64_data.split(",")[1]
+                
+            img_data = base64.b64decode(base64_data)
+            with tempfile.NamedTemporaryFile(delete=False, suffix=".jpg") as tmp:
+                tmp.write(img_data)
+                tmp_path = tmp.name
+                
+            gradio_client = Client("InstantX/InstantID")
+            result = gradio_client.predict(
+                face_image_path=handle_file(tmp_path),
+                pose_image_path=None,
+                prompt=req.prompt,
+                negative_prompt=req.negative_prompt,
+                style_name="(No style)",
+                num_steps=30,
+                identitynet_strength_ratio=0.8,
+                adapter_strength_ratio=0.8,
+                canny_strength=0.4,
+                depth_strength=0.4,
+                controlnet_selection=["depth"],
+                guidance_scale=5.0,
+                seed=req.seed if req.seed is not None else 42,
+                scheduler="EulerDiscreteScheduler",
+                enable_LCM=False,
+                enhance_face_region=True,
+                api_name="/generate_image"
+            )
+            
+            # Extract image path from Gradio tuple response
+            image_list = result[0] if isinstance(result, tuple) else result
+            if isinstance(image_list, list) and len(image_list) > 0:
+                final_img_path = image_list[0].get("path")
+            else:
+                final_img_path = image_list
+                
+            with open(final_img_path, "rb") as f:
+                img_byte_arr = f.read()
+                
+            os.remove(tmp_path)
+            return Response(content=img_byte_arr, media_type="image/jpeg")
+
+        # Branch 2: Blazing Fast Text-to-Image (FLUX.1-schnell)
         parameters = {}
         if req.negative_prompt:
             parameters["negative_prompt"] = req.negative_prompt

app/page.js

@@ -6,9 +6,21 @@ export default function Home() {
   const [prompt, setPrompt] = useState('');
   const [negativePrompt, setNegativePrompt] = useState('ugly, bad anatomy, deformed, blurry');
   const [seed, setSeed] = useState('');
+  const [faceImage, setFaceImage] = useState(null);
   const [isGenerating, setIsGenerating] = useState(false);
   const [generatedImage, setGeneratedImage] = useState(null);
 
+  const handleFileUpload = (e) => {
+    const file = e.target.files[0];
+    if (file) {
+      const reader = new FileReader();
+      reader.onloadend = () => setFaceImage(reader.result);
+      reader.readAsDataURL(file);
+    } else {
+      setFaceImage(null);
+    }
+  };
+
   const handleGenerate = async (e) => {
     e.preventDefault();
     setIsGenerating(true);
@@ -18,6 +30,7 @@ export default function Home() {
       const backendUrl = process.env.NEXT_PUBLIC_BACKEND_URL || 'https://purvansh01-persona-studio.hf.space';
       const bodyPayload = { prompt, negativePrompt };
       if (seed) bodyPayload.seed = parseInt(seed, 10);
+      if (faceImage) bodyPayload.face_image_base64 = faceImage;
 
       const response = await fetch(`${backendUrl}/api/generate`, {
         method: 'POST',
@@ -81,6 +94,25 @@ export default function Home() {
           {/* Controls Panel */}
           <div className="glass-panel">
             <form onSubmit={handleGenerate}>
+              <div style={{ marginBottom: '24px' }}>
+                <label className="input-label">Upload Reference Face (Optional)</label>
+                <div style={{ display: 'flex', gap: '16px', alignItems: 'center' }}>
+                  <input 
+                    type="file" 
+                    accept="image/*" 
+                    onChange={handleFileUpload}
+                    className="input-field"
+                    style={{ padding: '8px' }}
+                  />
+                  {faceImage && (
+                    <img src={faceImage} alt="Face Reference" style={{ width: '40px', height: '40px', borderRadius: '50%', objectFit: 'cover' }} />
+                  )}
+                </div>
+                <p style={{ fontSize: '12px', color: 'var(--text-secondary)', marginTop: '8px' }}>
+                  Pro Tip: Uploading a face triggers the massive InstantID GPUs. It is incredibly powerful but may take up to 60 seconds.
+                </p>
+              </div>
+
               <div style={{ marginBottom: '24px' }}>
                 <label className="input-label">Positive Prompt</label>
                 <textarea 

requirements.txt

@@ -2,3 +2,4 @@ fastapi
 uvicorn
 huggingface_hub
 Pillow
+gradio_client

test_gradio.py

@@ -0,0 +1,8 @@
+from gradio_client import Client
+
+try:
+    print("Connecting to InstantX/InstantID...")
+    client = Client("InstantX/InstantID")
+    print(client.view_api(return_format="dict"))
+except Exception as e:
+    print("Error:", e)