音视频

This commit is contained in:
2023-11-22 19:23:20 +08:00
parent 9a57e4aaab
commit 5a5f97c357
22 changed files with 13599 additions and 513 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -3,6 +3,7 @@
"version": "0.1.0",
"private": true,
"scripts": {
"server": "vue-cli-service serve --mode dev",
"local-server": "vue-cli-service serve --mode local",
"serve": "vue-cli-service serve --mode dev",
"prod-serve": "vue-cli-service serve --mode hd",

View File

@@ -3,7 +3,7 @@
<head>
<script type="text/javascript" src="./vconsole.min.js"></script>
<script>
var vConsole = new VConsole();
// var vConsole = new VConsole();
console.log('Hello world');
</script>
<meta charset="utf-8">

View File

@@ -86,6 +86,10 @@ export default {
showConfirmDialog: 0,
inviteName: 0,
showInviteConfirmDialog: 0,
videoTitle:"视频",
tuid:"",
isForce:"0",
hasVideo:"1"
};
},
mounted() {
@@ -96,6 +100,7 @@ export default {
this.isPublish = getUrlParam("isPublish");
this.isPlayer = getUrlParam("isPlayer");
this.uid = getUrlParam("uid");
this.tuid = getUrlParam("tuid");
this.uname = getUrlParam("uname");
this.roomId = getUrlParam("room");
this.inviteName = getUrlParam("inviteName");
@@ -103,6 +108,10 @@ export default {
this.topVideo = getUrlParam("uid");
this.showConfirmDialog = getUrlParam("showConfirmDialog");
this.showInviteConfirmDialog = getUrlParam("showInviteConfirmDialog");
this.hasVideo = getUrlParam("hasVideo");
this.isForce = getUrlParam("isForce");
this.voiceImg = getStatisFileUrl("/media/voice_open.png")
this.cameraImg = getStatisFileUrl("/media/camera_open.png")
@@ -114,6 +123,7 @@ export default {
this.constraints.video = false
this.isCloseCamera = true
this.cameraImg = getStatisFileUrl("/media/camera_close.png")
this.videoTitle="语音"
}
@@ -125,23 +135,25 @@ export default {
if (this.showConfirmDialog == 1) {
Dialog.confirm({
title: '是否接受?',
message: `${this.inviteName}邀请你加入视频聊天`,
message: `${this.inviteName}邀请你加入${this.videoTitle}聊天`,
})
.then(() => {
this.init();
// on confirm
})
.catch(() => {
this.videoDownAction();
location.href = "uniwebview://action?function=refuseVideoInvite";
// on cancel
});
} else if (this.showInviteConfirmDialog == 1) {
Dialog.confirm({
title: '提示',
message: `确认是否发起视频聊天?`,
message: `确认是否发起${this.videoTitle}聊天?`,
}).then(() => {
console.log("确认")
try {
this.sendInvite();
this.init();
} catch (e) {
console.log(e)
@@ -150,6 +162,7 @@ export default {
})
.catch(() => {
console.log("取消")
this.videoDownAction();
window.history.go(-1);
// on cancel
});
@@ -165,6 +178,37 @@ export default {
this.leaveRoom();
},
methods: {
sendInvite(){
let roomInfo = {
roomId: this.uid,//后面改成发起人的手机号或者id
roomName: `${this.uname}发起的视频聊天`,
creatorId: this.uid,
creatorName: this.uname,
publishId: this.uid,
publishName: this.uname,
isOver: 0,
webrtcUrl: process.env.VUE_APP_SRS_URL + this.uid + "/" + this.uid,
invitedUserList: [this.tuid],
isForce:this.isForce,
hasVideo:this.hasVideo
}
service.post(`/api/im/app/wsMsg`, {
msgType: "10000",
msgId: JSON.stringify(roomInfo),
cmd: "invite",
msgTxt: this.uname || ""
}).then((res) => {
if (res.status == 200) {
}
})
},
init() {
Notify({
message: '如视频不能播放,请点击视频列表中对应的用户上方的小视频',
@@ -330,6 +374,7 @@ export default {
}
sdk = new SrsRtcPlayerAsync();
//如果 默认指定id跟流的发布id相同则指定流
if (this.topVideo == publishId) {
const topVideo = this.$refs.videoStreamtopVideo
topVideo.srcObject = sdk.stream;
@@ -337,11 +382,21 @@ export default {
topVideo.volume = 0
topVideo.play();
};
}else {
if(this.isPublish==0){
const topVideo = this.$refs.videoStreamtopVideo
topVideo.srcObject = sdk.stream;
topVideo.onloadedmetadata = function (e) {
topVideo.volume = 0
topVideo.play();
};
}
}
video.srcObject = sdk.stream;
video.onloadedmetadata = function (e) {
// 播放自己的视频流的时候静音
if (publishId == _this.uid)
video.volume = 0
video.play();

View File

@@ -60,7 +60,9 @@ import {OL as ol} from "plot-ol/plottingol";
import GeoJSON from 'ol/format/GeoJSON'
import service from "@/utils/service";
import {appInit, getStatisFileUrl, getUrlParam} from "../utils/publicFun";
import WMTSTileGrid from 'ol/tilegrid/WMTS.js';
import {get as getProjection} from 'ol/proj.js';
import {getTopLeft, getWidth} from 'ol/extent.js';
export default {
data() {
@@ -123,13 +125,15 @@ export default {
planningVectorLayer: {},
parentPostMessageData: [],
isCanDraw: true,
from:""
};
},
mounted() {
console.log(location.href)
this.page = this.$route.query.page;
this.pageType = this.$route.query.type;
this.page = getUrlParam("page");
this.pageType = getUrlParam("type");
this.from = getUrlParam("from");
this.token = getUrlParam("token")
if (this.token !=null) {
@@ -159,6 +163,11 @@ export default {
window.addEventListener('message', (event) => {
this.isCanDraw = false
if (this.parentPostMessageData.length == 0) {
try {
console.error(event.data)
}catch (e) {
}
this.map.removeLayer(this.drawPlanningPathLayer);
this.parentPostMessageData = event.data;
this.drawPcPostMessageDataLayer()
@@ -172,9 +181,15 @@ export default {
window.addEventListener('message', (event) => {
this.isCanDraw = false
if (this.parentPostMessageData.length == 0) {
this.map.removeLayer(this.drawPlanningPathLayer);
this.parentPostMessageData = event.data;
this.drawPcPostMessageDataLayer()
if(event.data instanceof Array){
this.map.removeLayer(this.drawPlanningPathLayer);
this.parentPostMessageData = event.data;
this.drawPcPostMessageDataLayer()
}else {
this.isCanDraw=true;
}
}
});
//处理ok
@@ -264,6 +279,62 @@ export default {
})
});
// 切片方案0-18级
const projection = getProjection('EPSG:3857');
const projectionExtent = projection.getExtent();
const size = getWidth(projectionExtent) / 256;
const resolutions = new Array(19);
const matrixIds = new Array(19);
for (let z = 0; z < 19; ++z) {
resolutions[z] = size / Math.pow(2, z);
matrixIds[z] = "EPSG:3857:" + z;
}
var style = '';
var format = 'image/png';
var layerName = 'china:yangjianghedian_dt';
let baseParams = ['VERSION', 'LAYER', 'STYLE', 'TILEMATRIX', 'TILEMATRIXSET', 'SERVICE', 'FORMAT'];
let params = {
'VERSION': '1.0.0',
'LAYER': layerName,
'STYLE': style,
'TILEMATRIX': matrixIds,
'TILEMATRIXSET': projection,
'SERVICE': 'WMTS',
'FORMAT': format
};
var url = process.env.VUE_APP_MAP_URL + "/gwc/service/wmts?authkey=" + process.env.VUE_APP_MAP_AUTHKEY+"&"
for (var param in params) {
if (baseParams.indexOf(param.toUpperCase()) < 0) {
url = url + param + '=' + params[param] + '&';
}
}
url = url.slice(0, -1);
const wmtsLayer_1 = new TileLayer({
opacity: 1, //图层透明度
source: new WMTS({
url: url,
layer: "china:yangjianghedian_dt",
matrixSet: 'EPSG:3857',
format: 'image/png', // 默认:'image/jpeg'
projection: projection,
tileGrid: new WMTSTileGrid({
origin: getTopLeft(projectionExtent),
resolutions: resolutions,
matrixIds: matrixIds,
}),
style: '',
wrapX: true
})
});
this.map = new Map({
target: "map",
layers: [
@@ -272,13 +343,14 @@ export default {
// url: "http://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetPurplishBlue/MapServer/tile/{z}/{y}/{x}",
// }),
// }),
wmsLayer_1,
wmtsLayer_1,
wmsLayer_0,
],
view: new View({
projection: "EPSG:3857",
resolutions: resolutions,
projection: projection,
center: [12497018.585823221, 2476783.2447665134],
zoom: 15,
zoom: 16,
}),
});
this.map.on('singleclick', e => {
@@ -480,7 +552,14 @@ export default {
const center = ol.proj.transform(this.selectPoint, 'EPSG:3857', 'EPSG:4326');
console.log("================center: " + JSON.stringify(center))
const result = JSON.stringify(center)
location.href = "uniwebview://action?function=addAlarmPoint&params1=" + result;
if(this.from=="pc"){
window.parent.postMessage(result, "*");
}else {
location.href = "uniwebview://action?function=addAlarmPoint&params1=" + result;
}
},
pcPlanningPath() {
//https://blog.csdn.net/Raccon_/article/details/127491268
@@ -552,12 +631,16 @@ export default {
let pointList = []
featureGeoJson.geometry.coordinates.map(item => {
const _item = ol.proj.transform(item, 'EPSG:3857', 'EPSG:4326');
pointList.push(_item)
console.log(item)
item.map(_item => {
const _item1 = ol.proj.transform(_item, 'EPSG:3857', 'EPSG:4326');
pointList.push(_item1)
})
})
console.log(pointList)
window.parent.postMessage(JSON.stringify(pointList), "*");
window.parent.postMessage(JSON.stringify([pointList]), "*");
})
.catch(() => {
@@ -833,6 +916,8 @@ export default {
drawPcPostMessageDataLayer() {
const tempGeometryList = []
console.log(this.parentPostMessageData)
this.parentPostMessageData.map(item => {
tempGeometryList.push(ol.proj.transform(item, 'EPSG:4326', 'EPSG:3857'))
})

File diff suppressed because it is too large Load Diff