Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/alvinwan/webopencv
Python package for accessing your webcam with a 1-click Glitch setup, without installing anything locally. Streams client-side video to a server-side Python script.
https://github.com/alvinwan/webopencv
Last synced: 2 months ago
JSON representation
Python package for accessing your webcam with a 1-click Glitch setup, without installing anything locally. Streams client-side video to a server-side Python script.
- Host: GitHub
- URL: https://github.com/alvinwan/webopencv
- Owner: alvinwan
- License: bsd-2-clause
- Created: 2021-09-07T22:50:41.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2021-09-15T11:18:05.000Z (over 3 years ago)
- Last Synced: 2024-10-12T13:44:36.971Z (3 months ago)
- Language: JavaScript
- Homepage: https://webopencv.glitch.me
- Size: 91.8 KB
- Stars: 8
- Watchers: 2
- Forks: 3
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# webopencv · [demo](https://webopencv.glitch.me) · [1-click setup](https://glitch.com/edit/#!/remix/webopencv)
Stream webcam from a webpage to a server-side OpenCV Python script. This **gives you the ability to work with a webcam in Python, without installing anything on your computer**.
🎥 Live demo: [webopencv.glitch.me](https://webopencv.glitch.me)
👉 1-click WebOpenCV Setup: [Fork on Glitch](https://glitch.com/edit/#!/remix/webopencv)
💻 View demo source: [on Glitch](https://glitch.com/edit/#!/webopencv) or [on Github](https://github.com/alvinwan/webopencv/tree/main/demo)
created by [Alvin Wan](https://alvinwan.com), for an online computer vision tutorial
## Why Use WebOpenCV?
WebOpenCV makes it easy for anyone to start working with their own webcam, in Python. Before WebOpenCV, you would need to (1) install packages, their package managers, and miscellaneous tools *on your own computer*, then (2) pray that webcam access worked. Now, you simply click once to launch a free, remote server that comes pre-setup. No installation on your own computer necessary.
## Getting Started
**For the 1-click WebOpenCV setup, [fork on Glitch](https://glitch.com/edit/#!/remix/webopencv).**
Alternatively, to setup locally on your machine instead, install the Python package.
```bash
pip install webopencv
```
Create a new file `app.py`.
```python
import webopencv as wcv
app = wcv.WebApplication()
@app.transform('Hello')
def helloworld(img, frame):
return img
if __name__ == '__main__':
app.run()
```
Then, run the file.
```bash
python app.py
```
This launches a web server by default at `https://localhost:8080`. Navigate to that URL, and hit "Start" to see the demo in action. Note: When developing locally, navigating to `https://0.0.0.0:8080` won't work. Make sure to use `localhost`.
## Transforms
Create *transforms*, or hooks that process images in a real-time video feed. Each transform takes in an
1. `img`: numpy array image
2. `frame`: `VideoFrame` object that additionally contains metadata, like time
Like with Flask routes, you can register transforms using a decorator. Add whatever processing you would like to the transform, and return the image at the end. For example, the below adds a "cinematic" crop to the live feed, by adding black bars.
```python
@app.transform('Cinematic')
def cinematic(img, frame):
h, w, _ = img.shape
img[-w//4:] = 0
img[:w//4] = 0
```
**Default Transform**: Use `default=True` in the `transform` decorator to set a transform as the default on page load. Note that only 1 transform can be set as default. If no transform has `default=True` set, the default is no transform on page load.
## Customize Homepage
To build a custom homepage:
1. Initialize the app *without* the default homepage. You can use either the `aiohttp` or `Flask` backends.
2. Add your own homepage with:
- WebOpenCV's client-side Javascript: ``
- a `video` tag with `id="video"`, for the webcam feed: ``
- a `button` tag with `id="action"`, for "Start" and "Stop": ``
**aiohttp**: The default backend uses `aiohttp`, so you can treat `app` as you would any other `web.Application` object.
```python
from aiohttp import web
import webopencv as wcv
app = wcv.WebApplication(use_default_homepage=False)
html = """
Custom webpage
"""
def index(app):
return web.Response(text=html, content_type="text/html")
if __name__ == '__main__':
app.router.add_get_url('/', index)
app.run()
```
**Flask**: You can alternatively use the Flask backend, treating the `app` as you would any other `Flask` object. *Note that the Flask implementation drops the ICE connection. Needs debugging.*
```python
import webopencv as wcv
app = wcv.Flask(use_default_homepage=False)
@app.route("/")
def index():
return """
Custom webpage
"""
if __name__ == '__main__':
app.run()
```
*Acknowledgments: This library was built off of the `aiortc` official server example.*