Philips Hue Lampe als "Call Indicator" verwenden

• Was ist sipgate.io?
• In diesem Tutorial
• Voraussetzungen
• Step 1: das Projekt aufsetzen
• Step 2: sich mit Hue-Bridge verbinden
• Step 3: Webhooks einrichten
• Step 4: Hue-Bridge und Call-Events verbinden
• Fazit

Was ist sipgate.io?

SMS oder Faxe versenden und empfangen, den Anrufverlauf abrufen, Anrufe initiieren und manipulieren – das alles kann sipgate.io ! Mit unseren APIs können Sie unsere Telekommunikationsfunktionen flexibel in Ihre Projekte integrieren. Unsere Library und Tutorials unterstützen Sie dabei, Ihre Telefonie möglichst bequem zu gestalten.

In diesem Tutorial

Kann die Telefonie auch smart gestaltet werden? In diesem Tutorial zeigen wir Ihnen, wie Sie mithilfe der sipgate.io Node.js Library die Funktionalität der Philips Hue Lampe in Ihr System integrieren können. Mehr über Vorteile dieser Integration können Sie gerne auf unserer Website erfahren.

Das vollständige Projekt finden Sie in unserem GitHub-Repository .

Voraussetzungen

• Bevor wir uns mit dem Code auseinandersetzen, richten Sie sich ein sipgate-Konto für sipgate.io ein. Wie das geht, erfahren Sie hier .
• Um Webhooks für eingehende und ausgehende Anrufe zu aktivieren, gehen Sie zu console.sipgate.com und wählen Sie in der linken Seitenleiste „Webhooks“ aus. Auf der Registerkarte „URLs“ können Sie die Webhook-URLs konfigurieren.
• In diesem Projekt verwenden wird nur die “eingehenden” URLs, da uns in diesem Fall keine Statistiken über ausgehende Anrufe interessieren.

Wenn Sie Webhooks in der Live-Umgebung verwenden, müssen Sie Ihren Code auf einem Webserver mit einer geeigneten Adresse ausführen. Für Entwicklungszwecke empfehlen wir jedoch die Nutzung eines Dienstes, der Ihre lokale Umgebung über das Internet zugänglich macht. Dies erleichtert erheblich das Testen Ihres geschriebenen Codes. Es gibt verschiedene kostenlose Dienste, die dafür genutzt werden können. Einige Beispiele sind localhost.run oder ngrok . Beide stellen Ihnen eine öffentliche URL zur Verfügung, die Sie in die sipgate.io-Konsole einfügen können. Achten Sie darauf, dass Sie den richtigen Port weiterleiten (in diesem Tutorial Port 8080) und dass der von Ihnen gewählte Anbieter sichere Verbindungen über HTTPS bietet.

Step 1: das Projekt aufsetzen

• In diesem Tutorial verwenden wir die offizielle sipgate.io Node.js-Library. Die Library erleichtert die Arbeit mit den sipgate-APIs und bietet komfortable Funktionen, einen Webhook-Server einzurichten.
• Doch zunächst erstellen wir ein neues Node-Projekt. Dazu legen Sie ein neues Verzeichnis an, das unser Projekt beinhaltet, und führen darin npm init -y aus.
• Dadurch wird eine package.json -Datei erstellt, die einige Metadaten für das Projekt enthält. Öffnen Sie die Datei und fügen Sie folgenden Befehl hinzu. Damit hinterlegen wir ein Startskript, das später über die Befehlszeile aufgerufen werden kann.

"scripts": {
  "start": "node server.js"
}

• Um die sipgate.io-Library zu installieren, führen Sie npm install -s sipgateio aus.

Um dieses Projekt zu testen und auszuführen, können Sie Ihre vorhandene Philips-Hue-Einrichtung verwenden. Alternativ ist es möglich, die Hue-Bridge mit einem Emulator zu simulieren. Wenn Sie den Emulator verwenden möchten, sollten Sie createLocal durch createInsecureLocal ersetzen.

Step 2: sich mit Hue-Bridge verbinden

