브라우저 호환성

FlowPick의 다양한 브라우저에서의 기능 가용성은 브라우저의 최신 Web API 지원 정도에 달려 있습니다. 본 문서는 상세한 기능 호환성 매트릭스와 강등 전략을 설명합니다.

브라우저 빠른 검사

FlowPick을 사용하기 전에, 다음 방법으로 브라우저가 요구사항을 충족하는지 빠르게 판단할 수 있습니다:

브라우저 지원 개요

기능 가용성 속查표

다음 표는 기능 차원에서 각 브라우저의 지원 현황을 보여주며, 빠른 조회에 편리합니다:

✅ 완전 지원 · ⚠️ 부분 지원(강등 있음) · 🚧 개발 중 · ❌ 지원 안 함

API 호환성 매트릭스

FlowPick은 다음 브라우저 API에 의존합니다. 각 브라우저의 지원 현황이 기능 가용성에 직접적인 영향을 미칩니다.

핵심 API

고급 API

기능 강등 전략

브라우저가 특정 API를 지원하지 않을 때, FlowPick은 자동으로 대안으로 강등되어 핵심 기능이 항상 사용 가능하도록 합니다.

파일 쓰기 강등 체인

File System Access API (최적)
    ↓ 사용 불가 시 강등
StreamSaver.js (스트리밍 쓰기)
    ↓ 사용 불가 시 강등
Blob + <a> download (메모리 쓰기, 크기 제한 있음)

File System Access API 사용 불가 시 영향:

• "저장 디렉토리 선택" 기능 사용 불가
• 매번 다운로드 시 저장 위치 수동 선택 필요(팝업 모드)
• 대용량 파일(>1.5GB)이 메모리 제한으로 실패할 수 있음

StreamSaver.js 사용 불가 시 영향:

• 파일이 먼저 메모리에 완전히 로드된 후 다운로드 트거
• Blob 크기 제한 받음(1.5GB 하드 상한)
• 대용량 파일 다운로드 전 경고 표시

FFmpeg 멀티 스레드 강등

SharedArrayBuffer 사용 가능 → 멀티 스레드 FFmpeg (빠름)
    ↓ 사용 불가 시 강등
SharedArrayBuffer 사용 불가 → 싱글 스레드 FFmpeg (느림)
    ↓ FFmpeg 로딩 실패 시 강등
TS 포맷 → 직접 이진 연결 (최고속, FFmpeg 불필요)

SharedArrayBuffer 사용 불가 시 영향:

• FFmpeg 병합 속도 약 40-60% 저하
• 기능에는 완전히 영향 없음, 속도만 느려짐
• TS 출력 포맷을 선택하면 FFmpeg를 완전히 건너뛸 수 있음

알림 강등

Notifications API 사용 가능 → 시스템 데스크톱 알림
    ↓ 사용 불가 시 강등
인터페이스 내 상태 표시

보안 헤더 요구사항

FlowPick 웹사이트는 전체 기능 활성화를 위해 다음 HTTP 응답 헤더 구성이 필요합니다:

필수 보안 헤더

Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp

이 두 헤더는 SharedArrayBuffer의 선행 조건이며, FFmpeg 멀티 스레드 모드에 영향을 미칩니다.

권장 보안 헤더

X-Frame-Options: SAMEORIGIN
Cross-Origin-Resource-Policy: same-origin

이 헤더들은 StreamSaver.js의 mitm.html과 Service Worker가 정상 작동하도록 보장합니다.

배포 체크리스트

직접 FlowPick 웹사이트를 배포하는 경우, 다음을 확인하세요:

• / 경로가 Cross-Origin-Opener-Policy: same-origin 반환
• / 경로가 Cross-Origin-Embedder-Policy: require-corp 반환
• /mitm.html 정상 접근 가능
• /streamsaver-sw.js 정상 접근 가능且 Service-Worker-Allowed 헤더 올바름
• /_nuxt/* 정적 리소스 경로에 올바른 COEP/COOP 헤더 설정

각 브라우저 상세 설명

Google Chrome(권장)

버전 요구사항: 86+

지원하는 모든 기능:

• File System Access API(디렉토리 선택, 영속화 권한)
• SharedArrayBuffer(COEP/COOP 헤더 필요)
• StreamSaver.js
• FFmpeg WASM 멀티 스레드
• 모든 확장 기능

알려진 문제: 없음

Microsoft Edge(권장)

버전 요구사항: 86+

지원하는 모든 기능: Chrome과 동일(Chromium 기반)

알려진 문제:

• 일부 기업 정책이 File System Access API를 비활성화할 수 있음
• 확장은 Edge 애드온 스토어에서 설치 필요

Firefox(개발 중)

현재 상태: 확장 버전 개발 중, 온라인 도구 부분 사용 가능

제한:

• File System Access API 지원 안 함
• showSaveFilePicker 지원 안 함
• SharedArrayBuffer에 COEP/COOP 헤더 필요(Firefox 79+)
• StreamSaver.js 지원 제한적

강등 행동: 모든 다운로드가 Blob 모드 사용

Safari(비권장)

현재 상태: 확장 버전 지원 안 함

제한:

• File System Access API 지원 안 함
• SharedArrayBuffer 지원 안 함
• showSaveFilePicker 지원 안 함
• showDirectoryPicker 지원 안 함
• WebAssembly 지원 제한적
• Service Worker 기능 제한

강등 행동: 기본적인 Blob 다운로드 모드만 지원, FFmpeg 로딩 불가능할 수 있음

모바일 브라우저

FlowPick은 주로 데스크톱 브라우저를 대상으로 설계되었습니다. 모바일 브라우저의 확장 지원은 제한적입니다:

모바일 제한:

• File System Access API 지원 안 함
• 메모리 제한 더 엄격
• 다운로드 관리 경험이 데스크톱보다 떨어짐

브라우저 선택 방법

자주 묻는 질문

내 브라우저에서 "저장 디렉토리 선택" 버튼이 보이지 않는 이유는?

"저장 디렉토리 선택"은 File System Access API에 의존하며, Chrome/Edge 86+ 버전이 필요합니다. 브라우저 버전이 요구사항을 충족해도 보이지 않는다면, 기업 정책이 해당 API를 비활성화했을 수 있습니다. 이 경우 자동으로 Blob 다운로드 모드로 강등됩니다.

FFmpeg 병합 속도가 너무 느린데 어떻게 하나요?

FFmpeg 멀티 스레드 모드는 SharedArrayBuffer가 필요하며, 이는 웹사이트가 COEP/COOP 보안 헤더를 구성해야 합니다. 직접 FlowPick을 배포했는데 이 헤더들을 구성하지 않았다면, FFmpeg가 자동으로 싱글 스레드 모드로 강등되어 속도가 약 40-60% 저하됩니다.

해결 방법:

1. FlowPick 공식 웹사이트 사용(보안 헤더 이미 구성됨)
2. TS 출력 포맷 선택, FFmpeg 병합 건너뛰기
3. 직접 배포 시 COEP/COOP 헤더 구성

모바일에서 FlowPick을 사용할 수 있나요?

모바일 브라우저는 확장을 지원하지 않지만, 온라인 도구를 사용할 수 있습니다. 하지만 모바일에는 메모리 제한과 API 결손이 있어 대용량 파일 다운로드 경험이 좋지 않습니다. 데스크톱에서 다운로드를 완료할 것을 권장합니다.

Firefox는 언제 완전히 지원하나요?

Firefox 확장 버전이 개발 중입니다. Firefox의 Manifest V3 지원은 여전히 개선 중이며, File System Access API는 Firefox에서 당장 구현 계획이 없습니다. 확장 출시 전까지, Firefox 사용자는 온라인 도구를 사용할 수 있습니다.

관련 문서

• 설치 가이드 — Chrome/Edge 확장 설치 절차
• 온LINE 도구 — 설치 불필요한 웹 버전 다운로더
• 다운로드 엔진 아키텍처 — 쓰기 전략과 강등 논리 상세
• 포맷 변환 — FFmpeg WASM 엔진과 듀얼 엔진 아키텍처
• 비디오 스니핑 — 확장 자동 감지 원리
• 일괄 다운로드 — 큐 관리와 동시 제어
• 설정 참조 — 다운로드 동작 설정 항목
• 일반적인 문제 해결 — 브라우저 관련 문제의 진단
• 알려진 문제 — 각 브라우저의 알려진 제한