H264-Encoded Video Not Playing In Android App (Using Expo)

时间:2018-02-01 18:20:08

标签: video react-native h.264 expo

I am trying to build a video app for Android using the Expo/React Native Framework.

To totally isolate things, I have something like the following:

import React, { Component } from 'react'

import { Video } from 'expo'

class VideoPlayer extends Component {

  render = () => {
    return (
      <Video
        source={{ uri: "https://storage.googleapis.com/deepthought-collective.appspot.com/testvid.mp4" }}
        rate={1.0}
        volume={1.0}
        isMuted={false}
        resizeMode="cover"
        shouldPlay
        isLooping
        style={{ width: 300, height: 500 }}
      />
    )
  }

}

In IOS, this plays fine. On Android, I get audio, but no video (just white).

This is the output of ffprobe:

> ffprobe testvid.mp4
ffprobe version 3.4.1 Copyright (c) 2007-2017 the FFmpeg developers
  built with Apple LLVM version 9.0.0 (clang-900.0.39.2)
  configuration: --prefix=/usr/local/Cellar/ffmpeg/3.4.1 --enable-shared --enable-pthreads --enable-version3 --enable-hardcoded-tables --enable-avresample --cc=clang --host-cflags= --host-ldflags= --enable-gpl --enable-libmp3lame --enable-libvorbis --enable-libvpx --enable-libx264 --enable-libxvid --enable-opencl --enable-videotoolbox --disable-lzma
  libavutil      55. 78.100 / 55. 78.100
  libavcodec     57.107.100 / 57.107.100
  libavformat    57. 83.100 / 57. 83.100
  libavdevice    57. 10.100 / 57. 10.100
  libavfilter     6.107.100 /  6.107.100
  libavresample   3.  7.  0 /  3.  7.  0
  libswscale      4.  8.100 /  4.  8.100
  libswresample   2.  9.100 /  2.  9.100
  libpostproc    54.  7.100 / 54.  7.100
Input #0, mov,mp4,m4a,3gp,3g2,mj2, from 'testvid.mp4':
  Metadata:
    major_brand     : isom
    minor_version   : 512
    compatible_brands: isomiso2avc1mp41
    encoder         : Lavf57.56.100
  Duration: 00:00:09.97, start: 0.000000, bitrate: 2691 kb/s
    Stream #0:0(und): Video: h264 (High) (avc1 / 0x31637661), yuv420p, 720x1280, 2522 kb/s, 30 fps, 30 tbr, 15360 tbn, 60 tbc (default)
    Metadata:
      handler_name    : VideoHandler
    Stream #0:1(und): Audio: aac (LC) (mp4a / 0x6134706D), 44100 Hz, stereo, fltp, 160 kb/s (default)
    Metadata:
      handler_name    : SoundHandler

I have tested this on a few Android devices, as well as an emulator, and observed the same result.

The video was produced using OBS.

If I open it on Chrome or download it, it doesn't even play sound.

Does anybody have any idea why it might be playing this way on Android, or have any recommendations how to encode video for Android?

1 个答案:

答案 0 :(得分:0)

不同的设备可能有不同的支持,但是对于给定的Android版本,所有平台都应支持的设置列在此处:

H.264有许多不同的参数,因此一个h.264编码的视频可能会播放一组参数而另一个h.264编码的视频可能不会播放。 h.264标准包括配置文件的概念,其类似于用于不同编码的属性的一组参数。您可以在此处查看一些配置文件的列表:

在您的情况下,您的视频使用的是“高”个人资料。这不包含在上面链接的默认支持编码集中 - 这可能是问题,或者至少是您看到的一个问题。

作为一般规则,设备上几乎总是支持基线,并且通常支持main - main提供比基线更多的压缩,但代价是更多的编码和解码处理。

您可以通过使用主要或基准配置文件重新编码视频并再次测试来测试这是否是问题。