Не удается заставить API-интерфейс датчика Generi c работать в приложении React

Question

Я пытаюсь реализовать сенсорный API Generi c в приложении React.

https://www.w3.org/TR/generic-sensor/#the -сенсорный интерфейс

Я продолжаю получать ошибка, когда я пытаюсь внедрить любой из датчиков в моем коде. Например:

  var sensor1 = new AmbientLightSensor();

Я получаю сообщение об ошибке: Не могу найти имя: 'AmbientLightSensor'.

Я предполагаю, что мне нужен оператор импорта в моем коде. Все примеры, которые я нашел, включают только LitElement. Я даже пробовал это, но все еще получаю неизвестную ошибку.

1. Какие операторы импорта мне нужны в моем наборе машинного кода?
2. Какие пакеты npm мне нужны?

Ниже приведен код машинописи, который я использую.

Я получаю ошибку машинописи:

/ Users / scoleman / dev / current / bigbrother /src/utility/testAccel.ts(14,24): не удается найти имя 'AmbientLightSensor'. TS2304

  export const testAccel = async (
    databaseName: string,
  ) => {

    const {state} = await navigator.permissions.query({
        name: "ambient-light-sensor"
    });

    if (state !== "granted") {
        console.warn("You haven't granted permission to use the light sensor");
        return;
    }

    const sensor = new AmbientLightSensor();

    sensor.addEventListener("reading", () => {
        console.log(sensor.illuminance);
    });

    sensor.addEventListener("error", (err: any) => {
        console.error(err);
    });

    sensor.start();

  };

Answer 1

Я смог запустить эти API, используя полифилл по адресу:

https://github.com/kenchris/sensor-polyfills

Answer 2

Это будет полностью зависеть от браузера, который вы используете. Я не думаю, что FireFox поддерживает это сейчас, поэтому я сосредоточусь на Chrome.

Во-первых, вам может нужно обслуживать ваш сайт по HTTPS . Похоже, что это почти варьируется от разрешения к разрешению, а также некоторые из них доступны по URL-адресу localhost.

Во-вторых, для Chrome необходимо включить «Дополнительные классы датчика Generi c» Отметьте Chrome на странице chrome://flags/#enable-generic-sensor-extra-classes.

Далее необходимо убедиться, что у пользователя есть разрешение на использование датчика тогда вы могли бы использовать его. Фрагмент, который проверит это следующим образом:

(async function(){
    const {state} = await navigator.permissions.query({
        name: "ambient-light-sensor"
    });

    if (state !== "granted") {
        console.warn("You haven't granted permission to use the light sensor");
        return;
    }

    const sensor = new AmbientLightSensor();

    sensor.addEventListener("reading", () => {
        console.log(sensor.illuminance);
    });

    sensor.addEventListener("error", err => {
        console.error(err);
    });

    sensor.start();
}());