# Ionic 4 development - Blank screen in place of video

**URL:** <https://openvidu.discourse.group/t/ionic-4-development-blank-screen-in-place-of-video/106>\
**Category:** Issues developing apps\
**Tags:** v2\
**Created:** [January 31, 2020, 5:54pm UTC](https://openvidu.discourse.group/t/ionic-4-development-blank-screen-in-place-of-video/106 "2020-01-31T17:54:54Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Onkar\_Kore](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/onkar_kore/32/70_2.png) [@Onkar\_Kore](https://openvidu.discourse.group/u/Onkar_Kore)\
**Post date:** [January 31, 2020, 5:54pm UTC](https://openvidu.discourse.group/t/ionic-4-development-blank-screen-in-place-of-video/106/1 "2020-01-31T17:54:54Z")

</div>

I tried to mimic the ionic4 sample demo app. I don’t see any issues with the console log. But I am not able to see any video frame on the browser. I can see the video HTML element which has exactly the same property as a demo app.

Console log

```auto
'OpenVidu' initialized
OpenVidu.js:69 openvidu-browser version: 2.11.0
setting-up-modal.component.ts:119 initialize publisher
StreamManager.js:218 New video element associated to Publisher
StreamManager.js:79 Your local 'Stream' with id [undefined] video is now playing
OpenVidu.js:68 'OpenVidu' initialized
OpenVidu.js:69 openvidu-browser version: 2.11.0
stream.component.ts:21 user UserModel {connectionId: "", nickname: "", streamManager: Publisher, type: "local", audioActive: true, …}
StreamManager.js:218 New video element associated to Publisher {videos: Array(2), lazyLaunchVideoElementCreatedEvent: false, ee: EventEmitter, stream: Stream, remote: false, …}
openvidu.service.ts:47 {id: "onkar", createdAt: 1580492444665}
openvidu.service.ts:71 {id: "wss://demos.openvidu.io:4443?sessionId=onkar&token…=2.11.0&turnUsername=KI23JD&turnCredential=anicau", session: "onkar", role: "PUBLISHER", data: "", token: "wss://demos.openvidu.io:4443?sessionId=onkar&token…=2.11.0&turnUsername=KI23JD&turnCredential=anicau"}
Session.js:1037 TURN temp credentials [KI23JD:anicau]
Session.js:1046 openvidu-server version: 2.11.0
Connection.js:52 'Connection' created (local)
Stream.js:587 'Publisher' successfully published to session
Session.js:656 New signal: {"data":"{\"avatar\":\"https://randomuser.me/api/portraits/thumb/lego/4.jpg\"}","from":"4wc23ofjvc9chso0","type":"signal:userChanged"}
Session.js:471 Event 'signal:userChanged' triggered by 'Session' SignalEvent {hasBeenPrevented: false, cancelable: false, target: Session, type: "signal:userChanged", data: "{"avatar":"https://randomuser.me/api/portraits/thumb/lego/4.jpg"}", …}

```

---

<div class="post-metadata">

**Author:** ![CSantosM](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/csantosm/32/16_2.png) [@CSantosM](https://openvidu.discourse.group/u/CSantosM)\
**Post date:** [January 31, 2020, 6:28pm UTC](https://openvidu.discourse.group/t/ionic-4-development-blank-screen-in-place-of-video/106/2 "2020-01-31T18:28:01Z")

</div>

Hello,

Could you tell us what platform (Android or iOS) are you using?

Have you run [openvidu-call-ionic](https://github.com/OpenVidu/openvidu-call-ionic) and do you have the same behaviour or everything is working fine?

Have you read and follow the [openvidu-ionic](https://openvidu.io/docs/tutorials/openvidu-ionic/) tutorial?

Regards

---

<div class="post-metadata">

**Author:** ![Onkar\_Kore](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/onkar_kore/32/70_2.png) [@Onkar\_Kore](https://openvidu.discourse.group/u/Onkar_Kore)\
**Post date:** [February 1, 2020, 3:48am UTC](https://openvidu.discourse.group/t/ionic-4-development-blank-screen-in-place-of-video/106/3 "2020-02-01T03:48:36Z")

</div>

Hello,

I am running it on google chrome with ionic serve. Not tested on real devices yet.  
Here are my observations

Demo app -

1. Pointing to [https://demos.openvidu.io](https://demos.openvidu.io)
  - Running fine with

2. Pointing to my developement server running docker image
  - Only caller video is visible not able to view receiver video

Sample app that I am building

1. Pointing to [https://demos.openvidu.io](https://demos.openvidu.io)
  - Not able to see caller and recevier both videos
  - But console logs looks good show caller and recevier video stream

2. Pointing to my developement server
  - Not able to see caller and recevier both videos
  - But console logs looks good show caller and recevier video stream

## Sample logs -

```auto
New signal: {"data":"{}","from":"gys9agz91auq7cbw","type":"signal:userChanged"}
Session.js:471 Event 'signal:userChanged' triggered by 'Session' SignalEvent {hasBeenPrevented: false, cancelable: false, target: Session, type: "signal:userChanged", data: "{}", …}
Session.js:191 Subscribed correctly to gys9agz91auq7cbw
stream.component.ts:21 user UserModel {connectionId: "gys9agz91auq7cbw", nickname: "OpenVidu_User8980", streamManager: Subscriber, type: "remote", audioActive: true, …}
StreamManager.js:218 New video element associated to Subscriber {videos: Array(1), lazyLaunchVideoElementCreatedEvent: false, ee: EventEmitter, stream: Stream, remote: true, …}
Session.js:656 New signal: {"data":"{\"avatar\":\"https://randomuser.me/api/portraits/thumb/lego/0.jpg\"}","from":"jdt7nyfi6tr9dlzy","type":"signal:userChanged"}
Session.js:471 Event 'signal:userChanged' triggered by 'Session' SignalEvent {hasBeenPrevented: false, cancelable: false, target: Session, type: "signal:userChanged", data: "{"avatar":"https://randomuser.me/api/portraits/thumb/lego/0.jpg"}", …}
Session.js:656 New signal: {"data":"{\"avatar\":\"https://randomuser.me/api/portraits/thumb/lego/4.jpg\"}","from":"gys9agz91auq7cbw","type":"signal:userChanged"}
Session.js:471 Event 'signal:userChanged' triggered by 'Session' SignalEvent {hasBeenPrevented: false, cancelable: false, target: Session, type: "signal:userChanged", data: "{"avatar":"https://randomuser.me/api/portraits/thumb/lego/4.jpg"}", …}
StreamManager.js:88 Remote 'Stream' with id [gys9agz91auq7cbw_CAMERA_VOELO] video is now playing
StreamManager.js:101 Event 'streamPlaying' triggered by 'Subscriber' StreamManagerEvent {hasBeenPrevented: false, cancelable: false, target: Subscriber, type: "streamPlaying", value: undefined}

```

---

<div class="post-metadata">

**Author:** ![Onkar\_Kore](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/onkar_kore/32/70_2.png) [@Onkar\_Kore](https://openvidu.discourse.group/u/Onkar_Kore)\
**Post date:** [February 3, 2020, 4:55am UTC](https://openvidu.discourse.group/t/ionic-4-development-blank-screen-in-place-of-video/106/4 "2020-02-03T04:55:54Z")

</div>

Any update on this issue?

---

<div class="post-metadata">

**Author:** ![CSantosM](https://yyz2.discourse-cdn.com/free1/user_avatar/openvidu.discourse.group/csantosm/32/16_2.png) [@CSantosM](https://openvidu.discourse.group/u/CSantosM)\
**Post date:** [February 4, 2020, 10:39am UTC](https://openvidu.discourse.group/t/ionic-4-development-blank-screen-in-place-of-video/106/5 "2020-02-04T10:39:34Z")

</div>

Hello,  
We’ll check it out launching our demo app inside of a docker container with OpenVidu Server.

Anyway, if openvidu-ionic works at first point and you are not able to connect your app to our server deployed on [https://demos.openvidu.io](https://demos.openvidu.io/), you should check it out your code.

Have you read and follow the [openvidu-ionic](https://openvidu.io/docs/tutorials/openvidu-ionic/) tutorial?

Regards