Building a Python API for Comfy UI with Gradio
HTML-код
- Опубликовано: 15 авг 2024
- In this video, I show you how to build a Python API to connect Gradio and Comfy UI for generating AI images. This is a great project to make your own frontend.
In this programming tutorial, I show you step-by-step how to build a Python API to connect Gradio and Comfy UI. We start with a simple example that generates an image on button click. Then we add text and image inputs to control image generation parameters.
I appreciate if you can like and share the video if it was helpful.
Subscribe for more content soon!
[SUPPORT THE CHANNEL]
Patreon: bit.ly/44js1Xx
Paypal: bit.ly/45lJsIg
[PROJECT FILES]
Github: bit.ly/3sSspzB
[SOCIAL MEDIA]
RUclips Channel: bit.ly/47OterT
Twitter X: bit.ly/3ReP9D3
[BUSINESS INQUIRIES]
For professional inquiries and collaborations, please contact me via email:
Email: CodeCraftersCorner@gmail.com
(Use this email for business-related matters only)
[PREVIOUS VIDEOS]
Gradio: • Introduction to Python...
I cover:
- Connecting Gradio and Comfy UI
- Sending workflow information as API requests
- Updating workflow parameters dynamically
- Displaying generated images in Gradio
- Adding text and image inputs
- Using smartphone camera as input
This will give you the fundamentals to build your own Gradio front-end for Comfy UI or any other application. Useful for beginners looking to learn about building Python APIs.
Timestamps:
00:00:00 Introduction
00:00:31 ComfyUI
00:00:47 Application Programming Interface (API)
00:03:32 Project start
00:03:39 Python Virtual Environment
00:04:05 Python dependencies and libraries
00:04:20 Making a simple Gradio application
00:05:28 Download ComfyUI
00:06:13 Text to image workflow
00:08:05 ComfyUI API
00:09:49 ComfyUI workflow_api.json file
00:10:32 Loading the workflow in code
00:11:43 Write a POST requests
00:13:04 Quick summary of first example
00:13:37 Quick test run
00:15:49 Upgrading the gradio application
00:16:15 Show generated image inside the gradio application
00:24:12 Example two
00:24:34 Adding a positive prompt field
00:26:55 Adding a step count field
00:27:41 Quick review of example two project
00:27:57 Final project Img to Img workflow
00:30:39 Adding an image input
00:31:23 Handling the image input
00:32:22 Resizing the image file
00:35:34 Using the gradio application on a smartphone
00:37:57 Conclusion
00:38:07 Thank you for watching this video until the very end
00:38:16 Like the video
00:38:19 Subscribe to the channel
00:38:23 Next time!!!😀
Tags:
python, api, gradio, comfyui, stablediffusion, aitutorial, Code Crafters Corner, Sharvin
Hashtags:
#pythonapi #comfyuiapi #gradioapi #stablediffusionapi #aitutorial
Thanks for making this! Extremely clear on how to connect a frontend to ComfyUI.
Glad it was helpful!
Managed to whip up a little Python app, with your help. Thanks!
Thank you, @MrLiamash3! Glad I was able to help!
Thank you. Your lesson is very clear
Glad it was helpful!
First time I learn how to use the ComfyUI API, thank you sir!
Happy to help, @jeantimex!
Man I was working on something like this but for the streamlit library. Spot on man instant sub from me 🎉
I am glad you found the video helpful. It's awesome that you are working on something similar with streamlit. Thanks for the sub. If you ever have questions or want to share your progress, feel free to reach out. Happy Coding!
Thanks for this. Been trying to find a low profile but extensible system for accessing my comfy workflows remotely on mobile devices and this method is the one I'm going with. Cheers
Glad you found the method helpful, @sirflimflam!
Your content is AMAZING! You just have a new subscriber! Your presentation skills are really top notch. It's rarely to have someone explain so clearly nowadays.
I have a workflow that needs to be converted into a Gradio UI, do you work paid gigs?
Thank you very much, @StringerBell! Yes, you can contact me by using this email address to discuss the projects: CodeCraftersCorner@gmail.com
@@CodeCraftersCorner done, I sent you an email
@@CodeCraftersCorner Hey did you happen to receive my email? I sent you the details couple of hours ago but I'm not sure if you received the workflow.
Yes, i received it and replied back. Thank you.
This is exactly what I was looking for, thank you for your clear step-by-step help.
Glad it was helpful, @stevietee3878!
@@CodeCraftersCorner hello again, I've made some major breakthroughs with ComfyUI since my first comment, I'm currently developing a workflow to be used in API format with React as front-end for a mobile app, do you have any experience creating UIs with React and are their similar principles involved as the Gradio/Python example you've wonderfully demonstrated ?
@stevietee3878 No sorry.
Thank you so much for doing this. Instant subscribe and like!
Thank you for the instant subscribe and like! I am glad the video was helpful. If there is anything specify you like to see in future videos, feel free to let me know. Happy coding!
I love you so macht S2, u are a genius
Thank you , @PEDROMATOSFAST!
Great job brother
Thank you, @MyDigitalHub! Appreciate the kind words.
Great thx. You are my lifesaver!😁
Glad to hear that!
Thank you for this video, I did as you said, It works well but Everytime my models loading in queue prompt process, Cant we pass ? btw I am new in ComfyUI I dont change models I just send prompts.
Thank you for watching, @AmerikaMeraklisi-yr2xe! The model should load once for the first image generation. After that, as long as you do not manually change it and you have enough system RAM, it will stay in memory. Actually, ComfyUI managers the model. The python app just sends the JSON data to ComfyUI. Unfortunately, we cannot just send prompts.
@@CodeCraftersCorner Thank you so much for reply, My another question When we do this on public server for example google colab How can I get image files to my pc, I have to request get but where ?
@AmerikaMeraklisi-yr2xe, Here is a breakdown of the steps:
1. Create a link or download endpoint. This can be done with a framework like Flask.
2. You can then get all images from the server's folder.
3. At this point, you can display them in a user friendly interface and provide a download button for each or simply download all of them.
If it is a personal project, then you can download the images directly from the Gradio app by right clicking on the image and choose save image. (may be slightly different depending on the browser).
Gradio also provides a download image button and link. It should be around the top right corner of the output image.
@@CodeCraftersCorner Actually I want to automatıcally download when comfyui finished every que, so download image one by one.
@AmerikaMeraklisi-yr2xe If the Gradio application is running locally on your machine, then you can use the Python Pillow library to save the image to your disk. However, if the app is running on a server, then you will have to manually download the images.
Here is the link to the Pillow library: bit.ly/47VOQCc
The project you explain in your video is very interesting. The only limitation I see is that you can only run the solution in LOCAL mode. Is there an option to deploy to a hosting service that supports Python, Gradio and GPU?
Thank you, @fernandodiaz8231! Yes, you can host ComfyUI on a server and set it up to get a public URL instead of the localhost one. Similarly, you can use Gradio public URL and the code will still works.
Thank you so much man, the session was very insightful and I was able to solve what I was intending to do. Good day.
You're very welcome. I'm glad the tutorial was helpful in solving what you intended to do. If you have more questions or topics you'd like me to cover, feel free to let me know. Have a fantastic day!
thanks, it very helpful but its gradio only work for 72h so how we make them available for 24*7 on the web, basically I want to make the web application so it should be accessed by anyone and any time on the web
Thanks for watching. Yes, when using gradio's public URL, there is a time limit restriction. You can look into setting up your own Share Server on your own cloud server to overcome this restriction. here is a great resource for sharing gradio app: bit.ly/3TQqjK7
@@CodeCraftersCorner hello sir I have tried some thing but I got way to much confused I request to provide the guides to on this please sir
Can you add paintbrush feature next? Thanks
Thank you, @MyDigitalHub, for the suggestion! While I don't have a paintbrush feature directly in this workflow, Gradio has an ImageEditor component which allows editing uploaded images when used as an input field. You can find more information in the official guide here: bit.ly/4ayH8kh. Hope this helps.
how to replicate what we have on comfyUI in python? instead of calling API
Hi @fintech1378! If you do not want to use the API, then you will have to implement the image generation with stable diffusion pipeline from HuggingFace. Of course, you will require handling tokenizing the text, loading and converting images to tensors and passing them over to the pipeline. Note that, you will not get the benefit of optimal loading of models that ComfyUI provide out to the box. That will have to be implemented manually. It is possible but too time consuming. If you are planning on doing everything from scratch, check out the documentation on HuggingFace website.
Thank you for this tutorial, it's super clear! Your approach is very interesting, you are sending the entire workflow json each time in a new payload. I never thought of doing it that way. I will be using radio buttons to basically assemble many parts of a complete prompt - so I will be changing the positive prompt in the json each time. I have a question however - I do plan to run this on cloud GPU's, I suppose I will need to select a service provider which let's me manage the storage/file system if I am to wrangle the output images. ps: I sent you an email offering some freelance work if you're open to it. Thanks again.
Hello @alpaykasal2902! Thank you, I replied to your email.
Yes, you will need the storage/file system.
Excellent!
Thank you, @seadude!
Super excellent.
👍
hmmm. Infinite while loops - nice
Thanks. You can also use Websockets which allows getting the intermediate preview images but you will have to use the same while loop.
Very nice! i am wondering if this is also possible directly from ComfyUI JS ?
Yes, you can use JS directly since it does support websockets.
@@CodeCraftersCorner yes, i mean that it is possible to build a very customized node with new widgets as user interface using JS. anyway, your videos are very good!
Hello, you may want to look into custom nodes then. To answer the question, yes, you can build new widgets.
do you think it possible to make a deepdream gradio
I cannot say for certain, @the_one_and_carpool! While I'm not familiar with deepdream, if it follows the input > process > output structure, creating a Gradio application should be possible. If the underlying workflow has multiple steps, consider adding buttons for each step or utilize Gradio tabs to keep things organized. Additionally, we have to consider whether making a standalone application or connecting the Gradio application with an API.
Very helpful, thanks
Did you try to get the result image via websocket?
Yes, websocket works as well and can retrieve the intermediate images like preview image nodes.
@@CodeCraftersCorner
Nice , can you make a tutorial about that?
i see many people asked about it
Hello, I made the tutorial. Here is the link: ruclips.net/video/kmZqoLJ2Dhk/видео.html
@@CodeCraftersCorner
Thank you very much
👍
Hello Sir! Your tutorials are amazing! I used comfyUI quite a lot and am very comfortable using it. This tutorial is next on my list but I also have a question. Is it possible to basically do the same thing but with a Mobile Application? I'm planning to create a simple yet fun Image worflow and would like to release it as a Mobile app. Would that be possible and if so, could you tell me what I would have to learn to get to that point?
Thank you, @beatemero6718. Yes, you can. At the end of the video, I show how to use the app on mobile. If you are making a native application, you will need to make you own ComfyUI API depending on the workflow used.
@@CodeCraftersCorner oh wow! Thank you for responding. I will watch the video to the end as soon as i have Time. Looking forward to it. 😁
👍
thx a lot
Glad it helped, @Herbstleid!
Hello Sharvin, is there anyway to check the network setting on gradio to see what information was sent via payload to the API (that generated the image)? I am trying to increment the seed in python so I can generate new images on every click generate action.
Hello Mehrad, yes, you can use your browser's developer's tool to check the network activities. This will give you the payload which Gradio is sending to the backend. This does not show you what is sent to ComfyUI. I have added a new file to the Github repo (link in video description). The file is called "example_with_random_seed.py" where you can take a look at how to manipulate the seed. You will need line 4 and 38. Make sure to change "3" to your node ID number.
Thank you, I took a look - I just used 'prompt["3"]["inputs"]["seed"] += 1'. Do you do any tutoring, I can pay you for pair programming.@@CodeCraftersCorner
...but it doesn't work if I enter the same prompt, only 1 image is generated
nevermind, I used 'with open("workflow_api.json", "w") as file_json:' after I increment the seed by 1, and it works now for some reason...
@mehradbayat9665 Glad you got it to work!
If I use "share=True" it doesn't work in both local and public URL's
Hello @mrleotheo! when you use share=True, you will get two URLs in the terminal. One is localhost and the other is a public URL provided by Gradio. If you want to use your public ip address, you will need to do additional setup. You can check the Gradio official documentation for that.
@@CodeCraftersCorner thank you for fast answer. I will check it more more carefully
@mrleotheo Here is the link with some solutions: bit.ly/3TQqjK7
@@CodeCraftersCorner thank you, I just try to sharing demo like in your video, but it doesn't work. Only white screen. If I add prevent_thread_lock=True - it shows "Killing tunnel"
@mrleotheo It might be some network firewall on your computer. Not sure exactly. Sorry!
Hello Sharvin, I don't know if my comment keeps getting deleted or I can't see it, anyway, I was wondering if you offer pair programming/tutor services. I am looking for 4 hours/twice a week, it would amount to $120/week, but I can negotiate if you are interested. You are an excellent teacher, would love to discuss further.
Hello Mehrad, Thank you so much for your kind words. I'm open to discussing the details further. Could you please send me an email at CodeCraftersCorner@gmail.com, so we can discuss the details; schedule, pricing, and any other specific requirements you may have.