@anton99zel
29а класс средней школы №7

Как исправить ошибку: Uncaught ReferenceError...?

<html>
<body>
<img id="img1">
<video id="webcam" width="400" height="300" autoplay></video>
<canvas id="overlay" width="400" height="300"></canvas>
<style>
#webcam, #overlay {position: absolute;top: 0;left: 0;}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script  type="text/javascript" src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@0.12.0"></script>
<script  type="text/javascript" src="https://raw.githubusercontent.com/auduno/clmtrackr/dev/build/clmtrackr.js"></script>
<script type="text/javascript" >
$(document).ready(function() {
  const video = $('#webcam')[0];
const ctrack = new clm.tracker(); // ДОБАВЛЕНИЕ ЭТОЙ СТРОЧКИ ВЫЗЫВАЕТ ОШИБКУ
ctrack.init();
ctracker.start(videoElement);
  function onStreaming(stream) {
video.srcObject = stream;
ctrack.start(video);
  }
  navigator.mediaDevices.getUserMedia({ video: true }).then(onStreaming);
});
var img1=document.getElementById("img1");
var img2=new Image();  // Создаём изображение
img2.src = '/8dfc376b.png';
var canvas=document.getElementById("overlay")
var image1=canvas.getContext("2d");
image1.drawImage(img1,110,70);
image1.drawImage(img1,10,10,70,70);
image1.drawImage(img1,0,90,110,70,10,200,100,50);
img2.onload = function() {
image1.drawImage(img2,120,105,150,45);
}
</script>
</body>
</html>

Добавляю в код строчку:
var ctracker = new clm.tracker();
получаю ошибку:
Uncaught ReferenceError: clm is not defined
    at HTMLDocument.<anonymous> (new-fitting.php:15)
    at j (jquery.min.js:2)
    at k (jquery.min.js:2)


Делаю по инструкции: https://habr.com/ru/company/ruvds/blog/426055/
Поиск лица
Теперь давайте воспользуемся библиотекой clmtrackr.js для поиска лица на видео. Для начала инициализируем систему слежения за лицом, добавив следующий код после const video = ...:

const ctrack = new clm.tracker();
ctrack.init();

Теперь, в функции onStreaming(), мы подключаем систему поиска лица, добавляя туда следующую команду:

ctrack.start(video);

Это всё, что нам нужно. Теперь система сможет распознать лицо в видеопотоке.
  • Вопрос задан
  • 3658 просмотров
Решения вопроса 1
Vlad_IT
@Vlad_IT Куратор тега JavaScript
Front-end разработчик
Вы подключаете этот скрипт тут
<script  type="text/javascript" src="https://raw.githubusercontent.com/auduno/clmtrackr/dev/build/clmtrackr.js"></script>

а с raw.githubusercontent.com нельзя подключать скрипты, т.к. он отдает MIME type ('text/plain'), который нельзя выполнить. Скачайте скрипт к себе, и подключите его со своего хостинга.
Можете использовать CDN

<script  type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clmtrackr/1.0.2/clmtrackr.js">
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы