vue ?????? Hikvision ??? SDK ??? ???? ??? ??

? ??? ???? ??? ?? (Zlmediakit)? ?? Hikvision Camera SDK? ?? ???? ?????? ??? ???? Vue ??? ?? ?????? ????? ?????. ?? ????? ???? ??? ???? ???? ??? ???? ?? ???? ?? ?????.

??? ???? ? ?? ????

? ???? 3 ? ????? ?????.

1. Hikvision ??? ? ??? (Spring Boot) : Hikvision SDK? ???? ??? ??? ????? ????.
2. ???? ??? ?? (ZlMediaKit) : ?????? ???? ?? ?? ??? ??? ???? ???? ?????.
3. ??? ?? (VUE) : ????? ?? ZlMediakit?? RTSP ???? ??.

??? (Java) ?? ?? ??

???? Spring Boot Framework? ???? ?? ??? Hikvision SDK ??? ??? ???? ZlMediaKit? ???? ????. ?? ? ??? ??? ????.

 @???
?? ??? hikvisionserviceimpl? hikvisionservice {

    // ... ?? ?? ...

    @PostConstruct
    public void register () {
        // hikVisionClient ??? ????? = new hikVisionClient ();
        client.initPipedStream ();
        client.clientinit ();
        client.action (); // ??? ?? ???? ???? ??? ??? ??? ?? ??}

    // hikvision sdk ?? ?? ??? realDatacallback ?? hcnetsdk.frealdatacallback_v30 {
        @??
        Public Void Invoke (int lrealhandle, int dwdatatype, bytebyreference pbuffer, int dwbufsize, pointer puser) {
            if (dwdatatype == hcnetsdk.net_dvr_streamdata) {
                if (dwbufsize> 0) {
                    ??? ?? ?? = pbuffer.getPointer (). getBytebuffer (0, dwbufsize);
                    ??? [] ??? = ??? ??? [dwbufsize];
                    buffer.rewind ();
                    buffer.get (???);
                    Executor.Execute (() -> PushToZlMediaKit (bytes)); // ZlMediaKit?? ?? ????
                }
            }
        }
    }

    ?? void pushtozlmediakit (byte [] data) {
        // ???? ZlMediaKit?? ???? ZlMediaKit? API? ??? ??? ???????.
        // ???? ????? (? : H.264) ????? ZlMediaKit ??? ???? ? ?? ????.
        // ... ZlMediaKit ?? ?? ...
    }
}

pushToZLMediaKit ??? ????, ?? ? ??? ???? ZlMediaKit API ??? ?? ??? ???? ?? ??? ???????. ???? ??? ?? ?? (? : ?? ???? H.264 ????? ??)? ??? ? ????.

??? ?? (VUE) ?? ?? ??

??? ??? vue ??? ??? ???? flv.js ?? hls.js? ?? ??? ??? ???? ?????? ???? Zlmediakit?? ?? RTSP ???? ?????.

 // VUE ?? ?? ?? ? ??<template>
  <video ref="videoPlayer" autoplay></video>
</template>

<script>
import flvjs from 'flv.js'; // 或hls.js

export default {
  mounted() {
    this.initPlayer();
  },
  methods: {
    initPlayer() {
      const rtspUrl = '/api/rtspStream'; // 后端提供的RTSP流地址接口
      fetch(rtspUrl)
        .then(response => response.json())
        .then(data => {
          const flvPlayer = flvjs.createPlayer({
            type: 'flv',
            url: data.rtspUrl // 獲取到的RTSP流地址
          });
          flvPlayer.attachMediaElement(this.$refs.videoPlayer);
          flvPlayer.load();
          flvPlayer.play();
        })
        .catch(error => console.error('Error fetching RTSP URL:', error));
    }
  }
};
</script>

/api/rtspStream ZlMediaKit?? ?? ? RTSP ??? ??? ???? ??? ????????.

??? ??? ??

???? ??? ????? ???? ?? ???? Hikvision SDK? ?? ??? ??? ??? ZlMediaKit (? : FLV)?? ???? ???? ???? ?? ??? ??? ?? FFMPEG? ???? ? ?? ????. ???? ?? ???? ???? ????? ??????, ??? ??? FLV.JS? ?? ?????? ?? ?? ???? ?????. ?? ???? ??? ??? ??? ???? ?? ???? ?? ? ??? ???? ???? ???????. ?? ?? ? ??? ???? ?????.

? ??? ??? ??? ?? Hikvision ??? SDK? ??? ???? ??? ?? vue ????? ???? ??? ??????? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!