Javascript Heroku环境中的唤醒锁

我有一个用PythonFlask（托管在Heroku上）构建的网站，我正在利用js Wake Lock API来保持用户设备的活力。基本上，我的网站与NHL的API连接，当你的团队得分时，它会吹响进球号角。我在应用程序运行的页面上添加了一个唤醒锁定开关，允许用户启用该功能

这是我的问题：当我部署到生产环境时，有人告诉我Wake Lock与浏览器不兼容。在同一个浏览器中运行时，在本地一切都正常。这是我的唤醒锁代码：

const checkbox = document.querySelector('#wakeLock');
const statusElem = document.querySelector('#wakeLockStatus')

const updateUI = (status = 'acquired') => {
  const acquired = status === 'acquired' ? true : false;
  checkbox.dataset.status = acquired ? 'on' : 'off';
  checkbox.checked = acquired ? true : false;
  statusElem.textContent = `Wake Lock ${acquired ? 'is active!' : 'is off.'}`;
}

// test support
let isSupported = false;

if ('wakeLock' in navigator) {
    isSupported = true;
    statusElem.textContent = 'Wake lock API is supported in your browser!';
} else {
    checkbox.disabled = true;
    statusElem.textContent = 'Wake lock is not supported by this browser.';
}

if (isSupported ) {
    // create a reference for the wake lock
    let wakeLock = null;

    // create an async function to request a wake lock
    const requestWakeLock = async () => {
        try {
            wakeLock = await navigator.wakeLock.request('screen');

            // change up our interface to reflect wake lock active
            updateUI()

            // listen for our release event
            wakeLock.onrelease = function(ev) {
                console.log(ev);
            }
            wakeLock.addEventListener('release', () => {
            // if wake lock is released alter the button accordingly
                updateUI('released');
            });

            console.log(wakeLock)

        } catch (err) {
            // if wake lock request fails - usually system related, such as battery
            checkbox.checked = false;
            statusElem.textContent = `${err.name}, ${err.message}`;
        }
    } // requestWakeLock()

    // toggle
    checkbox.addEventListener('click', () => {
        // if wakelock is off request it
        if (checkbox.dataset.status === 'off') {
          requestWakeLock()
        } else { // if it's on release it
          wakeLock.release()
            .then(() => {
              wakeLock = null;
            })
        }
    })

}

正如我所说，当在本地测试时，它工作得非常好，但是当我部署它时，它就不再工作了。这部分失败是因为我在前端看到“此浏览器不支持唤醒锁定”消息。如果有必要的话，该应用程序是Heroku上的主机

// test support
let isSupported = false;

if ('wakeLock' in navigator) {
    isSupported = true;
    statusElem.textContent = 'Wake lock API is supported in your browser!';
} else {
    checkbox.disabled = true;
    statusElem.textContent = 'Wake lock is not supported by this browser.';
}

链接至网站： 选择一个团队并单击“开始”以查看“唤醒锁定”切换和我正在谈论的消息

---

提前感谢您的帮助

我找到了解决办法唤醒锁需要HTTPS，我只是在使用HTTP连接，因为我仍然在使用免费的Heroku计划。我已经升级了，它正在按预期工作