0

I have a strange situation where:

  • Android recorded video plays on an iPhone but not on an Android device
  • iPhone recorded videos play on both iPhones and Android devices

The HTML I use is:

          <video controls="controls">
            <source type="video/quicktime" [src]="sanitizer.bypassSecurityTrustResourceUrl(step.attachment)">
            <source type="video/mp4" [src]="sanitizer.bypassSecurityTrustResourceUrl(step.attachment)">
          </video>

The step.attachment is a base64 file.

My App is built with ionic 2

Bill Noble
  • 5,478
  • 14
  • 62
  • 118
  • Are you playing streaming video or playing after downloading? – Janmenjaya May 24 '17 at 11:49
  • Can you please provide audio and video encoding you used to record video ? – RMRAHUL May 24 '17 at 11:49
  • The video is a base64 encoded file in memory – Bill Noble May 24 '17 at 11:50
  • Why is Quicktime used on a HTML5 video tag??? Quicktime (`.mov`) is made by Apple so it will work on iOS browser (but not guaranteed for other systems). **(1)** Try removing ` – VC.One May 24 '17 at 17:39
  • The files have to base64 because of the way they are stored. The Android phone has no problem playing the base64 video recorded on an iPhone. It is only the video recorded on an Android phone which can't be played on an Android phone (but can be played on an iPhone!). Two source tags are used, one quicktime and one mp4, to cater for both iPhone and Android. – Bill Noble May 24 '17 at 17:46
  • Try to use 3GP instead of MP4 format – Amjad Khan Jun 01 '17 at 05:06
  • It is an mp4 file – Bill Noble Jun 01 '17 at 06:59
  • Can you try to reverse the order of the source tags and see if the behavior on Android and iOS changes? It might be that Android just tries to use the codec from the first source entry - which is ok for QuickTime videos created on iOS, but not for videos created on Android. If the behavior "reverses" too, the solution would be to have the type declaration dependent on the encoded video somehow. – Frank Schmid Jun 02 '17 at 10:22
  • I have removed the quicktime source tag to see if that made a difference on Android and it doesn't – Bill Noble Jun 02 '17 at 10:48
  • there sometimes happen the issue of streams normally video is stream #0 and audio stream #1 and if these swaps android will behave weird , anyway is it possible to host the page and file online ? then checking the issue will be easier.... – Ahmad Jun 03 '17 at 14:42
  • How can I specify the stream? – Bill Noble Jun 03 '17 at 17:55

1 Answers1

0

This should be a comment but I don't have enough rep to comment.

Perhaps explicitly determine the OS of the phone first and only define the video source for that OS.

For instance, the following algorithm:

if OS == Android, video controls source type="video/mp4"

else if OS == iOS, video controls source type="video/quicktime"

Although I don't see why what you have should not work, hopefully you lose nothing trying this.

rmaddy
  • 298,130
  • 40
  • 468
  • 517
Olaolu Akinsete
  • 5
  • 1
  • 4