LIVE STREAMING .. (with Python and HTML)
LIVE STREAMING ..
Create a main.py file in the directory named live_streaming ..
The code for main.py
# pip install flask
# pip install opencv-python
from flask import Flask, render_template, Response
import cv2
app = Flask(__name__)
camera = cv2.VideoCapture(0)
def gen_frames():
while True:
success, frame = camera.read()
if not success:
break
else:
ret, buffer = cv2.imencode('.jpg', frame)
frame = buffer.tobytes()
yield (b'--frame\r\n'
b'Content-Type: image/jpeg\r\n\r\n' + frame + b'\r\n')
@app.route('/')
def index():
return render_template('index.html')
@app.route('/video_feed')
def video_feed():
return Response(gen_frames(), mimetype='multipart/x-mixed-replace; boundary=frame')
if __name__ == "__main__":
app.run(debug=True)
Create a directory named templates ...
and create an HTML file named index.html in the templates directory
The structure of the file looks like this ..
The code for index.html
<body>
<div class="container">
<div class="row">
<div class="col-lg-8 offset-lg-2">
<h1 class="mt-5">Live Video Streaming</h1>
<h2 class="mt-5">A streaming website from live camera</h2>
<img src="{{ url_for('video_feed') }}" width="100%">
</div>
</div>
</div>
<style>
body {
background-color: #212121;
color: white
}
</style>
</body>
Run main.py ..
And the output for the following , if you check the link that your flask gives you ..
It is your localhost : http://127.0.0.1:5000/
....................................................................................................................................................................
To create a geo-locator in HTML ...
https://codeddevil-01blogs.blogspot.com/2021/06/geolocation-in-html.html
To create an analog clock ...
https://codeddevil-01blogs.blogspot.com/2021/06/clock-development-part-1-in-html.html
Comments
Post a Comment