Zuerst verbinden wir uns mit einem Benutzer:innamen mit der Hue-Bridge. In unserem Setup sucht der Code nach einer .config.json -Datei und verwendet deren Inhalt zur Authentifizierung.
Die Datei sollte wie folgt aussehen:

{
  "bridgeIpAddress": "localhost",
  "bridgePort": 443
}

Wenn Sie bereits einen Hue-Bridge-User eingerichtet haben, können Sie die Anmeldedaten auch in dieser Konfiguration eingeben:

{
  "credentials": { "username": "your-username" }
}

Der folgende Code-Abschnitt überprüft, ob die oben erwähnte Konfigurationsdatei vorhanden ist. Im nächsten Schritt erstellen wir eine server.js -Datei mit dem folgenden Inhalt:

const path = require("path");
const fs = require("fs");

const configFile = path.resolve(__dirname, ".config.json");

let configuration;

try {
  configuration = JSON.parse(fs.readFileSync(configFile).toString());
} catch (e) {
  console.error(
    "Please provide a .config.json file with an bridgeIpAddress and bridgePort."
  );
  return;
}

Weiterhin verwenden wir die node-hue-api-Library, um einen Username zu erstellen. Die Library readline-sync benutzen wir für die Aufforderung an den User:innen, die Schaltfläche zu drücken. Wir installieren diese Abhängigkeiten mit npm install -s node-hue-api readline-sync.

Die Konstanten appName und deviceName werden verwendet, wenn einen neuen Usernamen auf der Hue-Bridge erstellt wird.

// add this where our imports are
const readlineSync = require("readline-sync");

const v3 = require("node-hue-api").v3;
const hueApi = v3.api;
const LightState = v3.lightStates.LightState;

// we use this to create our user on the bridge
const appName = "io-labs-hue-integration";
const deviceName = "call-light";

Als Nächstes überprüfen wir, ob das Konfigurationsobjekt die Anmeldedaten enthält. Wenn ja, rufen wir einfach unsere runServer-Funktion mit ihnen auf. Andernfalls fordern wir die User:innen auf, den Verbindungs-Button auf seiner Hue-Bridge zu drücken und einen neuen Account zu erstellen. Danach sollen die erhaltenen Anmeldeinformationen in die Konfigurationsdatei übertragen werden.

const createUser = async () => {
  const unauthenticatedApi = await hueApi
    // use createInsecureLocal if using the emulator
    .createLocal(configuration.bridgeIpAddress, configuration.bridgePort)
    .connect();

  return await unauthenticatedApi.users.createUser(appName, deviceName);
};

const runServer = (userCredentials) => {
  // TODO: we will implement this later
};

if (!configuration.credentials) {
  console.log("No existing credentials detected.");

  readlineSync.question(
    "Please push the Link button on your Hue Bridge and then press enter to proceed >"
  );
  createUser()
    .then((createdUser) => {
      console.log(`username: ${createdUser.username}`);
      configuration.credentials = createdUser;
      fs.writeFileSync(configFile, JSON.stringify(configuration));
      return createdUser;
    })
    .then(runServer)
    .catch((err) => {
      console.error(err.message);
    });
} else {
  runServer(configuration.credentials).catch(console.error);
}

Jetzt sollten Sie den Code mit npm start starten können.

Step 3: Webhooks einrichten

Damit unsere Hue-Einrichtung eingehende Anrufe verarbeiten kann, nutzen wir die webhook -Funktion von sipgate.io. Sie ermöglicht es uns, einen Server zu betreiben, der Anruf-Ereignisse in Echtzeit empfängt.
Wir verwenden die createWebhookModule-Funktion wie folgt:

const { createWebhookModule } = require("sipgateio");

Fügen Sie die Webhook-URL und den Port in die Konfigurationsdatei ein:

{
  // ...
  "webhookURL": "example.com",
  "webhookPort": 8080
}

Mit dem folgenden Code wird der Webhook-Server erstellt und ausgeführt.
Den Port und die Webhook-Server-URL lesen wir aus dem Konfigurationsobjekt aus.

Mit server.onNewCall erstellen wir einen Listener, der auf neue Anrufe wartet. Vorerst schreibt die Funktion bei einem neuen Anruf nur eine Nachricht in die Konsole.

