소개

M2Live Cloud 비디오 서비스는 MP4 원본 하나만 있으면 브라우저에 맞는 최적 포맷으로 실시간 변환·전달합니다. 별도의 인코딩 서버나 변환 파이프라인 없이, URL 하나로 포맷 변환·구간 편집·프레임 캡쳐를 모두 처리할 수 있습니다.

M2Live Cloud Video service delivers video in the optimal format for each browser from a single MP4 source. No separate encoding server or conversion pipeline needed — format conversion, clip trimming, and frame capture are all handled via a single URL.

기존 방식과 무엇이 다른가요?

How is this different from the traditional approach?

기존 방식은 MP4, WebM, HLS 등 여러 포맷을 미리 인코딩해서 각각 저장해야 했습니다. M2Live Cloud는 원본 MP4 하나만 저장하면, 브라우저의 요청에 맞춰 실시간으로 변환하고 CDN에 자동 캐싱합니다.

The traditional approach requires pre-encoding into multiple formats (MP4, WebM, HLS, etc.) and storing each separately. With M2Live Cloud, you store only the original MP4, and it is converted in real time to match the browser's request and automatically cached on the CDN.

지원 기능 한눈에 보기

Supported Features at a Glance

요청이 처리되는 흐름

How Requests Are Processed

On-the-fly 자동 최적화

URL에 아무 파라미터를 추가하지 않아도, 브라우저가 지원하는 가장 효율적인 비디오 포맷으로 자동 변환합니다. 콘솔에서 비디오 최적화를 활성화하거나 URL에 /optimize/를 추가하는 것만으로 바로 사용할 수 있습니다.

Even without any URL parameters, video is automatically converted to the most efficient format supported by the browser. Simply enable video optimization in the console or add /optimize/ to the URL to get started.

브라우저 · 디바이스별 자동 변환 결과

Auto Conversion Results by Browser / Device

브라우저 환경에 따라 아래처럼 자동으로 최적 포맷이 선택됩니다.

The optimal format is automatically selected based on the browser environment as shown below.

VP9 vs AV1 — 어떤 코덱이 사용되나요?

VP9 vs AV1 — Which codec is used?

콘솔에서 활성화하는 방법

How to Enable in the Console

서비스 설정 → 미디어 설정 → 비디오 탭에서 아래 토글을 켜면, URL 파라미터 없이도 모든 비디오 요청에 자동 최적화가 적용됩니다.

Go to Service Settings → Media Settings → Video and enable the toggle below to apply auto optimization to all video requests without any URL parameters.

지원 포맷

M2Live Cloud는 주요 비디오 포맷을 입력과 출력 모두 지원합니다. 원본은 MP4(H.264)로 보관하는 것을 권장하며, 출력은 브라우저 환경에 따라 WebM(VP9/AV1) 또는 MP4로 자동 결정됩니다.

M2Live Cloud supports all major video formats for both input and output. Storing the source as MP4 (H.264) is recommended; the output format is automatically determined as WebM (VP9/AV1) or MP4 based on the browser environment.

포맷별 특성 비교

Format Comparison

포맷 가이드

Format Guide

URL기반 변환

파일 경로 뒤에 c_xcdr 키워드와 변환 명령어를 추가하면, 비디오를 원하는 대로 가공할 수 있습니다. 서버 코드 변경 없이 URL 하나로 포맷 변환·구간 편집·프레임 캡쳐 등을 자유롭게 처리할 수 있습니다.

Add the c_xcdr keyword and a transform command after the file path to process video as needed. Format conversion, clip trimming, frame capture, and more can all be done with a single URL — no server-side code changes required.

URL 구조

URL Structure

https://cdn.myservice.com/path/to/video.mp4/c_xcdr/[명령어]/[파라미터]

https://cdn.myservice.com/path/to/video.mp4/c_xcdr/[command]/[parameter]

사용 가능한 명령어 목록

Available Commands

트랜스코딩

preset 명령어를 사용하면 비디오를 지정된 프리셋으로 실시간 트랜스코딩합니다. 트랜스코딩 후 메타데이터(moov atom)를 파일 맨 앞으로 배치해 재생 시작 속도를 최적화합니다.

