vue2实现播放rtsp视频

要在Vue 2中播放RTSP视频，可以使用video.js和vue-video-player插件。这些插件可以帮助你轻松地集成视频播放器到你的Vue 2应用程序中，并支持RTSP协议。

首先，安装必要的依赖：

npm install video.js vue-video-player --save

然后，在需要播放RTSP视频的Vue组件中，导入和使用vue-video-player组件。以下是一个简单的示例：

<template>
  <div>
    <video-player ref="player" :options="playerOptions" @play="onPlayerPlay"></video-player>
  </div>
</template>

<script>
import VideoPlayer from 'vue-video-player'
import 'video.js/dist/video-js.css'

export default {
  components: {
    VideoPlayer
  },
  data () {
    return {
      playerOptions: {
        autoplay: true,
        controls: true,
        sources: [{
          type: 'video/rtsp',
          src: 'rtsp://example.com/stream'
        }]
      }
    }
  },
  methods: {
    onPlayerPlay () {
      console.log('Player is playing')
    }
  }
}
</script>

在上面的代码中，我们导入了vue-video-player组件，并将其注册为Vue组件。然后，我们在模板中使用这个组件，并将RTSP视频的URL指定为sources选项的一部分。

你还可以根据需要配置其他选项，例如自动播放、控件和事件处理程序。当播放器开始播放时，我们将触发一个简单的回调函数来记录一条消息。

最后，确保引入了video.js的CSS文件，以便正确显示播放器UI。

这是一个简单的示例，你可以根据自己的需求进行更改和扩展。