Class MP4Clip

MP4 素材，解析 MP4 文件，使用 MP4Clip.tick 按需解码指定时间的图像帧

可用于实现视频抽帧、生成缩略图、视频编辑等功能

Example

new MP4Clip((await fetch('<mp4 url>')).body)
new MP4Clip(mp4File.stream())

See

Implements

Constructors

constructor

Properties

#audioFrameFinder #audioSamples #decoderConf #destroyed #localFile #log #meta #opts #thumbAborter #videoFrameFinder #videoSamples #volume ready tickInterceptor

Accessors

meta

Methods

clone destroy split splitTrack thumbnails tick

Constructors

constructor

Properties

Private #audioFrameFinder

#audioFrameFinder: null | AudioFrameFinder = null

Private #audioSamples

#audioSamples: ExtMP4Sample[] = []

Private #decoderConf

#decoderConf: {
    audio: null | AudioDecoderConfig;
    video: null | VideoDecoderConfig;
} = ...

Type declaration

  • audio: null | AudioDecoderConfig
  • video: null | VideoDecoderConfig

Private #destroyed

#destroyed: boolean = false

Private #localFile

#localFile: OPFSFileWrap

Private #log

#log: {
    [k: string]: T;
} = ...

Type declaration

  • [k: string]: T

Private #meta

#meta: {
    audioChanCount: number;
    audioSampleRate: number;
    duration: number;
    height: number;
    width: number;
} = ...

Type declaration

  • audioChanCount: number
  • audioSampleRate: number
  • duration: number
  • height: number
  • width: number

Private #opts

#opts: MP4ClipOpts = ...

Private #thumbAborter

#thumbAborter: AbortController = ...

Private #videoFrameFinder

#videoFrameFinder: null | VideoFrameFinder = null

Private #videoSamples

#videoSamples: ExtMP4Sample[] = []

Private #volume

#volume: number = 1

ready

ready: Promise<IClipMeta>

当素材准备完成，ready 会切换到 resolved 状态

tickInterceptor

tickInterceptor: (<T>(time, tickRet) => Promise<T>) = ...

拦截 MP4Clip.tick 方法返回的数据，用于对图像、音频数据二次处理

Type declaration

    • <T>(time, tickRet): Promise<T>

    • Type Parameters

      • T extends {
            audio: Float32Array[];
            state: "done" | "success";
            video?: VideoFrame;
        }

      Parameters

      • time: number

        调用 tick 的时间

      • tickRet: T

        tick 返回的数据

      Returns Promise<T>

See

移除视频绿幕背景

Accessors

meta

  • get meta(): {
        audioChanCount: number;
        audioSampleRate: number;
        duration: number;
        height: number;
        width: number;
    }

  • 数据元数据

    Returns {
        audioChanCount: number;
        audioSampleRate: number;
        duration: number;
        height: number;
        width: number;
    }

    • audioChanCount: number
    • audioSampleRate: number
    • duration: number
    • height: number
    • width: number

Methods

clone

destroy

split

splitTrack

thumbnails

  • thumbnails(imgWidth?, opts?): Promise<{
        img: Blob;
        ts: number;
    }[]>

  • 生成缩略图，默认每个关键帧生成一个 100px 宽度的缩略图。

    Parameters

    • imgWidth: number = 100

      缩略图宽度，默认 100

    • Optional opts: Partial<ThumbnailOpts>

      Partial

    Returns Promise<{
        img: Blob;
        ts: number;
    }[]>

    Promise<Array<{ ts: number; img: Blob }>>

tick

  • tick(time): Promise<{
        audio: Float32Array[];
        state: "done" | "success";
        video?: VideoFrame;
    }>

  • 获取素材指定时刻的图像帧、音频数据

    Parameters

    • time: number

      微秒

    Returns Promise<{
        audio: Float32Array[];
        state: "done" | "success";
        video?: VideoFrame;
    }>

Settings

Member Visibility

Theme

On This Page

constructor#audioFrameFinder#audioSamples#decoderConf#destroyed#localFile#log#meta#opts#thumbAborter#videoFrameFinder#videoSamples#volumereadytickInterceptormetaclonedestroysplitsplitTrackthumbnailstick