html5는 flv 파일을 지원합니까?

html5는 flv 형식 파일을 지원하지 않습니다. video 태그는 기본적으로 flv 형식 파일을 지원하지 않지만 관련 플러그인을 설치하면 지원할 수 있습니다. flv는 "FLASH VIDEO"의 약어이며 FLV 스트리밍 미디어 형식은 다음과 같습니다. "MX 출시 이후 개발된 Flash A 비디오 형식"과 함께.

이 튜토리얼의 운영 환경: Windows 10 시스템, HTML5 버전, Dell G3 컴퓨터.

HTML5는 flv 파일을 지원합니까?

HTML5의 비디오 태그는 기본적으로 flv 형식 파일을 지원하지 않지만 관련 플러그인을 설치하여 지원할 수 있습니다. FLV는 FLASH VIDEO의 약어입니다. FLV 스트리밍 미디어 형식은 Flash MX 출시와 함께 개발된 비디오 형식입니다. 생성되는 파일이 매우 작고 로드 속도가 매우 빠르기 때문입니다.

현재 주류 브라우저에서는 FLV 파일을 직접 삽입하고 재생할 수 없으므로 video 태그를 사용하여 직접 재생하는 것은 불가능합니다.

따라서 두 가지 파싱 방법이 제공됩니다

• SWF 미디어 재생 파일을 삽입하고 이 파일을 사용하여 프리셋 파일을 재생하세요.

여기에서 dplayer를 추천합니다 - http://dplayer.js.org/zh/guide.html#flv (개인 테스트도 사용하기 쉽습니다)

• Bilibili의 오픈 소스 flv.js를 사용하여 변환합니다. FLV 파일 스트림은 ISO BMFF(Fragmented MP4) 세그먼트로 변환되고 mp4 세그먼트는 미디어 소스 확장 API를 통해 HTML5 요소에 제공됩니다.

github 주소: https://github.com/bilibili/flv.js

flv.js는 HTML5 비디오에서 FLV 형식 비디오 재생을 지원하는 JavaScript 라이브러리입니다. ES6에서 작성되었으며, 하위 버전이 호환된다면 Babel로 컴파일해야 합니다

여기서는 구현 데모

installation

npm install --save flv.js

element

<template>
  <div>
<video id="videoElement" controls autoplay muted width="300px" height="200px">
    </video>
<button @click="play">播放</button>
  </div>
</template>

code

import flvjs from 'flv.js'
export default {
  data () {
    return {
  flvPlayer:null
    }
  },
   mounted() {
      if (flvjs.isSupported()) {
        var videoElement = document.getElementById('videoElement');
        this.flvPlayer = flvjs.createPlayer({
          type: 'flv',
  isLive: true,
  hasAudio: false,
          url: 'http://1011.hlsplay.aodianyun.com/demo/game.flv'
        });
        this.flvPlayer.attachMediaElement(videoElement);
        this.flvPlayer.load();
this.flvPlayer.play();
      }
    },
    methods:{
      play () {
        this.flvPlayer.play();
      }
    }
}

effect

만 보여드리겠습니다. 학습 영상 공유: css 영상 튜토리얼, html 영상 튜토리얼)

위 내용은 html5는 flv 파일을 지원합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!