easywasmplayer文档地址：https://www.npmjs.com/package/easywasmplayer

一：介绍

EasyPlayer.js H5播放器，是一款可能同时反对HTTP、RTMP、HTTP-FLV、HLS（m3u8）视频直播与视频点播等多种协定，反对H.264、H.265、AAC等多种音视频编码格局，反对mse、wasm等多种解码形式，反对Windows、Linux、Android、iOS全平台终端的H5播放器。

二：html+js实现视频流播放

<!DOCTYPE html><html lang="en"> <head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>EasyWasmPlayer-Demo</title>    <script src="./EasyWasmPlayer.js"></script>     <style>      .box {        width:600px;        height:400px;      }    </style> </head><body>    <div class="box">      <div id="Player"></div>    </div>    <script>      // 实例化播放器      var Player = new WasmPlayer(null,'Player',callbackFun,{cbUserPtr:this, decodeType:"auto", openAudio:1, BigPlay:false, Height:true});      // 调用播放      Player.play('视频流地址', 1);      //播放事件回调      function callbackFun(e) {        console.log(e)      }    </script> </body> </html>

三：vue实现视频流播放

1：装置easywasmplayer

npm install @easydarwin/easywasmplayer --save

2：拷贝

将@easydarwin/easywasmplayer/EasyWasmPlayer.js和@easydarwin/easywasmplayer/libDecoder.wasm拷贝到我的项目public目录下

3：在public目录下的index.html引入easywasmplayer

<!DOCTYPE html><html lang="en">  <head>    <meta charset="utf-8" />    <meta http-equiv="X-UA-Compatible" content="IE=edge" />    <meta name="viewport" content="width=device-width,initial-scale=1.0" />    <link rel="icon" href="<%= BASE_URL %>favicon.ico" />    <title>EasyWasmPlayer-Demo</title>    <script src="./EasyWasmPlayer.js"></script>   </head>  <body>    <div id="app"></div>  </body></html>

4：应用easywasmplayer实现视频流播放

<template>  <div class="box">    <div id="Player"></div>  </div></template><script> export default {  data() {    return {      player: '',      url: '视频流地址'    }  },  mounted() {    // 实例化播放器    this.player = new WasmPlayer(null, 'Player', this.callbackfun)    // 调用播放    this.player.play(this.url, 1)  },  methods: {    //播放事件回调    callbackfun(e) {      console.log('callbackfun', e);    }  }  }</script><style>  .box {    width:600px;    height:400px;  }</style>