async function runServer(userCredentials) {
  const webhookServerOptions = {
    port: configuration.webhookPort,
    serverAddress: configuration.webhookURL,
  };
  const server = await createWebhookModule().createServer(webhookServerOptions);
  console.log(`Server running at ${configuration.webhookURL}`);

  server.onNewCall(async (newCallEvent) => {
    console.log(`incoming call from ${newCallEvent.from}`);
  });
}

Step 4: Hue-Bridge und Call Events verbinden

Zuerst erstellen wir ein paar Hilfsfunktionen für die Verbindung zur Hue-Bridge und das Aufleuchten lassen einiger LEDs.

function connectToBridge(ip, port, userCredentials) {
  return hueApi
    // use createInsecureLocal if using the emulator
    .createLocal(ip, port)
    .connect(userCredentials.username);
}

Die Funktion blinkLight legt zunächst die Farbe des Lichts fest und ruft dann einfach wiederholt die Funktionen turnOn und turnOff auf. Der Parameter duration legt die Leuchtzeit fest.

function turnOff(api, lightId) {
  return api.lights.setLightState(lightId, new LightState().off());
}

function turnOn(api, lightId) {
  return api.lights.setLightState(lightId, new LightState().on());
}

const delay = (duration) =>
  new Promise((resolve) => setTimeout(resolve, duration));

async function blinkLight(api, lightId, duration, count, color) {
  await api.lights.setLightState(lightId, new LightState().on().rgb(color));
  for (let i = 0; i < count; i++) {
    await turnOn(api, lightId);
    await delay(duration);
    await turnOff(api, lightId);
    await delay(duration);
  }
}

In unserer runServer-Funktion verbinden wir uns nun mit der Hue-Bridge unter Verwendung unserer Anmeldedaten. Dann erhalten wir die IDs aller LEDs im Netzwerk, damit wir sie später blinken lassen können.

async function runServer(userCredentials) {
  let bridge;
  try {
    bridge = await connectToBridge(
      configuration.bridgeIpAddress,
      configuration.bridgePort,
      userCredentials
    );
    await bridge.configuration.getConfiguration();
  } catch (e) {
    console.error(e.message);
    return;
  }

  const allLightIds = await bridge.lights.getAll();

  /// ...
}

Jetzt sollen wir nur noch die zuvor definierte Funktion blinkLight für jedes Licht aufrufen, wenn wir ein neues Call-Event erhalten.

async function runServer(userCredentials) {
  // ...
  server.onNewCall(async (newCallEvent) => {
    console.log(`incoming call from ${newCallEvent.from}`);

    const color = [255, 0, 255];
    await Promise.all(
      allLightIds.map((lightId) => blinkLight(bridge, lightId, 200, 10, color))
    );
  });
}

Promise.all() lässt alle LEDs gleichzeitig blinken, anstatt eines nach dem anderen. Jetzt sind wir fast fertig!? Probieren Sie ruhig verschiedene Möglichkeiten aus, um die LEDs blinken zu lassen oder verschiedene Webhook-Events zu behandeln.
Sie können unter anderem die Farbe der Lampe davon abhängig machen, wer anruft. Fügen Sie einfach eine Zuordnung zwischen der Nummer und der gewünschten Farbe wie folgt ein:

const defaultColor = [255, 0, 0];

const personColors = {
  "<some phone number>": [255, 0, 255],
};

Und entscheiden Sie, welche Farbe Sie verwenden wollen, indem Sie die neuen Nummern in dieser Map nachschlagen:

const color = personColors[newCallEvent.from] || defaultColor;

await Promise.all(
  allLightIds.map((lightId) => blinkLight(bridge, lightId, 200, 10, color))
);

Fazit

In diesem Tutorial haben wir anhand von einem Beispiel gezeigt, wie Sie die Philips Hue Lampe in Ihre Telefonie mithilfe der sipgate.io-Library integrieren können.

Das vollständige Projekt finden Sie in unserem GitHub-Repository .

Wenn Sie mehr über die Möglichkeiten unserer sipgate.io-Library erfahren möchten, schauen Sie sich die anderen Tutorials in unserem Blog an.