resolveAdapterType

Import

import { resolveAdapterType } from '@videojs/react';

resolveAdapterType reads a source URL and returns the type of adapter that plays it, so an app that plays sources from a catalog or from user input can pick the matching media component. It returns null for sources it doesn’t recognize.

Resolution is a pure string check. It doesn’t fetch the source, load an engine, or touch the DOM. It doesn’t rewrite the source either: every source it recognizes, shorthands included, is one the matching media component accepts as its src.

Usage

import { resolveAdapterType } from '@videojs/react';
import { HlsJsVideo } from '@videojs/react/media/hlsjs-video';
import { VimeoVideo } from '@videojs/react/media/vimeo-video';
import { YouTubeVideo } from '@videojs/react/media/youtube-video';
import { Video } from '@videojs/react/video';

function Media({ src }: { src: string }) {
  switch (resolveAdapterType(src)) {
    case 'youtube':
      return <YouTubeVideo src={src} />;
    case 'vimeo':
      return <VimeoVideo src={src} />;
    case 'hls':
      return <HlsJsVideo src={src} playsInline />;
    case 'video':
      return <Video src={src} playsInline />;
    default:
      return null;
  }
}

Adapter types

hls covers every HLS adapter and dash every DASH adapter, so an HLS stream comes back as hls whichever one you play it with; see Media sources to choose one. Mux streams served from a custom domain are recognized as plain hls.

MIME types

Pass a MIME type as the second argument when the URL doesn’t end in a file extension, such as an extensionless manifest or a blob: URL. The MIME type takes precedence over the extension; service URLs, such as YouTube or Mux, resolve the same either way.

resolveAdapterType('https://example.com/manifest', 'application/vnd.apple.mpegurl'); // 'hls'

To get the MIME type a file extension implies, use resolveMimeType.

Bare ids

A bare id returns null. An 11-character YouTube id and a 10-character Wistia id look alike, so services are only recognized from URLs, spotify: URIs, and shorthands. If you already know the service, pass the id to its media component directly.

Shorthands

resolveAdapterType recognizes these shorthands, and the YouTube and Vimeo media accept them as src:

'youtube' | 'vimeo' | 'wistia' | 'mux' | 'cloudflare' | 'spotify' | 'tiktok' | 'twitch' | 'hls' | 'dash' | 'video' | 'audio' | null