The preset command transcodes video in real time to the specified preset. After transcoding, metadata (moov atom) is placed at the beginning of the file to optimize playback start speed.

URL 예시

URL Examples

프리셋 상세

Preset Details

옵션

Options

# 1080p 프리셋으로 트랜스코딩
https://example.com/video.mp4/c_xcdr/preset/_1080p

# 720p 프리셋으로 트랜스코딩
https://example.com/video.mp4/c_xcdr/preset/_720p

# faststart 비활성화 (메타데이터를 파일 끝에 배치)
https://example.com/video.mp4/c_xcdr/preset/_1080p/faststart/false

# Transcode to 1080p preset
https://example.com/video.mp4/c_xcdr/preset/_1080p

# Transcode to 720p preset
https://example.com/video.mp4/c_xcdr/preset/_720p

# Disable faststart (place metadata at end of file)
https://example.com/video.mp4/c_xcdr/preset/_1080p/faststart/false

구간편집 (Trim)

trim 명령어를 사용하면 비디오에서 원하는 구간만 추출할 수 있습니다. HH:mm:ss 형식으로 시작~종료 시간을 지정하며, 다구간 추출·병합도 지원합니다. 트랜스코딩과 결합해 숏폼 제작에 유용합니다.

The trim command extracts only the desired segment from a video. Specify start and end times in HH:mm:ss format; multi-segment extraction and merging are also supported. Useful for short-form content creation when combined with transcoding.

시간 형식

Time Format

URL 예시

URL Examples

# 1시간 0분 5초 ~ 1시간 1분 5초 구간 추출
https://example.com/video.mp4/c_xcdr/trim/01:00:05-01:01:05

# 처음부터 1분 30초까지
https://example.com/video.mp4/c_xcdr/trim/-01:30

# 1시간 15분 30초부터 끝까지
https://example.com/video.mp4/c_xcdr/trim/1:15:30-

# 1분 20초~1분 30초, 3분 57초~4분 28초 두 구간 병합
https://example.com/video.mp4/c_xcdr/trim/01:20-01:30,03:57-04:28

# Extract segment from 1h 0m 5s to 1h 1m 5s
https://example.com/video.mp4/c_xcdr/trim/01:00:05-01:01:05

# From beginning to 1 minute 30 seconds
https://example.com/video.mp4/c_xcdr/trim/-01:30

# From 1 hour 15 minutes 30 seconds to end
https://example.com/video.mp4/c_xcdr/trim/1:15:30-

# Merge two segments: 1m 20s–1m 30s and 3m 57s–4m 28s
https://example.com/video.mp4/c_xcdr/trim/01:20-01:30,03:57-04:28

프레임 캡쳐

capture 명령어를 사용하면 비디오의 특정 시간 지점에서 프레임을 이미지로 추출합니다. 단일 캡쳐와 다구간 캡쳐를 모두 지원하며, 캡쳐된 이미지는 이미지 서비스와 연계해 추가 가공도 가능합니다.

The capture command extracts a frame from a specific timestamp as an image. Both single and multi-point capture are supported, and captured images can be further processed via the Image service.

옵션

Options

URL 예시

URL Examples

이미지 서비스 연계

Image Service Integration

캡쳐된 이미지는 이미지 서비스(c_hdims)와 연계해 리사이즈·포맷 변환 등 추가 가공이 가능합니다.

Captured images can be further processed (resize, format conversion, etc.) using the Image service (c_hdims).

# 10초 지점 캡쳐 후 640x480으로 리사이즈
https://example.com/video.mp4/c_xcdr/capture/ts=10/c_hdims/resize/640x480

# Capture frame at 10s then resize to 640x480
https://example.com/video.mp4/c_xcdr/capture/ts=10/c_hdims/resize/640x480

<img src="https://example.com/videos/product-tour.mp4/c_xcdr/capture/ts=3"
     alt="영상 썸네일" loading="lazy">

<img src="https://example.com/videos/product-tour.mp4/c_xcdr/capture/ts=3"
     alt="Video thumbnail" loading="lazy">

HLS (HTTP Live Streaming)

출시 예정 기능

Planned Features

HLS란 무엇인가요?

What is HLS?

