Hello everyone, I am studying about Developing Web Interfaces for ROS, but in unit 5, I try showing the camera on the web page following to this course. I launch outside the course but no have camera display!.
Hi @nguyenphucvuongcdt ,
It is important to make sure you have the video stream running.
Do you have any errors in the console tab of your browser? Could you share it?
Regards
Thank you. I run turtlebot3_gazebo and have /camera/rgb/image_raw topic.
When I launch rosbrigde_websocket.laucnh:
Hi @nguyenphucvuongcdt ,
I see you have the message connected. Are you able to send commands to the robot?
If so, your rosbridge was launched successfully.
For the cameras, we have in chapter 6 the commands:
rosrun web_video_server web_video_server _port:=11315
You need this streaming server running as well, it comes apart from rosbridge.
Could you try running this and using one of the examples for the HTML/JS to embed the video images?
I launched it with default port:=8080 and had the same error.
What are you logging at line 99?
You have the output
0.0.0.0:9090/undefined
Seems like your are not passing the topic name properly?
@nguyenphucvuongcdt , could you share your whole code?
There are many different places where the web video streaming could break.
Thank you. My code is:
Hi @nguyenphucvuongcdt ,
At line number 100, can you try this:
let host = domain
Because /cameras is something specific to our platform.
You can even define let domain = 'localhost:8080', because along the course our provided address if dynamic, but yours will always be the same.
I tried it but not working
Thank you for the screenshot. It seems you are trying on your local computer but your launch file seems to be like the one in the course.
You can remove the arguments that sets the port number to 11315 and use its default confguration. (web_video_server - ROS Wiki)
rosrun web_video_server web_video_server
In the course we are just using this port due to our platform configuration.
Could you try the command without it?
it still not work…sad!
Do you have any logs to share?
- Check the develop tools, is there any connection being established?
- Do you have any errors in the console tab?
- Do you have any errors in the shell?
Can you access the address ?
http://0.0.0.0:8080/stream?topic=<topic_name>&type=mjpeg&width=300&height=200
Check the <topic_name> variable, it must be the image topic you want to subscribe
I accessed the address http://0.0.0.0:8080/stream?topic camera/rgb/image_raw&type=mjpeg&width=300&height=200 and it displayed the video. But in my webpage, the displaying video isn’t still working.
I just reviewed your code and it seems everything setup.
There must be something I didn’t detect. Can you try a simple example from the official documentation?
https://wiki.ros.org/web_video_server
https://wiki.ros.org/mjpegcanvasjs/Tutorials/CreatingASingleStreamCanvas
I tried using my code in this course and It work well. But outside this course didn’t still work.