? ? ? ? 我們采取的方案是后端獲取視頻流返回給前端，然后前端播放

?？甸_放平臺?？低暫献魃鷳B(tài)致力打造一個能力開放體系、兩個生態(tài)圈，Hikvision AI Cloud開放平臺是能力開放體系的核心內(nèi)容。它是海康威視基于多年在視頻及物聯(lián)網(wǎng)核心技術(shù)積累之上，融合AI、大數(shù)據(jù)、云計(jì)算等技術(shù)，為合作伙伴提供的一個二次開發(fā)及創(chuàng)新的平臺。https://open.hikvision.com/docs/docId?productId=5c67f1e2f05948198c909700&version=%2Ff95e951cefc54578b523d1738f65f0a1&tagPath=%E5%AF%B9%E6%8E%A5%E6%8C%87%E5%8D%971.后端代碼

1.1 獲取設(shè)備編號

private static final String ARTEMIS_PATH = "/artemis";

/**
 * 視頻設(shè)備信息
 */
public static String getCodeList(Integer page, Integer size, String host, String appKey, String appSecret) {
    {
        /* STEP1：設(shè)置平臺參數(shù)，根據(jù)實(shí)際情況,設(shè)置host appkey appsecret 三個參數(shù).*/
        ArtemisConfig.host = host;
        ArtemisConfig.appKey = appKey;
        ArtemisConfig.appSecret = appSecret;
        String previewUrlsApi = ARTEMIS_PATH + "/api/resource/v2/encodeDevice/search";
        Map<String, String> path = new HashMap<String, String>(2) {
            {
                put("https://", previewUrlsApi);//根據(jù)現(xiàn)場環(huán)境部署確認(rèn)是http還是https
            }
        };
        String contentType = "application/json";

        ObjectMapper mapper = new ObjectMapper();
        Map<String, Object> map = new HashMap<>();
        map.put("pageNo", page);
        map.put("pageSize", size);
        String body = "";
        try {
            body = mapper.writeValueAsString(map);
        } catch (JsonProcessingException e) {
            e.printStackTrace();
        }
        return ArtemisHttpUtil.doPostStringArtemis(path, body, null, null, contentType, null);
    }
}

1.2 根據(jù)設(shè)備編號獲取視頻流

private static String getCameraPreviewUrl(String regionIndexCode, String protocol, String streamform,String host, String appKey, String appSecret) {
    /* STEP1：設(shè)置平臺參數(shù)，根據(jù)實(shí)際情況,設(shè)置host apKey appSecret 三個參數(shù).*/
    // artemis網(wǎng)關(guān)服務(wù)器ip端口
    ArtemisConfig.host = host;
    // 秘鑰appKey
    ArtemisConfig.appKey = appKey;
    // 秘鑰appSecret
    ArtemisConfig.appSecret = appSecret;

    /*** STEP2：設(shè)置OpenAPI接口的上下文*/
    final String artemisPath = "/artemis";
    final String previewUrlsApi = artemisPath + "/api/video/v2/cameras/previewURLs";
    Map<String, String> path = new HashMap<String, String>(2) {
        {
            //根據(jù)現(xiàn)場環(huán)境部署確認(rèn)是http還是https
            put("https://", previewUrlsApi);
        }
    };
    /* STEP4：設(shè)置參數(shù)提交方式*/
    String contentType = "application/json";

    /*** STEP5：組裝請求參數(shù)*/
    JSONObject jsonBody = new JSONObject();
    jsonBody.put("cameraIndexCode", regionIndexCode);
    //下面的參數(shù)是我用的參數(shù)，根據(jù)需要改成傳輸進(jìn)來的參數(shù)
    jsonBody.put("streamType", 0);
    //hls返回m3u8
    jsonBody.put("protocol", "ws");
    jsonBody.put("transmode", 1);
    //jsonBody.put("streamform", "rtp");

    String body = jsonBody.toString();
    String result = ArtemisHttpUtil.doPostStringArtemis(path, body, null, null, contentType, null);
    return result;
}

• 根據(jù)官方文檔傳輸對應(yīng)的參數(shù)?
• 官方接口限制：為保證數(shù)據(jù)的安全性，取流URL設(shè)有有效時間，有效時間為5分鐘。
• 注意不同協(xié)議的限制不同，rtsp沒得限制但前端播放麻煩，web端展示的話ws比較好

?？甸_放平臺?？低暫献魃鷳B(tài)致力打造一個能力開放體系、兩個生態(tài)圈，Hikvision AI Cloud開放平臺是能力開放體系的核心內(nèi)容。它是?？低暬诙嗄暝谝曨l及物聯(lián)網(wǎng)核心技術(shù)積累之上，融合AI、大數(shù)據(jù)、云計(jì)算等技術(shù)，為合作伙伴提供的一個二次開發(fā)及創(chuàng)新的平臺。https://open.hikvision.com/docs/docId?productId=5c67f1e2f05948198c909700&version=%2Ff95e951cefc54578b523d1738f65f0a1&tagPath=API%E5%88%97%E8%A1%A8-%E8%A7%86%E9%A2%91%E5%BA%94%E7%94%A8%E6%9C%8D%E5%8A%A1-%E8%A7%86%E9%A2%91%E8%83%BD%E5%8A%9B

