Не работает HTML-кнопка Affdex JavaScript SDK - PullRequest
Новая
       36

Не работает HTML-кнопка Affdex JavaScript SDK

0 голосов
/ 14 мая 2018

В настоящее время я работаю над проектом с технологией Affectiva под названием Affdex.В настоящее время я участвую в тестировании SDK.Я создал простой веб-сайт, но эта кнопка HTML, похоже, ничего не делает.Теперь, выполнив несколько тестов, я вижу следующее:

- Первая попытка: загрузка SDK локально в виде файла JS.В результате в консоли веб-браузера кнопка ничего не делает, пустая, но вместо выполнения кода SDK в функции и замены на предупреждение JS она работает.

-Secondпопытка: При удаленной ссылке я получаю сообщение об ошибке: «uncaught referenceerror onStart не определено», что странно для меня, потому что я не могу понять, что происходит при условии, что я пытался изменить порядок ссылок.

Итак, я сейчас прикреплю свой код: -HTML: 

<!DOCTYPE html>
<html>
<head>
	<title>HOME</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
	<script type="text/javascript" src="affdex.js"></script>
	<script type="text/javascript" src="detector.js"></script>
</head>
<body>
	<button id="start" onclick="onStart()">Start</button>
</body>
</html>

На всякий случай удаленный SDK должен быть: 

<script src="https://download.affectiva.com/js/3.2/affdex.js"/>

И, наконец, мой JS-файл, который должен заставить сайт делать что-то хотя бы в консоли в дополнение к SDK: 

var divRoot = $("#affdex_elements")[0];

var width = 640;

var height = 480;

var faceMode = affdex.FaceDetectorMode.LARGE_FACES;

var detector = new affdex.CameraDetector(divRoot, width, height, faceMode);

detector.detectAllExpressions();

detector.addEventListener("onInitializeSuccess", function() {
    log('#logs', "The detector reports initialized");
    $("#face_video_canvas").css("display", "block");
    $("#face_video").css("display", "none");
});

function log(node_name, msg) {
    $(node_name).append("<span>" + msg + "</span><br />")
}

function onStart() {
    if (detector && !detector.isRunning) {
      $("#logs").html("");
      detector.start();
    }
    log('#logs', "Clicked the start button");
}

detector.addEventListener("onWebcamConnectSuccess", function() {
    log('#logs', "Webcam access allowed");
});

detector.addEventListener("onWebcamConnectFailure", function() {
    log('#logs', "webcam denied");
    console.log("Webcam access denied");
});

detector.addEventListener("onStopSuccess", function() {
    log('#logs', "The detector reports stopped");
    $("#results").html("");
});

Ответы [ 2 ]

0 голосов
/ 15 мая 2018

Хорошо, вот как я немного исправил демо. Я понял, что вы должны использовать SDK удаленно, а не размещать его самостоятельно из-за зависимостей.

Каким-то образом документация забывает о закрывающем теге для своего SDK. Ну, по крайней мере, так у меня получилось.

Надеюсь, это поможет.

0 голосов
/ 14 мая 2018

Похоже, вы основываете это на демонстрации канала камеры.в таком случае вам может потребоваться включить ваш скрипт (dete.js) после тега html body вместо заголовка.

Вам потребуется использовать размещенную версию SDK <script src="https://download.affectiva.com/js/3.2/affdex.js"/>.

...