app.py

def encode_image(image_path):
    with open(image_path, "rb") as image_file:
        return base64.b64encode(image_file.read()).decode('utf-8')

def upload_img(image,api_key,img_ques):

    base64_image = encode_image(image)
    
    
    headers = {
        "Content-Type": "application/json",
        "Authorization": f"Bearer {api_key}" 
    }
    payload = {
        "model": "gpt-4-vision-preview",
        "messages": [
            {
                "role": "user",
                "content": [
                    {
                        "type": "text",
                        "text": img_ques
                    },
                    {
                        "type": "image_url",
                        "image_url": {
                            "url": f"data:image/jpeg;base64,{base64_image}"
                        }
                    }
                ]
            }
        ],
        "max_tokens": 300
    }
    response = requests.post("https://api.openai.com/v1/chat/completions", headers=headers, json=payload)
    img_preview = response.json()
    return img_preview["choices"][0]["message"]["content"]

title = """<h1 align="center">GPT-4 Preview</h1>"""

with gr.Blocks() as demo:
    gr.Markdown(title)

    with gr.Row():
        with gr.Column():
            image_input = gr.Image(type="filepath", label="Upload Image")
            key_input = gr.Textbox(label="Enter API-key")
            upload_button = gr.Button(value="Upload & Start Chat", interactive=True, variant="primary")
            btn_clear = gr.ClearButton([image_input,key_input],[text])
        
        with gr.Column():
            text = gr.Textbox(label="Output")
            ques_input = gr.Textbox(label="Enter the question")
            ques_clear = gr.ClearButton([ques_input])

    upload_button.click(upload_img, inputs=[image_input,key_input,ques_input], outputs=text)
    btn_clear.add(text)
    ques_clear.add(text)

demo.launch(share=True)