姓名：許立阴颖；學(xué)號(hào)：21011210048活喊；學(xué)院：通信工程學(xué)院
【嵌牛導(dǎo)讀】對(duì)接海康威視的攝像頭量愧，在官網(wǎng)下載了sdk開(kāi)發(fā)包钾菊，心里還想這個(gè)應(yīng)該不會(huì)太難，畢竟嘿怂啵康也算大公司煞烫，各種對(duì)接方式應(yīng)該都是成熟的，打開(kāi)sdk包里面還是挺齊全的MFC累颂、java滞详、c#都有凛俱，依次調(diào)試?yán)镆幌拢寄軐?duì)接成功料饥，不過(guò)不是我想要web方式對(duì)接蒲犬，都是C/S架構(gòu)的，我想要的是B/S方式對(duì)接岸啡。
【嵌牛鼻子】涸＃康威視視頻控件
【嵌牛提問(wèn)】看完本文你有沒(méi)有動(dòng)手試試呢
【嵌牛正文】
運(yùn)行環(huán)境與設(shè)備支持：
海康控件開(kāi)發(fā)包鏈接：
32位瀏覽器：
https://pan.baidu.com/s/160ia40-hlFd1MynbxSBI2Q? 密碼：d3pf
64位瀏覽器：
https://pan.baidu.com/s/1TbNHqfZSw9PPS4Z-xYvcoQ? 密碼：38qq
Web控件V3.0基于ActiveX和NPAPI開(kāi)發(fā)巡蘸，接口封裝于JavaScript腳本奋隶，以JavaScript接口形式提供用戶集成，支持網(wǎng)頁(yè)上實(shí)現(xiàn)預(yù)覽赡若、回放达布、云臺(tái)控制等功能。該控件僅支持B/S開(kāi)發(fā)逾冬，不適用C/S開(kāi)發(fā)黍聂。
Web控件V3.0支持多種我司設(shè)備，包括DVR身腻、NVR产还、DVS、網(wǎng)絡(luò)攝像機(jī)嘀趟、網(wǎng)絡(luò)球機(jī)等脐区，設(shè)備需要支持PSIA或ISAPI協(xié)議。
該控件所需運(yùn)行環(huán)境：
操作系統(tǒng):WindowsXP她按、Windows7牛隅、Windows8、Windows8.1（實(shí)際上目前Windows10也可以用）
瀏覽器：
IE8~IE11酌泰、Chrome31+媒佣、Firefox35+，32位瀏覽器
IE8~IE11陵刹、Chrome31~Chrome44默伍、Firefox35~Firefox51，64位瀏覽器
（ps：這里其實(shí)有很大的坑衰琐，瀏覽器一旦版本位數(shù)沒(méi)有和插件對(duì)上也糊，頁(yè)面顯示就會(huì)有問(wèn)題，很多人沒(méi)看清這點(diǎn)盲目上手就踩在了這一點(diǎn)上）
HTTPS播放需要開(kāi)啟Websockets
?首先要開(kāi)啟https羡宙，并且要啟用Websockets（否則會(huì)因?yàn)閣ss連接不成功而提示預(yù)覽失敗狸剃，這個(gè)卡了我很久最終領(lǐng)導(dǎo)試的時(shí)候才發(fā)現(xiàn)的，這玩意不放在一起真是坑死我了狗热。）捕捂，然后可以通過(guò)https來(lái)訪問(wèn)攝像頭正常播放了：
WEB無(wú)插件SDK開(kāi)發(fā)時(shí)發(fā)現(xiàn)wss播放異常
?WEB無(wú)插件SDK本質(zhì)就是在中間多加一個(gè)nginx進(jìn)行轉(zhuǎn)發(fā)瑟枫，nginx通過(guò)請(qǐng)求中的Cookie找到攝像頭的IP地址進(jìn)行轉(zhuǎn)發(fā)（海康通過(guò)這種cookie值來(lái)跳轉(zhuǎn)還是蠻新奇的指攒，我還第一次見(jiàn)這種操作）：
開(kāi)發(fā)時(shí)慷妙，我使用的是21年9月份的版本(WEB無(wú)插件開(kāi)發(fā)包_20210918_20210922140917)，http/ws播放正常允悦，而https/wss播放是有問(wèn)題的膝擂，經(jīng)過(guò)修改了部分SDK的代碼（經(jīng)過(guò)壓縮過(guò)的代碼改起來(lái)是蠻麻煩的），終于連上去了隙弛。但經(jīng)修改后的wss直接連接的是攝像頭的地址而不是nginx地址導(dǎo)致了證書(shū)問(wèn)題架馋，會(huì)提示failed： Error in connection establishment:net::ERR_CERT_AUTHORITY_INVALID(這里我使用的chrome只會(huì)提示failed:，用Edge才有完整的錯(cuò)誤提示全闷，這個(gè)也坑了我好久叉寂，之前我一直瞎嘗試，用了Edge才發(fā)現(xiàn)真正的問(wèn)題总珠。 )屏鳍，搜了一下是自簽名證書(shū)會(huì)存在的問(wèn)題，需要先讓瀏覽器https訪問(wèn)攝像頭讓瀏覽器允許這個(gè)證書(shū)才能正常wss連接局服。（測(cè)試期間钓瞭，發(fā)現(xiàn)我的電腦能播放，其它人的電腦不能播放淫奔，定位了大半天才發(fā)現(xiàn)原來(lái)是這個(gè)問(wèn)題）
雖然我改了SDK源代碼來(lái)實(shí)現(xiàn)播放山涡，但還是沒(méi)達(dá)到真正的效果，真正的效果應(yīng)該是wss連接nginx唆迁，而不是直連攝像頭鸭丛，這才能避開(kāi)自簽名證書(shū)不能播放問(wèn)題以及網(wǎng)段不同時(shí)不能直連攝像頭的問(wèn)題。
?禾圃穑康威視開(kāi)發(fā)下載包系吩，最新的版本是10月份的，仍然是無(wú)法播放HTTPS的妒蔚，估計(jì)還沒(méi)開(kāi)發(fā)完。(而且這個(gè)版引入了新BUG月弛，設(shè)置窗口大小無(wú)法傳入百分比肴盏。)
?過(guò)完年后，試試看能不能繞過(guò)帽衙，本來(lái)我是想著翰嗽恚康的BUG讓海康自己去修厉萝，我等待官方更新就好了恍飘，但就是現(xiàn)在想要搞出來(lái)榨崩，不要拖，所以只能繼續(xù)嘗試章母。經(jīng)過(guò)再次嘗試母蛛，將原本wss直連攝像頭的那部分代碼改成指向nginx，一開(kāi)始連不上乳怎，經(jīng)過(guò)對(duì)比Cookie發(fā)現(xiàn)是里面的值錯(cuò)了彩郊，再次修改便成功了。nginx的配置如下：
server {
listen 443 ssl;
server_name www.test.com;
ssl_certificate 6749255_www.test.com.pem;
ssl_certificate_key 6749255_www.test.com.key;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_server_ciphers on;
? ? ? location / {
? root? "D:\test";
? ? ? ? ? index? index.html index.htm;
}
? ? ? location ~ /ISAPI|SDK/ {
? ? ? ? ? proxy_set_header 'sec-ch-ua' "";
? ? ? ? ? proxy_set_header 'sec-ch-ua-mobile' "";
? ? ? ? ? proxy_set_header 'sec-ch-ua-platform:' "";
? ? ? ? ? proxy_set_header 'Sec-Fetch-Dest' "";
? ? ? ? ? proxy_set_header 'Sec-Fetch-Mode' "";
? ? ? ? ? proxy_set_header 'Sec-Fetch-Site' "";
? ? ? ? ? if ($http_cookie ~ "webVideoCtrlProxy=(.+)") {
? ? ? ? ? ? ? proxy_pass https://$cookie_webVideoCtrlProxy;
? ? ? ? ? ? ? break;
? ? ? ? ? }
? ? ? }
? ? ? location ^~ /webSocketVideoCtrlProxy {
? ? ? ? ? #web socket
? ? ? ? ? proxy_http_version 1.1;
? ? ? ? ? proxy_set_header Upgrade $http_upgrade;
? ? ? ? ? proxy_set_header Connection "upgrade";
? ? ? ? ? proxy_set_header Host $host;
? ? ? ? ? if ($http_cookie ~ "webVideoCtrlProxyWss=(.+)") {
? ? ? ? ? ? ? proxy_pass https://$cookie_webVideoCtrlProxyWss/$cookie_webVideoCtrlProxyWsChannel?$args;
? ? ? ? ? ? ? break;
? ? ? ? ? }
? ? ? }
}
