miroslavpejic85/mirotalkc2c

✨WebRTC - C2C - Real-time cam-2-cam video calls & screen sharing, end-to-end encrypted, to embed in any website with a simple iframe.

MiroTalk C2C

Free WebRTC Real-Time Cam-2-Cam Video Calls & Screen Sharing, End-to-End Encrypted, to embed in any website with a simple iframe.

---

Explore MiroTalk C2C

---

---

Join our community for questions, discussions, and support on Discord

---

Quick start

Install NodeJs.

# Copy .env.template in .env and edit it if needed
$ cp .env.template .env
# Install dependencies
$ npm install
# Start the server
$ npm start

Open http://localhost:8080 in your browser.

Docker

Repository: Docker hub

Install docker and docker-compose.

# Copy .env.template in .env and edit it if needed
$ cp .env.template .env
# Copy docker-compose.template.yml in docker-compose.yml and edit it if needed
$ cp docker-compose.template.yml docker-compose.yml
# Get official image from Docker Hub
$ docker pull mirotalk/c2c:latest
# Create and start containers
$ docker-compose up

Open http://localhost:8080 in your browser.

Documentations

• Ngrok/HTTPS: You can start a video conference directly from your local PC and make it accessible from any device outside your network by following these instructions, or expose it directly on HTTPS.

• Stun/Turn: Install your own Stun & Turn by following this instructions.

• Self-hosting: For self-hosting MiroTalk C2C on your own dedicated server, please refer to this comprehensive guide. It will provide you with all the necessary instructions to get your MiroTalk C2C instance up and running smoothly.

• Rest API: The API documentation uses swagger at http://localhost:8080/api/v1/docs or check it on live here.

  # The response will give you a entrypoint / Room URL for your meeting.
  $ curl -X POST "http://localhost:8080/api/v1/meeting" -H "authorization: mirotalkc2c_default_secret" -H "Content-Type: application/json"
  $ curl -X POST "https://c2c.mirotalk.com/api/v1/meeting" -H "authorization: mirotalkc2c_default_secret" -H "Content-Type: application/json"
  # The response will give you a entrypoint / URL for the direct join to the meeting.
  $ curl -X POST "http://localhost:8080/api/v1/join" -H "authorization: mirotalkc2c_default_secret" -H "Content-Type: application/json" --data '{"room":"test","name":"mirotalkc2c"}'
  $ curl -X POST "https://c2c.mirotalk.com/api/v1/join" -H "authorization: mirotalkc2c_default_secret" -H "Content-Type: application/json" --data '{"room":"test","name":"mirotalkc2c"}'

Hetzner & Contabo

This application is running for demonstration purposes on Hetzner, one of the best cloud providers and dedicated root servers.

---

Use my personal link to receive €⁠20 IN CLOUD CREDITS.

---

Experience also top-tier German web hosting – dedicated servers, VPS, and web hosting at unbeatable prices. Reliable, secure, and backed by 24/7 support. Explore now here

---

To set up your own instance of MiroTalk C2C on a dedicated cloud server, please refer to our comprehensive self-hosting documentation. This guide will walk you through the process step by step, ensuring a smooth and successful deployment.

Support

Do you find MiroTalk C2C indispensable for your needs? Join us in supporting this transformative project by becoming a backer or sponsor. By doing so, not only will your logo prominently feature here, but you'll also drive the growth and sustainability of MiroTalk C2C. Your support is vital in ensuring that this valuable platform continues to thrive and remain accessible for all. Make an impact – back MiroTalk C2C today and be part of this exciting journey!

License

MiroTalk C2C is free and open-source under the terms of AGPLv3 (GNU Affero General Public License v3.0). Please respect the license conditions, In particular modifications need to be free as well and made available to the public. Get a quick overview of the license at Choose an open source license.

To obtain a MiroTalk C2C license with terms different from the AGPLv3, you can conveniently make your purchase on CodeCanyon. This allows you to tailor the licensing conditions to better suit your specific requirements.

Diving into Additional MiroTalk Projects:

MiroTalk SFU

Try also MiroTalk SFU selective forwarding unit real-time video conferences, optimized for large groups. Unlimited time, unlimited concurrent rooms each having 8+ participants, up to ~ 100 per single CPU.

MiroTalk P2P

Try also MiroTalk P2P peer to peer real-time video conferences, optimized for small groups. Unlimited time, unlimited concurrent rooms each having 5-8 participants.

MiroTalk BRO

Try also MiroTalk BRO Live broadcast (peer to peer) live video, audio and screen stream to all connected users (viewers). Unlimited time, unlimited concurrent rooms each having a broadcast and many viewers.

MiroTalk WEB

Try also MiroTalk WEB a platform that allows for the management of an unlimited number of users. Each user must register with their email, username, and password, after which they gain access to their personal dashboard. Within the dashboard, users can manage their rooms and schedule meetings using the desired version of MiroTalk on a specified date and time. Invitations to these meetings can be sent via email, shared through the web browser, or sent via SMS.

---

mirotalkc2c's Issues

how to set videosource explicitly ?

