vue编写视频监控前端

工程参考

• 一篇文章教你使用Vue实现海康监控视频播放

vue学习

node安装

1.1 安装nvm-setup.exe（856402188 qq群安装）
1.2 打开命令行（终端管理员）
nvm install 20(安装node的20) （报错1和解决方案1）
1.3 nvm命令学习以及安装成功验证

输入：nvm ls（查勘版本号例如：20.13.1）
输入：nvm use 20.13.1（意思是使用这个版本）
输入：node -v（输出以上版本号说明安装成功）
输入：npm-v（成功输出版本号说明成功）

1.4 配置vscode
从856402188 qq群找到my-vue-app.zip，解压，使用vscode打开，安装vue插件，control j打开vue工程的终端
输入npm i命令安装依赖，依赖安装完成后，输入npm run dev命令安装vite相关开发插件

vue基础

一个app.vue文件包含三个部分
script：用于编写js脚本
template：用于编写html
style：用于编写css

html基础

函数监听：@

报错和解决

问题1

问题1：
Could not retrieve https://nodejs.org/dist/latest-v20.x/SHASUMS256.txt
Get "https://nodejs.org/dist/latest-v20.x/SHASUMS256.txt": dial tcp 104.20.22.46:443: i/o timeout
解决方案1

解决方案1

• nvm下载node报错

1 everything找到nvm安装的路径，使用记事本打开setting.txt，在root和path后面添加两行
node_mirror:https://npmmirror.com/mirrors/node/
npm_mirror:https://npmmirror.com/mirrors/node/
2 重新运行，nvm install 20，系统就会开始安装node

问题2

解决vite不是内部或外部命令，也不是可运行的程序 或批处理文件。

解决方案1

• 解决vite不是内部或外部命令，也不是可运行的程序 或批处理文件。

海康sdk准备工作

海康开放平台-支持与服务-工具下载-硬件产品-web开发包
海康开放平台-开放体系-设备能力开放-查询推荐协议-输入设备型号-选择组网环境-
DS-IPC-B12HV3-IA

设备激活

SADP工具激活

• 海康产品的激活与访问

• 设备上电，使用网线连接局域网

• 在海康威视官网-服务支持-工具专区-搜索“SADP”，并点击下载

• 解压SADP软件并打开，查看搜索到的设备，输入新密码，点击激活

• 修改电脑的ip地址，控制面板，网络和Internet > 网络和共享中心。
  用户名：admin
  密码：1Ar
  ip：192.168.1.64
  设备端口：8000
  rtsp端口：554
  rtsp://admin:1Artonelico!@192.168.1.64:554/Streaming/Channels/101
  
  npm install -g yarn
  yarn install
  yarn serve
  yarn build

vue项目学习

• 视频监控智能分析系统 数据可视化大屏 vue3