1.3 控制設(shè)備

/**
 * 設(shè)備控制
 */
public static String controlling(String cameraIndexCode, Integer action, String command, Integer speed, Integer presetIndex) {
    {
        /** STEP1：設(shè)置平臺參數(shù)，根據(jù)實(shí)際情況,設(shè)置host appkey appsecret 三個參數(shù).*/
        ArtemisConfig.host = host; // artemis網(wǎng)關(guān)服務(wù)器ip端口
        ArtemisConfig.appKey = appKey;  // 秘鑰appkey
        ArtemisConfig.appSecret = appSecret;// 秘鑰appSecret
        String previewURLsApi = ARTEMIS_PATH + "/api/video/v1/ptzs/controlling";
        Map<String, String> path = new HashMap<String, String>(2) {
            {
                //根據(jù)現(xiàn)場環(huán)境部署確認(rèn)是http還是https
                put("https://", previewURLsApi);
            }
        };
        String contentType = "application/json";
        JSONObject jsonBody = new JSONObject();
        try {
            jsonBody.put("cameraIndexCode", cameraIndexCode);
            jsonBody.put("action", action);
            jsonBody.put("command", command);
            if (speed != null) {
                jsonBody.put("speed", speed);
            }
            if (presetIndex != null) {
                jsonBody.put("presetIndex", presetIndex);
            }
        } catch (JSONException e) {
            e.printStackTrace();
        }
        String body = jsonBody.toString();
        String result = ArtemisHttpUtil.doPostStringArtemis(path, body, null, null, contentType, null);
        return result;
    }
}

2.前端代碼

?？甸_放平臺?？低暫献魃鷳B(tài)致力打造一個能力開放體系、兩個生態(tài)圈，Hikvision AI Cloud開放平臺是能力開放體系的核心內(nèi)容。它是?？低暬诙嗄暝谝曨l及物聯(lián)網(wǎng)核心技術(shù)積累之上，融合AI、大數(shù)據(jù)、云計(jì)算等技術(shù)，為合作伙伴提供的一個二次開發(fā)及創(chuàng)新的平臺。https://open.hikvision.com/download/5c67f1e2f05948198c909700?type=20

• 直接拿官方demo改一下就行

3.rtsp/ws/hls/htmp不同協(xié)議視頻流的區(qū)別與優(yōu)缺點(diǎn)

RTSP(Real-Time Streaming Protocol)

????????RTSP 是一種應(yīng)用層協(xié)議，用于控制媒體播放，而不是直接傳輸媒體數(shù)據(jù)。它通常與 RTP（實(shí)時傳輸協(xié)議）一起使用，RTP 負(fù)責(zé)傳輸媒體數(shù)據(jù)。

• 優(yōu)點(diǎn)：支持實(shí)時播放，用于實(shí)時流媒體傳輸。支持流式傳輸，允許播放器隨時跳轉(zhuǎn)到視頻的不同部分。
• 缺點(diǎn)：RTSP 本身不傳輸視頻數(shù)據(jù)，而是控制數(shù)據(jù)，需要配合其他協(xié)議（如 RTP）來傳輸實(shí)際的媒體數(shù)據(jù)。對于防火墻和 NAT 穿透的支持有限，可能需要額外的設(shè)置和配置。

WS (WebSocket)

????????WebSocket 是一種雙向通信協(xié)議，可在單個 TCP 連接上進(jìn)行全雙工通信。

• 優(yōu)點(diǎn)：實(shí)時性好，支持雙向通信?？梢酝ㄟ^瀏覽器直接與服務(wù)器建立持久連接，無需頻繁的 HTTP 請求。
• 缺點(diǎn)：相對于傳統(tǒng)的 HTTP 請求，WebSocket 在一些特殊環(huán)境下可能會受到限制，如防火墻和代理服務(wù)器的設(shè)置。

HLS (HTTP Live Streaming)

????????HLS 是蘋果公司提出的一種基于 HTTP 的流媒體傳輸協(xié)議，主要用于 iOS 設(shè)備和 Safari 瀏覽器播放。

• 優(yōu)點(diǎn)：支持自適應(yīng)碼率，可以根據(jù)網(wǎng)絡(luò)情況調(diào)整視頻質(zhì)量。可以通過普通的 HTTP 服務(wù)器傳輸，易于部署和使用。
• 缺點(diǎn)：延遲較高，通常在 10-30 秒之間。對于直播流，切片時間短會增加服務(wù)器負(fù)載，切片時間長會增加延遲。

RTMP (Real-Time Messaging Protocol)

????????RTMP 是 Adobe Systems 提出的一種流媒體傳輸協(xié)議，主要用于 Flash 播放器。文章來源地址http://www.zghlxwxcb.cn/news/detail-854251.html

• 優(yōu)點(diǎn)：實(shí)時性好，適用于實(shí)時直播。低延遲，通常在 1-3 秒之間。
• 缺點(diǎn)：不被現(xiàn)代瀏覽器原生支持，需要額外的插件或支持。在移動設(shè)備上的兼容性較差，不適用于 iOS 設(shè)備和大部分移動瀏覽器。

到了這里，關(guān)于?？祵?shí)時監(jiān)控預(yù)覽視頻流接入web的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！