hi ! thanks for sharing amazing project.

i`m on raspberry pi and i want to start up not only with usb-camera (everything works with c270 logitech).
my path to csi camera looks like - device: /base/soc/i2c0mux/i2c@1/ov5647@36
and i do not know how to add it to videosources.

as far as i see the main file is - mirotalkc2c/frontend/js/client.js
and there i see:

navigator.mediaDevices.enumerateDevices().then((devices) => {
                videoDevices = devices.filter(
                    (device) => device.kind === 'videoinput' && device.deviceId !== 'default',
                );

how to add my device explicitly ?

Iframe available options

Using the iframe so that the user drops into a preset room name would be useful. Currently it seems that one must include a username in such a preset url in the iframe, which isn't ideal. Any pointers or approach to how one does this is appreciated.
mahalo from Mauna Loa

RFE: configurable video resolution and framerate

It seems the default video constraints are 1280x720@30 and there is an option to set 3840x2160@60. Some computers are too noisy even when encoding at 1280x720 (e.g. firefox not using HW acceleration). It would be nice if the resolution and framerate could be set directly in the UI.

how to rotate video ? [SOLVED]

as i have camera 90 output i have to rotate video output.
at start i think of using another js script to access html element by id and change it:

 // Access DOM element object
const rotated = document.getElementById('rotated');
// Rotate element by 90 degrees clockwise
rotated.style.transform = 'rotate(90deg)';

but it doesnt work.

later i found the solution.
just need to add
transform: rotate(90deg);
to
/home/pi/mirotalkc2c/frontend/css/client.css
in section:

.myVideoWrap {
    position: absolute;
    transform: rotate(90deg);
    z-index: 5;
    top: 10px;
    left: 10px;
    width: var(--my-video-wrap-width);
    height: var(--my-video-wrap-height);
    border: var(--border);
    border-radius: var(--border-radius);
}

here we are!

About encryption

What encryption method is used for end-to-end encryption? In which file?

Audio Indicator

Kudos on a simplified and exceptional way to do this! To me anyway, a mesh approach feels a lot better than wrestling with a SFU and the rest. Particularly in terms of audio-only connections, it would be great to have access to the magic sauce of the speaker's audio signal lighting like in mirotalk, or better yet, in the clubhouse fashion. As you have kept it in vanilla js maybe I can figure it out. Any pointers are much appreciated. Thanks for sharing your fine work!

function roomIsBusy

I assume that tweaking (roomPeersCount > 2) to any number that may perform acceptably (my use-case might be audio-only mesh, which would seem to perform well enough for up to at least 8?)
Still, I'm wondering what value was being considered when this governer was coded in. Could be insightful. thanks

iOS and Firefox - GetUserMedia Error

Error

• I noticed on iOS c2c.mirotalk.com that the GetUserMedia request fails and causes an error. And never requests camera or microphone permissions. The browser is not aware of the camera or microphone permissions either before this error happens.

GetUserMedia - Meet needs access to the camera and microphone. Click the locked camera and microphone icon in your browser's address bar, before joining room and NotAllowedError: The request is nt allowed by the user agent or the platform in the current context, possibly because the user denied permission.

Reproduce:

• Grab an iOS device
• Firefox
• c2c.mirotalk.com or any self-hosted setup w/ latest commits
• Enter Any Room name and username.
• See screenshot attached.

Fix Ideas

• I thought this would have been related to the /socket-io websocket not being properly forwarded. But that is not the case and websockets are setup as per the readme at docs.mirotalk.com
• MiroTalk P2P works fine on same iOS device with Firefox. There must be compatibility code not copied from P2P to C2C repository.

Notes:

• These reproduction steps work fine on same iOS device with Safari app. Must be an issue with Firefox compatibility.
• MiroTalk P2P works fine on same iOS device with Firefox. There must be compatibility code not copied from P2P to C2C repository.
• Works fine on Android and Google Chrome app.

Work around:

• Use Safari app on iOS device

ngrok use on raspberry pi

hi !
u tried ngrok to access local raspberry pi with grey IP. i seems connection established

but i do not see any video-audio of a client. I see only myself in mirotalkc2c.

In local net - everything is OK.

to check this out:
i followed steps https://docs.mirotalk.com/mirotalk-c2c/ngrok/
but got start it working like follows:

start ngrok:
ngrok http https://localhost:8080

in ~/mirotalkc2c
npm start 

start browser
libcamerify firefox -new-window https://localhost:8080/join?room=test&name=a

what is going wrong ?

No way to configure empty iceServers

If my clients can connect directly to each other and I want to avoid using STUN/TURN servers, it seems iceServers needs to be set to an empty array. It would be nice if that was possible just by editing the .env file and not the source code. Currently it's hardcoded to contain a STUN and TURN server.

Feature Request - Version Stamp .env_template

Makes it easier to work out when we need to update our working .env.

At the moment, I diff my working .env and the new .env_template each time I pull a new version which takes time as my working file is heavily modified with other stuff for my integration setup.

This would also apply to P2P and SFU's app/src/config.template.js