정보
요청한 주제가 아래에 표시됩니다. 그러나 이 주제는 이 라이브러리에 포함되지 않습니다.

HTML5를 사용하여 웹 페이지에서 동영상 파일을 재생하는 방법

HTML5 동영상을 사용하면 외부 컨트롤 또는 플러그 인 없이 웹 페이지에서 동영상 콘텐츠를 추가 및 제어할 수 있습니다.

웹 페이지에서 동영상 재생

동영상은 웹에서 주요 구성 요소가 되었으며 장난기 많은 고양이부터 중요 문서까지 다양한 콘텐츠를 담을 수 있습니다. 이 시리즈에서는 HTML5를 사용하여 타사 컨트롤 또는 플러그 인 없이 웹 페이지에 동영상 플레이어를 추가하는 방법을 보여줍니다. 예제를 완벽하게 감상하려면 HTML5 동영상을 지원하는 최신 브라우저가 필요하지만, 이전 버전과의 호환성을 위해 포함된 타사 플레이어를 사용하는 방법도 있습니다.

예제와 이미지는 Windows Internet Explorer 9 및 Internet Explorer 10을 사용하여 표시되지만, 다른 브라우저와의 차이점을 설명할 것입니다.

참고  인트라넷에서 개발 중이고 HTML5 동영상 및 다른 기능을 렌더링하는 데 문제가 있는 경우 테스트를 위해 <meta http-equiv-"X-UA-Compatible" content="IE=edge"/>를 웹 페이지의 "<head>" 블록에 추가할 수 있습니다. 그러면 Windows Internet Explorer에서 최신 표준을 사용하게 됩니다. 원하는 경우 meta http-equiv-"X-UA-Compatible" 헤더를 IE=9 또는 IE=10과 함께 보내도록 웹 개발 서버를 구성합니다. 문서 호환성에 대한 자세한 내용은 문서 호환성 정의를 참조하세요.

웹 페이지에 대한 오디오 및 동영상 콘텐츠 제공

브라우저 간의 주요 차이점은 브라우저마다 지원하는 동영상 형식이 서로 다르다는 점입니다. HTML5 동영상은 새로운 표준이며 어느 하나의 동영상 형식과 연결되지 않습니다. Internet Explorer는 주로 H.264 동영상을 지원합니다. Internet Explorer의 HTML5 동영상 형식 지원에 대한 자세한 내용은 IEBlog 게시물 HTML5 동영상(영문), IE9에서 HTML5 동영상에 대한 추가 작업(영문) 및 IE9에서 HTML5 동영상에 대한 다른 추가 작업(영문)을 참조하세요.

Internet Explorer 9 이상에서는 오디오 또는 동영상 콘텐츠를 재생하려면 서버에 올바른 MIME 형식이 설정되어 있어야 합니다. 그렇지 않으면 파일이 재생되지 않습니다. Internet Explorer 9은 MP3 오디오와 MP4 오디오 및 동영상을 지원합니다. WebM components from WebM 프로젝트(영문)에서 WebM 구성 요소를 설치하여 WebM 오디오 및 동영상 파일을 지원할 수 있습니다. 다음 표는 웹 서버에서 이러한 파일을 올바르게 호스트하는 데 필요한 설정을 보여줍니다.

처리할 미디어 파일확장 설정MIME 형식 설정
오디오 mp3mp3오디오/mpeg
오디오 mp4 m4a오디오/mp4
오디오 webmwebm오디오/webm
동영상 mp4(H.264)mp4동영상/mp4
동영상 webmwebm동영상/webm

 

이 조항의 내용

항목설명

웹 페이지에 HTML5 동영상 컨트롤 추가

HTML5 동영상을 사용하면 타사 플러그 인이나 JavaScript 없이도 웹 페이지에 전체 기능을 갖춘 동영상 플레이어를 포함할 수 있습니다.

JavaScript를 사용하여 HTML5 동영상 플레이어 제어

HTML5 video 개체는 JavaScript에서 재생을 제어하는 데 사용할 수 있는 메서드, 속성 및 이벤트를 제공합니다.

HTML5 동영상 이벤트 사용

HTML5 동영상 이벤트는 웹 페이지를 간소화하고 웹 페이지에 효율성을 추가할 수 있는 방법을 제공합니다.

 

관련 항목

웹 페이지에 비디오 컨트롤 추가
JavaScript를 사용하여 HTML5 동영상 플레이어 제어
HTML5 동영상 이벤트 사용

 

 

표시:
© 2014 Microsoft