bonus
/
on-site-robots-screen
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

增加接口回参解密，增加加密方式，图片回显调试，环境变量配置等

This commit is contained in:
BianLzhaoMin 2025-07-09 15:58:20 +08:00
parent e1723eb26a
commit 50c14ae22c
13 changed files with 99 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env.development
View File

@ -5,4 +5,4 @@ VITE_APP_baseApiURL = https://s.dumogu.top/api
# 路由的base api
VITE_APP_routeBasePath = /
VITE_APP_biuldBase = /
VITE_APP_imgPreviewUrl = http://192.168.0.38:21999/robot
VITE_APP_imgPreviewUrl = http://192.168.0.14:9090/robot

3
.env.production
View File

@ -4,4 +4,5 @@ VITE_APP_content = 机器人
VITE_APP_baseApiURL = /robot-screen-api
# 路由的base api
VITE_APP_routeBasePath = /robot-screen-ui
VITE_APP_biuldBase = /robot-screen-ui
VITE_APP_biuldBase = /robot-screen-ui
VITE_APP_imgPreviewUrl = http://192.168.0.38:21999/robot

7
package-lock.json generated
View File

@ -14,6 +14,7 @@
"codess": "^1.1.5",
"copy-to-clipboard": "3.3.3",
"cropperjs": "1.6.2",
"crypto-js": "^4.2.0",
"echarts": "5.5.1",
"flv.js": "^1.6.2",
"glob": "11.0.0",
@ -1692,6 +1693,12 @@
"node": ">= 8"
}
},
"node_modules/crypto-js": {
"version": "4.2.0",
"resolved": "https://repo.huaweicloud.com/repository/npm/crypto-js/-/crypto-js-4.2.0.tgz",
"integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q==",
"license": "MIT"
},
"node_modules/css-render": {
"version": "0.15.14",
"resolved": "https://registry.npmmirror.com/css-render/-/css-render-0.15.14.tgz",

1
package.json
View File

@ -17,6 +17,7 @@
"codess": "^1.1.5",
"copy-to-clipboard": "3.3.3",
"cropperjs": "1.6.2",
"crypto-js": "^4.2.0",
"echarts": "5.5.1",
"flv.js": "^1.6.2",
"glob": "11.0.0",

24
src/http/request.js
View File

@ -4,6 +4,7 @@
*/
import axios from 'axios'
import { userDataStore } from '@/store/user'
import { encrypt, decrypt } from '@/utils/encrypt'
// import { useMessage } from 'naive-ui'
import router from '@/router'
import { createDiscreteApi } from 'naive-ui'
@ -26,6 +27,8 @@ service.interceptors.request.use(
if (userData?.userInfo?.token) {
config.headers['Authorization'] = 'Bearer ' + userData?.userInfo?.token
} else {
config.headers['Token'] = 'test'
}
return config
},
@ -39,7 +42,28 @@ service.interceptors.request.use(
let modelShow = false
service.interceptors.response.use(
(response) => {
response.data = decrypt(response.data)
console.log(
'%c🔍-- 解密后出参 --',
'background: linear-gradient(90deg, #FF6B6B, #4ECDC4); color: white; padding: 5px 60px; border-radius: 5px; font-weight: bold;',
'',
)
console.log(
'%c原始数据：', //增加样式
'color: #FF6B6B; padding: 5px 0; border-radius: 5px; font-weight: bold;',
'',
'\n',
response.data,
)
console.log(
'%cJSON格式：',
'color: #4ECDC4; padding: 5px 0; border-radius: 5px; font-weight: bold;',
'\n',
JSON.stringify(response.data, null, 2),
)
const data = response.data
if (!data) {
return Promise.reject({
msg: '请求发生错误',

29
src/utils/encrypt.js Normal file
View File

@ -0,0 +1,29 @@
// 加解密方法
import CryptoJS from 'crypto-js'
// const key = 'zhst@bonus@zhst@bonus@1234567890' // 加密密钥
const key = 'jjbns@jysoft1088' // 加密密钥
const utf8Key = CryptoJS.enc.Utf8.parse(key)
// AES 加密（UTF-8 处理）
export const encrypt = (message) => {
const utf8Message = CryptoJS.enc.Utf8.parse(message)
const encrypted = CryptoJS.AES.encrypt(utf8Message, utf8Key, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7,
})
return encrypted.toString()
}
// AES 解密
export const decrypt = (encryptedBase64) => {
try {
const decrypted = CryptoJS.AES.decrypt(encryptedBase64, utf8Key, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7,
})
return JSON.parse(CryptoJS.enc.Utf8.stringify(decrypted))
} catch (error) {
return encryptedBase64
}
}

5
src/views/home/components/center-two.vue
View File

@ -3,9 +3,9 @@
<div class="center-two child-container">
<n-flex justify="space-between">
<TitleBackground :title="`现场定点巡检拍照`" width="50%" />
<div class="more-btn" @click="onHandleMore">更多</div>
</n-flex>
<div class="marquee-outer" ref="marqueeOuterRef">
<div class="marquee-container" ref="marqueeContainer">
<div class="marquee-track" :style="{ width: trackWidth }">
@ -195,8 +195,7 @@ const imgOuterList = ref([]) // 一级页面数据
const imgInnerList = ref([]) // 二级页面数据
const innerTotal = ref(0)
const ranger = ref(null)
const imgPreviewUrl = ref('http://192.168.0.38:21999/robot') // 图片预览地址
const imgPreviewUrl = import.meta.env.VITE_APP_imgPreviewUrl // 图片预览地址
const innerQueryParams = ref({
pageNum: 1,
pageSize: 8,

8
src/views/home/components/modal-content/add-or-edit-marker-form.vue
View File

@ -317,7 +317,11 @@ const onHandleConfirm = () => {
}
const onHandleGoToPoint = () => {
handleRobotAction(Math.ceil(markerParams.value.xCount), Math.ceil(markerParams.value.yCount))
handleRobotAction(
Math.ceil(markerParams.value.xCount),
Math.ceil(markerParams.value.yCount),
deviceInfo.value?.puId,
)
}
const onlyAllowNumber = (value) => !value || /^\d+$/.test(value)
@ -337,9 +341,11 @@ watch(
markerParams.value.yCount = Math.ceil(newVal?.yCount).toString()
if (newVal?.type === '新增') {
deviceInfo.value = await getRobotDeviceListFn()
handleRobotAction(
Math.ceil(markerParams.value.xCount),
Math.ceil(markerParams.value.yCount),
deviceInfo.value?.puId,
)
} else {
markerParams.value.id = newVal?.id

12
src/views/home/components/right-one.vue
View File

@ -377,7 +377,7 @@ const activeIndex = ref(0) // 当前选中的tab
const message = useMessage()
const dialog = useDialog()
const outerUserList = ref([]) // 外侧一级列表数据
const imgPreviewUrl = ref('http://192.168.0.38:58080/robot') // 图片预览地址
const imgPreviewUrl = import.meta.env.VITE_APP_imgPreviewUrl // 图片预览地址
const ranger_1 = ref(null) // 人员动态时间选择器
const ranger_2 = ref(null) // 人员信息时间选择器
const previewFileList = ref([]) // 预览文件列表
@ -528,7 +528,7 @@ const tableColumns_1 = ref([
return h(NImage, {
width: '48px',
height: '48px',
src: imgPreviewUrl.value + row.dataImage,
src: imgPreviewUrl + row.dataImage,
fit: 'cover',
})
},
@ -541,7 +541,7 @@ const tableColumns_1 = ref([
return h(NImage, {
width: '48px',
height: '48px',
src: imgPreviewUrl.value + row.image,
src: imgPreviewUrl + row.image,
fit: 'cover',
})
},
@ -787,7 +787,7 @@ const tableColumns_2 = ref([
return h(NImage, {
width: '48px',
height: '48px',
src: imgPreviewUrl.value + row.image,
src: imgPreviewUrl + row.image,
fit: 'cover',
})
},
@ -858,14 +858,14 @@ const onHandleBtn = (row, btnType) => {
addOrEditPersonForm.value.idCard = idCard
addOrEditPersonForm.value.id = id
addOrEditPersonForm.value.facePhoto = [
{ url: imgPreviewUrl.value + image, id: 996, name: '我很帅.png', status: 'finished' },
{ url: imgPreviewUrl + image, id: 996, name: '我很帅.png', status: 'finished' },
]
previewFileList.value = [
{
id: 996,
name: '我很帅.png',
status: 'finished',
url: imgPreviewUrl.value + image,
url: imgPreviewUrl + image,
},
]
addPersonPanelVisible.value = true

4
src/views/home/components/right-two/taps-one.vue
View File

@ -43,7 +43,7 @@ import { getImagePageListApi } from '@/api/home'
const total = ref(0)
const dateRange = ref(null)
const imgPreviewUrl = ref('http://192.168.0.38:21999/robot')
const imgPreviewUrl = import.meta.env.VITE_APP_imgPreviewUrl
const columns = ref([
{
@ -80,7 +80,7 @@ const columns = ref([
return h(NImage, {
width: '48px',
height: '48px',
src: imgPreviewUrl.value + row.image,
src: imgPreviewUrl + row.image,
fit: 'cover',
})
},

6
src/views/home/components/right-two/taps-three.vue
View File

@ -58,7 +58,7 @@ import { NImage } from 'naive-ui'
import { getImagePageListApi } from '@/api/home'
const total = ref(0)
const tableData = ref([])
const imgPreviewUrl = ref('http://192.168.0.38:21999/robot')
const imgPreviewUrl = import.meta.env.VITE_APP_imgPreviewUrl
const queryParams = ref({
pageNum: 1,
pageSize: 10,
@ -101,7 +101,7 @@ const columns = ref([
return h(NImage, {
width: '48px',
height: '48px',
src: imgPreviewUrl.value + row.image,
src: imgPreviewUrl + row.image,
fit: 'cover',
})
},
@ -114,7 +114,7 @@ const columns = ref([
return h(NImage, {
width: '48px',
height: '48px',
src: imgPreviewUrl.value + row.lastImage,
src: imgPreviewUrl + row.lastImage,
fit: 'cover',
})
},

2
src/views/home/components/right-two/taps-two.vue
View File

@ -57,7 +57,7 @@ import { getImagePageListApi } from '@/api/home'
const tableContainerRef = ref(null)
const imageHeight = ref(0)
const imageWidth = ref(0)
const imgPreviewUrl = ref('http://192.168.0.38:21999/robot')
const imgPreviewUrl = import.meta.env.VITE_APP_imgPreviewUrl
const total = ref(0)
const tableData = ref([])
const queryParams = ref({

15
src/views/home/index.vue
View File

@ -89,6 +89,7 @@ import CenterTwo from './components/center-two.vue' // 中二
import RightOne from './components/right-one.vue' // 右一
import RightTwo from './components/right-two/index.vue' // 右二
import ControlDeck from './components/control-deck.vue' // 控制台
import { decrypt, encrypt } from '@/utils/encrypt'
import { getRobotTokenFn, getRobotDeviceListFn } from '@/utils/getRobotInfo' // 获取机器人信息
@ -172,7 +173,18 @@ const getTokenData = async () => {
})
}
getTokenData() // 获取token
const encryptObj = ref('')
const decryptObj = ref('')
const testEncrypt = () => {
encryptObj.value = encrypt('1234567890')
}
const testDecrypt = () => {
decryptObj.value = decrypt(encryptObj.value)
}
// getTokenData() // 获取token
onMounted(async () => {
const deviceToken = await getRobotTokenFn() // 获取设备token
@ -182,6 +194,7 @@ onMounted(async () => {
cameraNode_1.value.puid = deviceInfo.puId
cameraNode_2.value.token = deviceToken
cameraNode_1.value.token = deviceToken
// cameraNode_2.value.steamURL = `http://112.31.70.193:1854/icvs2/stream.flv?puid=${deviceInfo.puId}&idx=${cameraNode_2.value.idx}&stream=0&token=${deviceToken}`
// cameraNode_1.value.steamURL = `http://112.31.70.193:1854/icvs2/stream.flv?puid=${deviceInfo.puId}&idx=${cameraNode_1.value.idx}&stream=0&token=${deviceToken}`
// cameraNode_2.value.steamURL = `http://112.31.70.193:1854/icvs2/stream.flv`