增加通讯

chenyc

2023-11-14 7394e5e60ec25ede11d1ef88358454da8f9c7390

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
import { createApp } from 'vue'
import ElementPlus, { MessageParams } from 'element-plus'
import 'element-plus/dist/index.css'
import router from './router/index'
import "tracking";
import "tracking/build/data/face";
import { ElMessage } from 'element-plus';
import { createPinia } from 'pinia'
import App from './App.vue'
import './samples/node-api'
 
function getUserMedia(constrains:any, success:any, error:any) {
  if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
      //最新标准API
      ElMessage({ type: 'success', message: '支持人脸识别最新Api' });
      navigator.mediaDevices.getUserMedia(constrains).then(success).catch(error);
  } else if (navigator.webkitGetUserMedia) {
    ElMessage({ type: 'success', message: '支持webkit内核浏览器' });
      //webkit内核浏览器
      navigator.webkitGetUserMedia(constrains).then(success).catch(error);
  } else if (navigator.mozGetUserMedia) {
    ElMessage({ type: 'success', message: '支持Firefox浏览器' });
      //Firefox浏览器
      navagator.mozGetUserMedia(constrains).then(success).catch(error);
  } else if (navigator.getUserMedia) {
    ElMessage({ type: 'success', message: '支持旧版API' });
      //旧版API
      navigator.getUserMedia(constrains).then(success).catch(error);
  } else {
    ElMessage('浏览器不支持getUserMedia');
  }
}
// 要重写initUserMedia_ 方法，因为chrome的底层api已做调整
window.tracking.initUserMedia_ = function (element: { srcObject: any; src: string; }, opt_options: { audio: any; }) {
  const options = {
      video: true,
      audio: !!(opt_options && opt_options.audio)
  };
  getUserMedia(options, function (stream: Blob | MediaSource) {
      try {
          element.srcObject = stream;
      } catch (err) {
          element.src = window.URL.createObjectURL(stream);
      }
  }, function (e: { message: MessageParams; }) {
    ElMessage(e.message);
  }
  );
};
// 重写视频捕获方法，因为不能停止 stop无效的bug
window.tracking.trackVideo_ = function (element: CanvasImageSource, tracker: tracking.Tracker) {
  console.log('trackVideo_');
  var canvas = document.createElement('canvas');
  var context = canvas.getContext('2d');
  var width: number;
  var height: number;
 
  var resizeCanvas_ = function () {
      width = element.offsetWidth;
      height = element.offsetHeight;
      canvas.width = width;
      canvas.height = height;
  };
  resizeCanvas_();
  element.addEventListener('resize', resizeCanvas_);
 
  var requestId: number;
  var stopped = false;
  var requestAnimationFrame_ = function () {
      requestId = window.requestAnimationFrame(function () {
          if (element.readyState === element.HAVE_ENOUGH_DATA) {
              try {
                  // Firefox v~30.0 gets confused with the video readyState firing an
                  // erroneous HAVE_ENOUGH_DATA just before HAVE_CURRENT_DATA state,
                  // hence keep trying to read it until resolved.
                  context.drawImage(element, 0, 0, width, height);
              } catch (err) { }
              tracking.trackCanvasInternal_(canvas, tracker);
          }
          if (stopped !== true) {
              requestAnimationFrame_();
          }
      });
  };
  var task = new tracking.TrackerTask(tracker);
  task.on('stop', function () {
      stopped = true;
      window.cancelAnimationFrame(requestId);
  });
  task.on('run', function () {
      stopped = false;
      requestAnimationFrame_();
  });
  return task.run();
};
createApp(App)
  .use(createPinia())
  .use(ElementPlus)
  .use(router)
  .mount('#app')
  .$nextTick(window.removeLoading)