HLS(HTTP Live Streaming)는 Apple이 개발한 비디오 스트리밍 프로토콜입니다. 비디오를 짧은 세그먼트(.ts 파일)로 분할하고, 매니페스트 파일(.m3u8)로 목록을 관리합니다. 네트워크 상태에 따라 화질을 자동으로 전환하는 ABR을 지원하여, 버퍼링 없이 안정적인 스트리밍을 제공합니다.

HLS (HTTP Live Streaming) is a video streaming protocol developed by Apple. It splits video into short segments (.ts files) managed by a manifest file (.m3u8). It supports ABR (Adaptive Bitrate) to automatically switch quality based on network conditions, providing stable streaming without buffering.

워터마크

출시 예정 기능

Planned Features

분석 (Analyze)

analyze 명령어를 사용하면 비디오의 메타정보를 JSON 형태로 받아볼 수 있습니다. 간략 정보(src), 상세 정보(srcd), 원본과의 유사도 비교(ssim) 세 가지 명령어를 제공합니다.

The analyze command returns video metadata in JSON format. Three commands are available: brief info (src), detailed info (srcd), and similarity comparison with the source (ssim).

명령어 종류

Command Types

analyze/src — 간략 정보

analyze/src — Brief Info

{
  "enable": true,
  "url": "/video.mp4",
  "result": {
    "source": {
      "size": 6238713,
      "format": "mp4",
      "duration": 15.062,
      "video": {
        "codec_name": "h264",
        "width": 1920,
        "height": 1080
      },
      "audio": {
        "codec_name": "aac"
      }
    },
    "elapsed": {
      "init": 2,
      "complete": 14
    },
    "function": {
      "keyword": "xcdr"
    }
  }
}

응답 필드 설명 (analyze/src)

Response Fields (analyze/src)

analyze/srcd — 상세 정보

analyze/srcd — Detailed Info

srcd는 모든 스트림의 전체 메타데이터를 반환합니다. result.source.streams 배열에 오디오·비디오 각 스트림의 코덱, 비트레이트, 프레임 수, 색공간, 샘플링 정보 등 상세 데이터가 포함됩니다.

srcd returns full metadata for all streams. The result.source.streams array contains detailed data for each audio and video stream, including codec, bitrate, frame count, color space, and sampling information.

analyze/ssim — 유사도 비교

analyze/ssim — Similarity Comparison

{
  "enable": true,
  "url": "/example.mp4",
  "result": {
    "ssim": "0.971172",
    "elapsed": {
      "init": 5217,
      "complete": 9559
    }
  }
}

설정

서비스 설정 → 미디어 설정 → 비디오 탭에서 On-the-fly 비디오 최적화를 관리합니다. 설정 변경은 이후 들어오는 새 요청부터 바로 적용됩니다. 이미 CDN에 캐싱된 비디오는 퍼지를 실행하기 전까지 기존 방식대로 제공됩니다.

On-the-fly video optimization is managed under Service Settings → Media Settings → Video. Changes take effect immediately for new incoming requests. Videos already cached on the CDN continue to be served as before until a purge is executed.

설정 항목

Settings

최적화를 켜기 전 vs 켠 후 비교

Optimization OFF vs ON Comparison

Best Practice

M2Live Cloud 비디오 서비스를 처음 도입하거나 더 효율적으로 사용하고 싶다면 아래 가이드를 참고하세요. 원본 관리부터 HTML 삽입 방법, 캐시 전략까지 실무에서 바로 활용할 수 있는 내용을 담았습니다.

If you're adopting M2Live Cloud Video service for the first time or looking to use it more efficiently, refer to the guide below. It covers everything from source management to HTML embedding and cache strategies — all ready for immediate use in production.

원본·포맷 관리 전략

Source & Format Management Strategy

상황별 권장 URL 패턴

Recommended URL Patterns by Use Case

HTML에 비디오 삽입하기

Embedding Video in HTML

비디오 최적화 설정이 켜져 있다면 기존 <video> 태그를 그대로 사용해도 브라우저에 맞는 포맷이 자동으로 제공됩니다. Safari 16.4+(macOS) 및 iOS 17+에도 VP9/WebM이 자동으로 전달되며, 구형 환경에는 MP4가 폴백됩니다.

