Question

好的，希望有一个解决方案。当有人访问我的网站时，我希望我的一个Phillips Hue灯泡闪烁。我已经使用了Hue API，并且可以在调试页面中使用它，但我需要一些代码将它注入我的站点。

我相信我正在寻找一些HTML来运行一个JS代码来关闭它？我知道我的桥接IP和用户名以及灯光和所有这些，但我无法让它工作。以下是我到目前为止......

    <script type="text/javascript" language="javascript">
function send() {
    var xhttp = new XMLHttpRequest();
    xhttp.open("PUT”, “URL AND ID FOR BRIDGE”, true);
    xhttp.setRequestHeader("Content-type", "application/json");
    xhttp.send();
    var response = JSON.parse(xhttp.responseText);
}
</script>

我希望在我的网站的页眉或页脚中注入此代码，这样当有人加载我的主页时，代码会打开灯然后关闭。没有其他用户交互和隐藏在后台的东西。我认为这会很酷如果我能弄清楚它与我的网站有一些真实的世界联系。

谢谢！

Answer 1

最简单的方法是使用IFTTT。 https://ifttt.com 从那里使用My Applets Webhooks将您的网站连接到您的Hue Light。

要调用IFTTT，您需要使用PHP和cURL。从技术上讲，您可以直接进行JS GET请求，但是您将把密钥泄露给整个互联网，这不是最好的主意。您可能还需要确保您的服务器已启用cURL。

为此，请创建一个PHP文件，并添加以下代码，并将{{key}}替换为IFTTT中生成的密钥，您可以在此处找到：https://ifttt.com/services/maker_webhooks/settings

<?php
    header('Access-Control-Allow-Origin: https://maker.ifttt.com');

    if(!isset($_GET['triggerLight'])){
        die('No URL set');
    }

    $triggerLight = $_GET['triggerLight'];

    $url = 'https://maker.ifttt.com/trigger/' . $triggerLight . '/with/key/{{ACCESS_KEY_FROM_IFTTT}}';

    echo($url);

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL,$url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);
    $output = curl_exec($ch);
    echo $output;
    curl_close($ch);

?>

注意访问控制标头。这样您就不必担心跨站点域名。（这个PHP文件是从几个Google搜索中拼凑而成的，所以它可能会得到改进。）

现在使用jQuery，我们将对刚刚创建的PHP文件执行ajax GET请求。如果您愿意，请随意使用香草JS。

$.ajax({
    type: 'GET',
    url: "PATH_TO/iftt.php?triggerLight={{WEBHOOK_MAKER_EVENT_NAME}}"
});

您可以在加载主页时进行此操作，并且您应该乐意去做您想做的事情。某些时候可能会有一个速率限制，具体取决于流量对您网站的影响程度。通过IFTTT大约需要1-2秒的延迟，但它比通过HUE API更容易，主要是因为要远程连接，您需要填写表单以请求访问远程API。

我会说，你要小心你想要的东西，因为每次用户访问你的网站时闪烁的灯光可能会让你感到烦恼。我选择了一种平静的蜡烛火焰型色调，用于我制作的事件追踪功能。然而，我也选择不打开和关闭灯，而是由你决定。

最后，如上所述，尽量不要使用此代码破坏我们所有人。：）

Phillips Hue与网站整合

1 个答案: