comfyui-web-viewer

comfyui-web-viewer

ComfyUI custom nodes and web utilities for real-time AI generation and interaction

Stars: 169

Visit
 screenshot

The ComfyUI Web Viewer by vrch.ai is a real-time AI-generated interactive art framework that integrates realtime streaming into ComfyUI workflows. It supports keyboard control nodes, OSC control nodes, sound input nodes, and more, accessible from any device with a web browser. It enables real-time interaction with AI-generated content, ideal for interactive visual projects and enhancing ComfyUI workflows with efficient content management and display.

README:

ComfyUI Web Viewer

The ComfyUI Web Viewer by vrch.ai is a custom node collection offering a real-time AI-generated interactive art framework. This utility integrates realtime streaming into ComfyUI workflows, supporting keyboard control nodes, OSC control nodes, sound input nodes, and more. Accessible from any device with a web browser, it enables real time interaction with AI-generated content, making it ideal for interactive visual projects and enhancing ComfyUI workflows with efficient content management and display.

✨ Features:

  • Real-Time AI Generation & Interaction: Immediate response for interactive creativity.
  • Multi-Input Support: Easily integrates keyboard, OSC, and audio input for versatile interactivity.
  • Universal Web Accessibility: Compatible with any device equipped with a web browser.

🚀 Support Us:

If you find the ComfyUI Web Viewer useful or inspiring, consider supporting us:

  • 💖 Sponsor: Help us maintain and enhance the project through GitHub Sponsors.
  • Star the Project: A star on GitHub greatly motivates us and helps increase visibility!
  • 📩 Business Inquiries: For commercial collaborations, reach us at [email protected].

Changelog

see CHANGELOG

Installation

Method 1: Auto Installation (Recommended)

Simply search for ComfyUI Web Viewer in ComfyUI Manager and install it directly.

Method 2: Manual Installation

  1. Clone this repo into the custom_nodes directory of ComfyUI
    git clone [email protected]:VrchStudio/comfyui-web-viewer.git
    
  2. Install dependencies:
    pip install -r requirements.txt
    
    or if you use the windows portable install, run this in ComfyUI_windows_portable folder:
    python_embeded\python.exe -m pip install -r ComfyUI\custom_nodes\comfyui-web-viewer\requirements.txt
    
  3. Restart ComfyUI

How to Use

Web Viewer Nodes

WebSocket Web Viewer Nodes

OSC Control Nodes

Key Control Nodes

Audio Nodes

Image Nodes

Text Nodes

Other Example Workflows

Troubleshootings

1. Image Not Displayed in Popped-Up Image Viewer Window

For Chrome, you may need to add the ComfyUI server's IP address manually in chrome://flags/#unsafely-treat-insecure-origin-as-secure to enable access to the content. For other browsers, an http-to-http setup should allow for seamless access without additional configuration.


2. How can I resolve the CORS policy error when trying to display images?

If you’re encountering a CORS policy error with a message like this:

"origin 'https://vrch.ai' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource"

or

"WARNING: request with non matching host and origin 127.0.0.1 !=vrch.ai, returning 403"

you can resolve this by launching the ComfyUI service with the --enable-cors-header flag appended. For example:

python main.py --enable-cors-header

For additional details, refer to this discussion on GitHub.


3. Why can’t the ComfyUI service run at HTTPS/TLS/SSL on port 8189?

ComfyUI Web Viewer provides a build-in, self-signed certificate (intended for development only, not production use). To launch the ComfyUI service with HTTPS enabled on port 8189, use the following command:

# Start ComfyUI with HTTPS using the built-in certificate and key
python main.py --tls-keyfile ./custom_nodes/comfyui-web-viewer/https/key.pem --tls-certfile ./custom_nodes/comfyui-web-viewer/https/cert.pem --port 8189 --listen

For more details, refer to the ComfyUI official instructions.

Version Update

This project uses bump2version for version management. To update the version:

  1. Ensure you have bump2version installed:
    pip install bump2version
  2. To update the version, run:
    python update_version.py [major|minor|patch]
    Replace [major|minor|patch] with the part of the version you want to increment.
  3. This will automatically:
    • Update the version number in __init__.py
    • Update the CHANGELOG.md file
    • Create a new git commit and tag (if you're using git)
  4. After running the script, review and update the CHANGELOG.md file with details about the new version's changes.
    • Note: make sure you've put changes in Unreleased section manually

Contributing

Created and maintained by the vrch.io team.

Contributions are welcome! Please feel free to submit a Pull Request.

Contact Us

For any inquiries, you can contact us at [email protected].

Star History

Star History Chart

License

MIT License

For Tasks:

Click tags to check more tools for each tasks

For Jobs:

Alternative AI tools for comfyui-web-viewer

Similar Open Source Tools

For similar tasks

For similar jobs