Video in expo-av is freezing after some time

  1. SDK Version: 35.0.0
  2. Platform: Android

Hello everyone,
I’m having issues with expo-av when playing videos.

This is my code:

import {Video} from "expo-av";
....

class VideoPlayer extends React.Component {
  playbackObject = undefined;

async componentDidMount() {
    if (!this.playbackObject) return;
    let videoUrl = 'http...';
    let progress = 100;
    try {
     await this.playbackObject.loadAsync({uri: videoUrl}, {shouldPlay: true})
       this.playbackObject.positionMillis = progress;
      this.playbackObject.staysActiveInBackground = true;
      this.playbackObject.interruptionModeIOS = INTERRUPTION_MODE_IOS_DO_NOT_MIX;
      this.playbackObject.shouldDuckAndroid = false;
      this.playbackObject.interruptionModeAndroid = INTERRUPTION_MODE_ANDROID_DO_NOT_MIX;
      this.playbackObject.isMuted = false;
      this.playbackObject.isLooping = false;
      await this.playbackObject.playAsync();
      await this.playbackObject.setProgressUpdateIntervalAsync(15000);
    } catch (error) {
      console.log('error', error);
    }
  }
  componentWillUnmount() {
    console.log('unmount')
    if (this.playbackObject) {
      this.playbackObject.unloadAsync().then(() => console.log('unmounted')).catch((e) => console.log('unmount exc', e));
    }
    this.playbackObject = undefined;
  }

_onPlaybackStatusUpdate = playbackStatus => {
    if (!playbackStatus) return;
    if (playbackStatus.isPlaying) {
        // Update your UI for the playing state
        console.log('is playing');
      } else {
        // Update your UI for the paused state
        console.log('is paused')
      }

      if (playbackStatus.isBuffering) {
        console.log('is buffering');
      }
}

render() {
    const width = Dimensions.get('window').width;
    const height = width / 1.78;

    return (

      <View>
        <Video
            ref={(ref) => {this.playbackObject = ref;}}
            rate={1.0}
            volume={1.0}
            resizeMode={Video.RESIZE_MODE_CONTAIN}
            style={{ width, height}}
            useNativeControls={true}
            onPlaybackStatusUpdate={this._onPlaybackStatusUpdate}
        />
      </View>
    );
  }
}
 

On iOS it works great.
On Android the video is freezing after a random amount of time.
When it freezes, playbackStatus.isPlaying is true and playbackStatus.isBuffering is true, but no buffering is happening. It’s completely freezed, even if I try to seek to another part of the video.

After one video is freezed, I can’t play other videos in the app. I have to exit the app to be able to play another video again.

That’s very strange.

How can I solve this issue?

Thanks

2 Likes

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.