current position:Home>Use Hikvision Web3 in vue3 2. Live broadcast without plug-in version (II)

Use Hikvision Web3 in vue3 2. Live broadcast without plug-in version (II)

2022-04-29 13:12:23WY cabbage

image.png Form writing habits together ! This is my participation 「 Nuggets day new plan · 4 Yuegengwen challenge 」 Of the 6 God , Click to see the event details .


In the last chapter, we analyzed the characteristics of Hikvision camera web3.2 Development package for , I know what I want to do web Direct connection to the camera requires the support of the camera itself webSocket Connect , Generally speaking, the cameras purchased by the company support webSocket, Personal purchases are not necessarily .

matters needing attention

1.web3.2 No real-time interphone plug-in version is not supported , Personally tested and consulted the technicians of Hikvision , Of course, there are solutions , It's just trouble , Take your own voice stream and send it through the server , Not very recommended , So just don't support it , Maybe you can update it later . 2. camera ip mapping , Because the camera stream needs to be transferred through the server , So we need to map out , If a server wants to transfer streams of multiple cameras, it needs to be configured manually webSocket port , however webSocket The connection address is always the default 7681 port , The development package provided on the official website does not specify that it can be spliced manually webSocket port , After consulting the technicians, I got a reply : You can pass it during preview iWSPort Parameters , This parameter is webSocket port , Through this, we can solve the problem of modification webSocket The default port number cannot be changed bug. 3. By 2022 year 1 At the end of the month, I was on the official website SDK After downloading, you can't play live sound , It's not clear whether it's a code problem or something , After consulting with technicians, they provided me with new SDK package , Successfully played the sound . 4. Preview multiple windows at the same time , Because I use vue Developed single page application , When you try to render two live streams directly from one page, there will be a problem that only one live stream can be played , After the study, it was found that only through iframe Tags introduced html Files solve problems , because iframe Is complete environmental isolation .

Process implementation

Initializing plug-ins

 Copy code 

Unicom camera

 Copy code 

Get analog channel

 Copy code 

Get the channel port number

 Copy code 

Start Preview

 Copy code 

Exit Preview

 Copy code 

Log out

 Copy code 

There are too many specific parameters. You can directly see the official documents

copyright notice
author[WY cabbage],Please bring the original link to reprint, thank you.

Random recommended