@Firehead1971
I think it’s because WebRTC connection cannot be established in your network environment due to for example network topology, firewall, etc.
This issue comment might be a solution.
BTW, this is a frequently asked question, so I’m planning to write a document about it. → GitHub - whitphx/streamlit-webrtc: Real-time video and audio streams over the network, with Streamlit.
Hi,
I published a new tutorial for real-time video app development using streamlit-webrtc (on my new blog 
):
( Crosspost to dev.to: Developing web-based real-time video/audio processing apps quickly with Streamlit - DEV Community )
It’s now working, thank youuuu 
Hi everyone I need to mute and unmute the audio of the video streaming after making an action.
Any suggestions on how can I do this ?
@quiver99
How about this?
import streamlit as st
from streamlit_webrtc import webrtc_streamer, VideoHTMLAttributes
muted = st.checkbox("Mute")
webrtc_streamer(
key="mute_sample",
video_html_attrs=VideoHTMLAttributes(
autoPlay=True, controls=True, style={"width": "100%"}, muted=muted
),
)
You can configure the <video> element’s attribute via the video_html_attrs argument,
and the muted attribute switches mute/unmute on the client-side.
Note that other attributes such as autoPlay and style are specified too in the example above.
This default set of the video attribute values is used when nothing is provided for the video_html_attrs argument,
but if you override it, you have to explicitly provide these necessary attributes.
Thank for the reply @whitphx!
Any chance to do it without using checkboxs
Like calling it from a function or something like that
Thanks in advance
Hi everyone is there any chance to change the name of the start, stop and select device buttons ? I’m making an app in spanish and I need to translate the names and I’ve tried to change the name in the js file in the route \Lib\site-packages\streamlit_webrtc\frontend\build\static\js\main.2d1be7e6.js but when I deploy it to heroku the changes doesn’t save
How can i change it ?
Hi! I have a problem, when I try to exec this code the console shows transform() is deprecated. I implement recv, but when I change it my code doesn’t work anymore
class VideoTransformer(VideoTransformerBase):
@staticmethod
def transform_(img: np.array) -> np.array:
face_to_predict, list_ubications = prepara_imagen_array(img=img)
list_clases = get_predictions(face_to_predict=face_to_predict)
if len(list_clases) > 0:
for enum in range(len(list_clases)):
x, y, w, h = list_ubications[enum]
img = cv2.rectangle(img, (x, y), (x + w, y + h), color_dict[list_clases[enum]], 2)
img = cv2.rectangle(img, (x, y - 40), (x+w, y), color_dict[list_clases[enum]], -2)
img = cv2.putText(img, labels_dict[list_clases[enum]], (x, y - 10), cv2.FONT_HERSHEY_COMPLEX, 0.75,
(255, 255, 255), 1, cv2.LINE_AA)
return img, list_clases
def transform(self, frame):
img = frame.to_ndarray(format="bgr24")
img, list_clases = VideoTransformer.transform_(img=img)
return img
I tried to detect facial mask in persons like this
@whitphx any solution?
Hello, any help
When I try to start the camera on your demo site, it doesn’t load. My camera seems to be on but the camera is just loading and then resetting. and when I try whitphx website did the same
@quiver99
Using a checkbox is just an example, and the essential part is controlling the muted state via the variable.
So you should apply it to your code and use-case.
If you want to control it from a function, mutate the variable from it.
The session state may be helpful for that purpose.
import streamlit as st
from streamlit_webrtc import VideoHTMLAttributes, webrtc_streamer
if "muted" not in st.session_state:
st.session_state["muted"] = False
def callback():
st.session_state["muted"] = not st.session_state["muted"]
st.button("Toggle mute", on_click=callback)
muted = st.session_state["muted"]
webrtc_streamer(
key="mute_sample",
video_html_attrs=VideoHTMLAttributes(
autoPlay=True, controls=True, style={"width": "100%"}, muted=muted
),
)
@quiver99 Changing the button text is not supported now.
→ I created a ticket Make the button texts editable · Issue #730 · whitphx/streamlit-webrtc · GitHub . Please track it.
@Luxor5k
Post your full non-working code first to investigate the problem.
Without it, I only can suspect that you didn’t follow the change of the method signature from transform() to recv(). recv() has to return an instance of av.VideoFrame or av.AudioFrame, not np.ndarray.
See GitHub - whitphx/streamlit-webrtc: Real-time video and audio streams over the network, with Streamlit.
the app runs in my localhost,
when I try to run your app, don’t run
and when I deploy my project in streamlit, it creates a public ssh key in my repo in Github
I suspect you manipulated st.session_state inside recv(), which is not supported (See GitHub - whitphx/streamlit-webrtc: Real-time video and audio streams over the network, with Streamlit.).
Sorry, but I can’t support you any more with these little informative and hard-to-read questions.
I suggest you to follow How do I ask a good question? - Help Center - Stack Overflow, especially the “Help others reproduce the problem” section.
Hi everyone (and whitphx!)
First of all I am super amazed by your contribution to the streamlit community. I still haven’t come across a better alternative for manipulation video and classification! 
I am currently using streamlit-webrtc for reading barcode and it totally works! 
However as soon as I have detected a barcode I wish to have print the barcode like so st.subheader((“Detected barcode:” detected_barcode)), and then use barcode to fetch more information in a database etc. However I read that it’s hard to extract information from the webrtc_streamer object to global 
. Any ideas for a work around?
I could only come up with a complicated attempt, but I feel like it doesn’t need to be this complicated 
:
Note: For barcodes, it is extremely painful to only use single images as the detection rate is super low and you often have to take 4-5 images before anything is detected. Video solves this problem beautifully.
Here is my current code (without attempting to write to a SQL database)
import av
import cv2
import streamlit as st
from pyzbar.pyzbar import decode
from streamlit_webrtc import (webrtc_streamer, VideoProcessorBase,WebRtcMode)
def live_detection(play_state):
class BarcodeProcessor(VideoProcessorBase):
def __init__(self) -> None:
self.barcode_val = False
def BarcodeReader(self, image):
detectedBarcodes = decode(image)
if not detectedBarcodes:
print("\n No barcode! \n")
return image, False
else:
for barcode in detectedBarcodes:
(x, y, w, h) = barcode.rect
cv2.rectangle(image, (x-10, y-10),
(x + w+10, y + h+10),
(0, 255, 0), 2)
if detectedBarcodes[0] != "":
return image, detectedBarcodes[0]
def recv(self, frame: av.VideoFrame) -> av.VideoFrame:
image = frame.to_ndarray(format="bgr24")
annotated_image, result = self.BarcodeReader(image)
if result == False:
return av.VideoFrame.from_ndarray(image, format="bgr24")
else:
self.barcode_val = result[0]
play_state = False
return av.VideoFrame.from_ndarray(annotated_image, format="bgr24")
stream = webrtc_streamer(
key="barcode-detection",
mode=WebRtcMode.SENDRECV,
desired_playing_state=play_state,
video_processor_factory=BarcodeProcessor,
media_stream_constraints={"video": True, "audio": False},
async_processing=True,
)
play_state = True
detected_barcode = live_detection(play_state)
Okay my SQL was pretty bad. In other words, the while loop messed everything up haha
Update, I made a new solution work like ~25% but it’s very unstable and keeps crashing and introduces alot of lag. As you can see it correctly prints the barcode right after identification 
, and I can use it to access a DB and grap more information.
Here is the new code:
import av
import cv2
import time
import streamlit as st
from pyzbar.pyzbar import decode
from streamlit_webrtc import (webrtc_streamer, VideoProcessorBase,WebRtcMode)
st.set_page_config(layout="wide")
def live_detection(play_state):
c1, c2 = st.columns(2)
class BarcodeProcessor(VideoProcessorBase):
def __init__(self) -> None:
self.barcode_val = False
def BarcodeReader(self, image):
detectedBarcodes = decode(image)
if not detectedBarcodes:
print("\n No barcode! \n")
return image, False
else:
for barcode in detectedBarcodes:
(x, y, w, h) = barcode.rect
cv2.rectangle(image, (x-10, y-10),
(x + w+10, y + h+10),
(0, 255, 0), 2)
if detectedBarcodes[0] != "":
return image, detectedBarcodes[0]
def recv(self, frame: av.VideoFrame) -> av.VideoFrame:
image = frame.to_ndarray(format="bgr24")
annotated_image, result = self.BarcodeReader(image)
if result == False:
return av.VideoFrame.from_ndarray(annotated_image, format="bgr24")
else:
self.barcode_val = result[0]
return av.VideoFrame.from_ndarray(annotated_image, format="bgr24")
stream = webrtc_streamer(
key="barcode-detection",
mode=WebRtcMode.SENDRECV,
desired_playing_state=play_state,
video_processor_factory=BarcodeProcessor,
media_stream_constraints={"video": True, "audio": False},
async_processing=True,
)
while True:
if stream.video_processor.barcode_val != False:
barcode = stream.video_processor.barcode_val
print("FOUND")
c1.subheader(barcode)
del stream
play_state = True
possible_barcode = live_detection(play_state)
Hi @lorenzweb ,
Thank you for sharing your nice work!
As you came up with, polling with a while-loop and passing values via instance attributes are the only way to communicate from inside to outside the callback with the current API design of streamlit-webrtc.
Just to confirm; so now everything is ok?
These cookies are necessary for the website to function and cannot be switched off. They are usually only set in response to actions made by you which amount to a request for services, such as setting your privacy preferences, logging in or filling in forms.
These cookies allow us to count visits and traffic sources so we can measure and improve the performance of our site. They help us understand how visitors move around the site and which pages are most frequently visited.
These cookies are used to record your choices and settings, maintain your preferences over time and recognize you when you return to our website. These cookies help us to personalize our content for you and remember your preferences.
These cookies may be deployed to our site by our advertising partners to build a profile of your interest and provide you with content that is relevant to you, including showing you relevant ads on other websites.