Springboot+Vue3 整合海康获取视频流并展示

1.后端

1.1 导入依赖

        <dependency>
            <groupId>com.hikvision.ga</groupId>
            <artifactId>artemis-http-client</artifactId>
            <version>1.1.3</version>
        </dependency>
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>fastjson</artifactId>
            <version>1.2.51</version>
        </dependency>

1.2 代码实战

新建ArtemisPostTest类，代码如下，设置认证信息，设置ArtemisConfig的host，appKey(AK)，appSecret(SK)。设置接口URL。.设置接口入参。接口调用，调用doPostStringArtemis方法（该方法内部实现了登入认证逻辑），传入接口URL，接口入参，数据提交类型等信息，完成接口调用。

public class ArtemisPostTest {
    static {
        ArtemisConfig.host = "";// 代理API网关nginx服务器ip端口
        ArtemisConfig.appKey = "";// 秘钥appkey
        ArtemisConfig.appSecret = "";// 秘钥appSecret
    }
    /**
     * 能力开放平台的网站路径
     * TODO 路径不用修改，就是/artemis
     */
    private static final String ARTEMIS_PATH = "/artemis";

   public static String path="";
   public static JSONObject jsonBody=new JSONObject();

    /**
     * 调用POST请求类型(application/json)接口，这里以入侵报警事件日志为例
     * https://open.hikvision.com/docs/918519baf9904844a2b608e558b21bb6#e6798840
     *
     * @return
     */
    public static String callPostStringApi(){
        /**
         * http://10.33.47.50/artemis/api/scpms/v1/eventLogs/searches
         * 根据API文档可以看出来，这是一个POST请求的Rest接口，而且传入的参数值为一个json
         * ArtemisHttpUtil工具类提供了doPostStringArtemis这个函数，一共六个参数在文档里写明其中的意思，因为接口是https，
         * 所以第一个参数path是一个hashmap类型，请put一个key-value，query为传入的参数，body为传入的json数据
         * 传入的contentType为application/json，accept不指定为null
         * header没有额外参数可不传,指定为null
         *
         */
        final String getCamsApi = ARTEMIS_PATH +ArtemisPostTest.path;
        Map<String, String> path = new HashMap<String, String>(2) {
            {
                put("https://", getCamsApi);//根据现场环境部署确认是http还是https
            }
        };



        String body = jsonBody.toJSONString();

        String result = ArtemisHttpUtil.doPostStringArtemis(path,body,null,null,"application/json",null);// post请求application/json类型参数
        return result;
    }

   
   
}

新建实体类Camera代码如下：

@Data
@AllArgsConstructor
@NoArgsConstructor
@Accessors(chain = true)
public class Camera {
    String cameraIndexCode;
    String camereName;
    String url;
}

在Controller中进行调用，代码如下：

首先根据分页获取监控点列表，这里获取的是第三页，每一页为六个监控点。

查询监控点列表v2

接口说明

根据条件查询目录下有权限的监控点列表

接口版本

v2

接口地址

/api/resource/v2/camera/search

请求方法

POST

数据提交方式

application/json

然后根据监控点唯一的标识获取预览url