112
Views
9
Comments
Solved
Video Widget not working with IOS devices
Application Type
Mobile

Hy All,

I have been stuck in this issue for a long time. Please need your support.

We have mobile application developed, in which we have a requirement to show the users some video's of the application, to achieve the same we used OS Video widget. The videos plays fine in Android and browsers but fails to play in IOS and its browsers.



But this failed in IOS, i tried many other ways as applying playsinline , autoplay , muted etc but still facing the same issue. Also tried one of the solutions provided  to convert Binary to Base64 , appending 

data:video/mp4;base64," to the string. Still it was not helpful. 


In IOS,

2018-03-29 06-28-54
Takasi Moriya
 
MVP
Solution

The attachiment is a sample module of video widget in mobile app by me.
This app both PWA and Native App work fine on my iOS 16 iPhone. 
Converting Binary to DataURL is a confusing point.
For your information. 

VideoTest.oml
2023-08-07 10-09-22
Sugumaran M

Hi Moriya,

Thanks a lot, it started working. 

I did the similar before but converted to base64 and then tried appending the 

"data:video/mp4;base64," which was not working, but appending directly to binary data without  converting worked as champ.


2023-08-07 10-09-22
Sugumaran M

Hi Moriya, 

Converting to Binary , it works as mentioned .

But is there any way we can have 'src' URL instead of "data:video/mp4;base64," + Binary .

As when there are multiple videos to play, converting high quality video to binary and then appending is causing serious performance issue.

2018-03-29 06-28-54
Takasi Moriya
 
MVP
Solution

You may improve the performance by using Expose REST API.
The attachment is a new sample module.
Note that Expose REST API generally needs more implements for security but the sample doesn't have them.

VideoTest2.oml
2023-08-07 10-09-22
Sugumaran M

Yes we used the same approach initially , but with the headers it works now. But not in all IOS devices  it works. 

Thanks for the solution.

2018-03-29 06-28-54
Takasi Moriya
 
MVP
Solution

You may improve the performance by using Expose REST API.
The attachment is a new sample module.
Note that Expose REST API generally needs more implements for security but the sample doesn't have them.

VideoTest2.oml
2022-08-03 04-32-50
Ravi Punjwani

Hi Sugumaran,

Did you try fetching any logs for this event? Easy win would be to hop on to the Service Center from your browser > Monitoring > Error Logs.

Let me know if you find any more details about the error. Do share the error log and stack trace from there if you couldn't find a quick fix.

2023-08-07 10-09-22
Sugumaran M

Hy Ravi,

There is no log logged for this, checked the Error, general and Screen. User will not get any error msg also in screen. 


2018-03-29 06-28-54
Takasi Moriya
 
MVP
2023-08-07 10-09-22
Sugumaran M

Hy ,

I Added in CSP , but still same, please note the source of the video file is present in same application resources.

Thank you for the suggestion, please let me know if anything i miss.


2018-03-29 06-28-54
Takasi Moriya
 
MVP
Solution

The attachiment is a sample module of video widget in mobile app by me.
This app both PWA and Native App work fine on my iOS 16 iPhone. 
Converting Binary to DataURL is a confusing point.
For your information. 

VideoTest.oml
2023-08-07 10-09-22
Sugumaran M

Hi Moriya,

Thanks a lot, it started working. 

I did the similar before but converted to base64 and then tried appending the 

"data:video/mp4;base64," which was not working, but appending directly to binary data without  converting worked as champ.


2023-08-07 10-09-22
Sugumaran M

Hi Moriya, 

Converting to Binary , it works as mentioned .

But is there any way we can have 'src' URL instead of "data:video/mp4;base64," + Binary .

As when there are multiple videos to play, converting high quality video to binary and then appending is causing serious performance issue.

2018-03-29 06-28-54
Takasi Moriya
 
MVP
Solution

You may improve the performance by using Expose REST API.
The attachment is a new sample module.
Note that Expose REST API generally needs more implements for security but the sample doesn't have them.

VideoTest2.oml
2023-08-07 10-09-22
Sugumaran M

Yes we used the same approach initially , but with the headers it works now. But not in all IOS devices  it works. 

Thanks for the solution.

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.