master
qiushui
4 years ago
parent
fc5cfbb239
commit
038ef5285c
@ -1 +1 @@
|
|||||||
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/favicon.ico><link href=/video_play_plugins/video-js-cdn.min.css rel=stylesheet><script src=/video_play_plugins/video.js></script><script src=/video_play_plugins/videojs-contrib-hls.min.js></script><script src=/video_play_plugins/videojs-contrib-hls.min.js></script><title>垛机视觉系统</title><link href=/js/chunk-056f57be.304f9691.js rel=prefetch><link href=/js/chunk-0ab3aab0.5a54350c.js rel=prefetch><link href=/js/chunk-0e4de15d.e25b36f7.js rel=prefetch><link href=/js/chunk-122fafcf.78d242c8.js rel=prefetch><link href=/js/chunk-1e8ac3a9.34967a32.js rel=prefetch><link href=/js/chunk-2d0e95df.02d8a418.js rel=prefetch><link href=/js/chunk-2e508108.d858bfbf.js rel=prefetch><link href=/js/chunk-47777934.4b42020a.js rel=prefetch><link href=/js/chunk-4df94765.cccb17b3.js rel=prefetch><link href=/js/chunk-4e0fc9bc.16ffda3b.js rel=prefetch><link href=/js/chunk-6c799606.e6c34d0e.js rel=prefetch><link href=/js/chunk-7140b3ea.1f0eba3c.js rel=prefetch><link href=/js/chunk-813fd848.468f77ca.js rel=prefetch><link href=/js/chunk-95d7389c.bca6f8f3.js rel=prefetch><link href=/js/chunk-a6c02796.a55b6ef2.js rel=prefetch><link href=/js/chunk-c4503cf6.657b26dc.js rel=prefetch><link href=/js/chunk-d8c3b5aa.e36d8a2c.js rel=prefetch><link href=/js/chunk-e0f9bdd0.0eb55b03.js rel=prefetch><link href=/js/chunk-e205a644.2096910b.js rel=prefetch><link href=/js/chunk-e63447d2.b91f7eb2.js rel=prefetch><link href=/js/app.1603b7e4.js rel=preload as=script><link href=/js/chunk-vendors.7fd227c6.js rel=preload as=script></head><body><noscript><strong>We're sorry but 垛机视觉系统 doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><link rel=stylesheet/less type=text/css href=/antd_color.less><script src=/js/chunk-vendors.7fd227c6.js></script><script src=/js/app.1603b7e4.js></script></body></html>
|
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/favicon.ico><script src=/video_play_plugins/webrtcplayer.js></script><title>垛机视觉系统</title><link href=/js/chunk-0ab3aab0.4c3f3c96.js rel=prefetch><link href=/js/chunk-0e4de15d.a97ad19e.js rel=prefetch><link href=/js/chunk-1e8ac3a9.8e64425e.js rel=prefetch><link href=/js/chunk-2d0e95df.0653993e.js rel=prefetch><link href=/js/chunk-47777934.0d571617.js rel=prefetch><link href=/js/chunk-4869f649.79582df2.js rel=prefetch><link href=/js/chunk-4df94765.b8bb21a0.js rel=prefetch><link href=/js/chunk-4e0fc9bc.89b9eee2.js rel=prefetch><link href=/js/chunk-58a5805e.558c7ec3.js rel=prefetch><link href=/js/chunk-6c799606.f7358b25.js rel=prefetch><link href=/js/chunk-813fd848.8c26bfc8.js rel=prefetch><link href=/js/chunk-9009cff0.17d0909e.js rel=prefetch><link href=/js/chunk-a6c02796.f1fbf124.js rel=prefetch><link href=/js/chunk-c4503cf6.f87a9e24.js rel=prefetch><link href=/js/chunk-d8c3b5aa.e3ccd73d.js rel=prefetch><link href=/js/chunk-ddcf4402.905be0c6.js rel=prefetch><link href=/js/chunk-dfe57506.28616dbf.js rel=prefetch><link href=/js/chunk-e205a644.3407f2b8.js rel=prefetch><link href=/js/chunk-e63447d2.59877265.js rel=prefetch><link href=/js/app.043156f5.js rel=preload as=script><link href=/js/chunk-vendors.7fd227c6.js rel=preload as=script></head><body><noscript><strong>We're sorry but 垛机视觉系统 doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><link rel=stylesheet/less type=text/css href=/antd_color.less><script src=/js/chunk-vendors.7fd227c6.js></script><script src=/js/app.043156f5.js></script></body></html>
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,123 @@
|
|||||||
|
class WebRtcPlayer {
|
||||||
|
static server = '127.0.0.1:8083';
|
||||||
|
webrtc = null;
|
||||||
|
video = null;
|
||||||
|
server = null;
|
||||||
|
codecLink = null;
|
||||||
|
rsdpLink = null;
|
||||||
|
stream = new MediaStream();
|
||||||
|
uuid = null;
|
||||||
|
options={
|
||||||
|
onStatusChange:null
|
||||||
|
};
|
||||||
|
|
||||||
|
constructor(video1, uuid, options={}) {
|
||||||
|
console.log("new uuid:"+uuid)
|
||||||
|
this.server = WebRtcPlayer.server;
|
||||||
|
//this.video = document.getElementById(id);
|
||||||
|
this.video = video1
|
||||||
|
this.uuid = uuid;
|
||||||
|
Object.assign(this.options, options);
|
||||||
|
this.createLinks();
|
||||||
|
this.play();
|
||||||
|
}
|
||||||
|
|
||||||
|
createLinks() {
|
||||||
|
this.codecLink = "//" + this.server + "/stream/codec/" + this.uuid
|
||||||
|
this.rsdpLink = "//" + this.server + "/stream/receiver/" + this.uuid
|
||||||
|
}
|
||||||
|
|
||||||
|
play() {
|
||||||
|
this.webrtc = new RTCPeerConnection({
|
||||||
|
iceServers: [{
|
||||||
|
urls: ["stun:stun.l.google.com:19302"]
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
if(this.webrtc){
|
||||||
|
|
||||||
|
}else{
|
||||||
|
console.log("no")
|
||||||
|
}
|
||||||
|
this.webrtc.onnegotiationneeded = this.handleNegotiationNeeded.bind(this);
|
||||||
|
this.webrtc.ontrack = this.onTrack.bind(this);
|
||||||
|
fetch(this.codecLink)
|
||||||
|
.then((response) => {
|
||||||
|
response.json().then((data) => {
|
||||||
|
data.forEach((item, i) => {
|
||||||
|
this.webrtc.addTransceiver(item.Type, {
|
||||||
|
'direction': 'sendrecv'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch((error) => {
|
||||||
|
console.log(error);
|
||||||
|
});
|
||||||
|
|
||||||
|
this.webrtc.onconnectionstatechange = () => {
|
||||||
|
if(this.webrtc.connectionState == 'connected' || this.webrtc.connectionState == 'connecting'){
|
||||||
|
console.log("uuid:"+this.uuid+" status:" + this.webrtc.connectionState)
|
||||||
|
}else{
|
||||||
|
console.log(this.webrtc.connectionState)
|
||||||
|
this.load(this.uuid);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async handleNegotiationNeeded() {
|
||||||
|
let offer = await this.webrtc.createOffer();
|
||||||
|
await this.webrtc.setLocalDescription(offer);
|
||||||
|
let formData = new FormData();
|
||||||
|
formData.append('suuid', this.uuid);
|
||||||
|
formData.append('data', btoa(this.webrtc.localDescription.sdp));
|
||||||
|
fetch(this.rsdpLink, {
|
||||||
|
method: 'POST',
|
||||||
|
body: formData
|
||||||
|
})
|
||||||
|
.then((response) => {
|
||||||
|
response.text().then((data) => {
|
||||||
|
this.webrtc.setRemoteDescription(new RTCSessionDescription({
|
||||||
|
type: 'answer',
|
||||||
|
sdp: atob(data)
|
||||||
|
}))
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch((err) => {})
|
||||||
|
}
|
||||||
|
|
||||||
|
onTrack(event) {
|
||||||
|
this.stream.addTrack(event.track);
|
||||||
|
this.video.srcObject = this.stream;
|
||||||
|
this.video.play();
|
||||||
|
}
|
||||||
|
|
||||||
|
load(uuid) {
|
||||||
|
this.destroy();
|
||||||
|
this.uuid = uuid;
|
||||||
|
this.createLinks();
|
||||||
|
this.play();
|
||||||
|
}
|
||||||
|
|
||||||
|
destroy() {
|
||||||
|
console.log("destroy uuid:"+this.uuid)
|
||||||
|
this.webrtc.close();
|
||||||
|
this.webrtc = null;
|
||||||
|
this.video.srcObject = null;
|
||||||
|
this.stream = new MediaStream();
|
||||||
|
}
|
||||||
|
|
||||||
|
getImageUrl() {
|
||||||
|
let canvas = document.createElement("canvas");
|
||||||
|
canvas.width = this.video.videoWidth;
|
||||||
|
canvas.height = this.video.videoHeight;
|
||||||
|
canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height);
|
||||||
|
let dataURL = canvas.toDataURL();
|
||||||
|
canvas.remove();
|
||||||
|
return dataURL;
|
||||||
|
}
|
||||||
|
|
||||||
|
static setServer(serv) {
|
||||||
|
this.server = serv;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
export default WebRtcPlayer;
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 34 KiB |
@ -1,12 +0,0 @@
|
|||||||
{
|
|
||||||
"program": {
|
|
||||||
"portable": {
|
|
||||||
"pnacl-translate": {
|
|
||||||
"url": "media_player.pexe"
|
|
||||||
},
|
|
||||||
"pnacl-debug": {
|
|
||||||
"url": "media_player_unstripped.bc"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue