Video tag is not rendering - not playing

Ionic Framework ionic-v3
1

I am creating a social media app and when we are loading images it works fine.

when loading videos from cloudinary on the android i see this for a long time and then the video starts to play after a really long time of having the app open

VideoIssue

the images work fine but the video is stuck like so for the longest time and many times never renders. Cloudinary URL is a public url like so…http://res.cloudinary.com/http-communities-me/video/upload/v1504984703/nvbokoewffirdejgqguj.mp4

below is the code i am using

  <video controls="controls" preload="metadata" autoplay muted webkit-playsinline="webkit-playsinline" class="videoPlayer"
      (click)="openComments('Video')">
      <source src="{{PostMediaURL}}" type="video/mp4" />
    </video>

i am inside a infinite scroll plugin from ionic need help in rendering videos properly, what can i try?

2

This code is working on my side.
Maybe this will help you

<video height="100%" width="100%" controls="controls" preload="auto" webkit-playsinline="webkit-playsinline" class="videoPlayer">
        <source src="{{videoUrl}}" type="video/mp4"/>
</video>
3

No Nothing Worked, i think this issue got me to a better way of doing what i was doing.

Its working now, what i did is i made a thumb Image for the VIdeo and in my feed i am showing the Image with a play overlay when the user clicks i download the video.

its working now