Cannot load Video/Asset on real iOS device

Ionic Framework
1

Hello everyone, I’m using a video as background for my iOS application. The video loads correctly on Browser and also on the iOS Simulator. The problem is raised when testing my app on my real device using TestFlight so already builded and from the App Store Connect.

This is my capacitor.config.ts

import { CapacitorConfig, } from "@capacitor/cli";

const config: CapacitorConfig = {
    appId: "***",
    appName: "***",
    webDir: "dist",
    server: {
        hostname: "127.0.0.1",
        cleartext: true,
        allowNavigation: [
            "*",
        ],
    },
};

export default config;

This is the code loading my video which works fine on browser and iOS Simulator on my Mac

<video class="video" autoplay muted loop playsinline>
    <source src="/videos/background.mp4" type="video/mp4"/>
</video>

The video is located at project root ./public/videos/background.mp4
I tried a lot of solutions, even using a complete string as path

Capacitor.convertFileSrc(`${window.location.origin}/videos/background.mp4`);

I have the basic installation of Ionic + Capacitor, so I don’t have any strange configuration. The video just doesn’t load on a real iOS device.

The only solution that I have right now and works, is uploading the video to my servers and just loading it with the URL, in this way it works, but I don’t want users to waste bandwidth in this way.

Anyone can help me? Thank you so much!

2

Have you run the app in XCode on your real device? If not, try that and look at DevTools in Safari to see what errors you are getting.

1 Like
4

This is an iOS bug, doesn’t affect all iOS versions, it has been reported several times and Apple fix it, but then they break again in another iOS release, and fix again, and so on.
So if it works in the simulator is probably because it has an iOS version where it worked, but your real iOS device has a version where it’s broken.

2 Likes
5

Hello, currently it’s complicated to debug in this way, I’ll update after I do it

6

Hello, thank you, I have updated to latest iOS version but the issue still occurs. I tried on iPhone 13, I will try also on an iPhone 15 Pro and update here