If video optimization is enabled, the existing <video> tag can be used as-is and the optimal format will be served automatically. VP9/WebM is delivered automatically to Safari 16.4+(macOS) and iOS 17+; MP4 is provided as a fallback for legacy environments.

<!-- 비디오 최적화 ON 상태라면 이것만으로 충분합니다.
     Chrome/Firefox/Edge/Safari 16.4+/iOS 17+ → WebM(VP9)
     구형 Safari / iOS 16↓ → MP4 자동 폴백 -->
<video
  src="https://cdn.myservice.com/videos/intro.mp4"
  controls
  preload="metadata"
  width="1280" height="720">
</video>

<!-- If video optimization is ON, this is all you need.
     Chrome/Firefox/Edge/Safari 16.4+/iOS 17+ → WebM(VP9)
     Legacy Safari / iOS 16↓ → MP4 auto-fallback -->
<video
  src="https://cdn.myservice.com/videos/intro.mp4"
  controls
  preload="metadata"
  width="1280" height="720">
</video>

<!-- WebM 우선, MP4 폴백 (구형 Safari / iOS 16↓ 포함 전 브라우저 지원) -->
<video controls preload="metadata" width="1280" height="720">
  <!-- Chrome / Firefox / Edge / Safari 16.4+ / iOS 17+: WebM(VP9) 우선 제공 -->
  <source
    src="https://cdn.myservice.com/videos/intro.mp4/c_xcdr/preset/_1080p"
    type="video/mp4">
  <!-- 구형 Safari(16.3↓) / iOS 16↓: 원본 MP4(H.264) 폴백 -->
  <source
    src="https://cdn.myservice.com/videos/intro.mp4"
    type="video/mp4">
  <p>이 브라우저는 HTML5 비디오를 지원하지 않습니다.</p>
</video>

<!-- WebM preferred, MP4 fallback (supports all browsers including legacy Safari / iOS 16↓) -->
<video controls preload="metadata" width="1280" height="720">
  <!-- Chrome / Firefox / Edge / Safari 16.4+ / iOS 17+: WebM(VP9) served preferentially -->
  <source
    src="https://cdn.myservice.com/videos/intro.mp4/c_xcdr/preset/_1080p"
    type="video/mp4">
  <!-- Legacy Safari(16.3↓) / iOS 16↓: original MP4(H.264) fallback -->
  <source
    src="https://cdn.myservice.com/videos/intro.mp4"
    type="video/mp4">
  <p>Your browser does not support HTML5 video.</p>
</video>

트러블슈팅

비디오 관련 문제가 생겼을 때 아래 체크리스트를 순서대로 확인해보세요. 직접 해결이 어렵다면 m2.cs@winesoft.co.kr로 문의해 주세요.

If you encounter a video-related issue, work through the checklist below in order. If you're unable to resolve it yourself, contact us at m2.cs@winesoft.co.kr.

증상별 원인과 해결 방법

Symptoms, Causes, and Solutions

문제를 빠르게 찾는 5단계 체크리스트

5-Step Checklist for Quick Diagnosis

# 응답 헤더 전체 확인 (Content-Type, Cache-Control, X-Cache 등)
curl -I "https://example.com/videos/intro.mp4/c_xcdr/preset/_720p"

# 비디오 메타정보 JSON으로 확인 (재생시간, 코덱, 해상도 등)
curl "https://example.com/videos/intro.mp4/c_hdims/analyze/src"

# 상세 메타정보 확인 (모든 스트림 정보 포함)
curl "https://example.com/videos/intro.mp4/c_hdims/analyze/srcd"

# Range Request 지원 여부 확인
curl -H "Range: bytes=0-1023" -I "https://example.com/videos/intro.mp4"

# Check all response headers (Content-Type, Cache-Control, X-Cache, etc.)
curl -I "https://example.com/videos/intro.mp4/c_xcdr/preset/_720p"

# Check video metadata as JSON (duration, codec, resolution, etc.)
curl "https://example.com/videos/intro.mp4/c_hdims/analyze/src"

# Check detailed metadata (includes all stream info)
curl "https://example.com/videos/intro.mp4/c_hdims/analyze/srcd"

# Check Range Request support
curl -H "Range: bytes=0-1023" -I "https://example.com/videos/intro.mp4"