# How to setup mediasoup-client on React?

**URL:** <https://mediasoup.discourse.group/t/how-to-setup-mediasoup-client-on-react/3971>\
**Category:** mediasoup libraries\
**Created:** [February 22, 2022, 5:58am UTC](https://mediasoup.discourse.group/t/how-to-setup-mediasoup-client-on-react/3971 "2022-02-22T05:58:25Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![parthroy](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/parthroy/32/1488_2.png) [@parthroy](https://mediasoup.discourse.group/u/parthroy)\
**Post date:** [February 22, 2022, 5:58am UTC](https://mediasoup.discourse.group/t/how-to-setup-mediasoup-client-on-react/3971/1 "2022-02-22T05:58:25Z")

</div>

Hello,  
I have two problems related to mediasoup-client.

1. I am not able to set up a mediasoup-client in the existing react app.
2. If I used [GitHub - versatica/mediasoup-demo: mediasoup official demo application](https://github.com/versatica/mediasoup-demo.git) then I am not able to do WebSocket in another IP. Seem like I host a server on the same network and run the client in that same network but I got WebSocket connection failed.

---

<div class="post-metadata">

**Author:** ![ndotie](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/ndotie/32/1447_2.png) [@ndotie](https://mediasoup.discourse.group/u/ndotie)\
**Post date:** [February 22, 2022, 11:29am UTC](https://mediasoup.discourse.group/t/how-to-setup-mediasoup-client-on-react/3971/2 "2022-02-22T11:29:28Z")

</div>

> [@parthroy](#):
>
> I am not able to set up a mediasoup-client in the existing react app.

Yes you can, you just install mediasoup-client just like a normal package, just as you may do to install `moment.js` 😉

```auto
npm install mediasoup-client@3 --save

```

as per official docs

and use it as  
`import { Device } from 'mediasoup-client'`

---

<div class="post-metadata">

**Author:** ![ndotie](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/ndotie/32/1447_2.png) [@ndotie](https://mediasoup.discourse.group/u/ndotie)\
**Post date:** [February 22, 2022, 11:31am UTC](https://mediasoup.discourse.group/t/how-to-setup-mediasoup-client-on-react/3971/3 "2022-02-22T11:31:23Z")

</div>

> [@parthroy](#):
>
> If I used [GitHub - versatica/mediasoup-demo: mediasoup official demo application](https://github.com/versatica/mediasoup-demo.git) then I am not able to do WebSocket in another IP. Seem like I host a server on the same network and run the client in that same network but I got WebSocket connection failed.

Am sure connection failed due to some other conditions, but not as you mentioned above,  
mybe you should try to describe this problem more

---

<div class="post-metadata">

**Author:** ![parthroy](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/parthroy/32/1488_2.png) [@parthroy](https://mediasoup.discourse.group/u/parthroy)\
**Post date:** [February 22, 2022, 11:32am UTC](https://mediasoup.discourse.group/t/how-to-setup-mediasoup-client-on-react/3971/4 "2022-02-22T11:32:40Z")

</div>

What is the config for the Device from mediasoup-client?

---

<div class="post-metadata">

**Author:** ![ndotie](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/ndotie/32/1447_2.png) [@ndotie](https://mediasoup.discourse.group/u/ndotie)\
**Post date:** [February 22, 2022, 11:37am UTC](https://mediasoup.discourse.group/t/how-to-setup-mediasoup-client-on-react/3971/5 "2022-02-22T11:37:20Z")

</div>

After importing Device you use it as mediasoup to connect to mediasoup serverside  
mostly you’ll create a worker then router and ask that router for dtlsParameter. and you put those parameter to your device,  
docs just explained all this

[[WebRTC: mediasoup (SFU) introduction - Part 1 - YouTube](https://www.youtube.com/watch?v=DOe7GkQgwPo&t=208s)]([https://Check](https://Check) this intro)

---

<div class="post-metadata">

**Author:** ![parthroy](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/parthroy/32/1488_2.png) [@parthroy](https://mediasoup.discourse.group/u/parthroy)\
**Post date:** [February 22, 2022, 11:38am UTC](https://mediasoup.discourse.group/t/how-to-setup-mediasoup-client-on-react/3971/6 "2022-02-22T11:38:55Z")

</div>

Let’s, understand by the example.

I have server(1) asset where server host with IP 192.1XX.XX.12 and port 4443.  
and I have a client(2) asset where I developed a client app where client IP 192.1XX.XX.25 and port 3000.  
So the problem is in the client app I am not able to get a connection to the websocket which hosts the client(2) asset.

Both assets are in the same network.

---

<div class="post-metadata">

**Author:** ![parthroy](https://yyz2.discourse-cdn.com/free1/user_avatar/mediasoup.discourse.group/parthroy/32/1488_2.png) [@parthroy](https://mediasoup.discourse.group/u/parthroy)\
**Post date:** [February 22, 2022, 11:43am UTC](https://mediasoup.discourse.group/t/how-to-setup-mediasoup-client-on-react/3971/7 "2022-02-22T11:43:12Z")

</div>

Thanks for the link.  
do you have a config file or code?
