使用Javascript取得Google Assistant語音命令

Google Assistant > IFTTT > Beebotte MQTT <> Javascript <> iot開發板

首先,設定Beebotte MQTT
開啟Beebotte網站 https://beebotte.com
點選【Sign up】註冊帳號或【Sign in】登入後,在右上角帳戶的下拉選單中挑選【Control Panel】

點選【Create New】建立新的Channel

輸入Channel NameResource Name 之後,點擊【Create channel】完成Beebotte MQTT設定,
請記住Channel Name及Resource Name兩項資料,後面設定會用到。

還有一項 Channel Token 也要記住,設定完成時會看到如圖紅字的部分,後面也會用到。


我想使用Android手機的Google Assistant做語音命令辨識
在手機上安裝IFTTT的APP

開啟IFTTT,註冊帳號並登入(可使用google或FB帳戶)

點選【My Applets > +】建立新的程序



點選【+this】,設定觸發方式


搜尋google assistant,點選【Google Assistant】圖示

選擇Google Assistant的觸發方式,我們選擇第一項【Say a simple phrase】說一個簡單的句子。

點擊【Connect】

選擇欲連接的Google帳戶

點擊【允許】,同意IFTTT管理您的Google語音指令
建立語音指令,
輸入要對Google Assistant說的句子,以及Assistant收到指令後的回覆。(不支援中文)
按下【Create Trigger】完成觸發設定
 

完成【this】設定之後,接著點選【+that】,設定要做的事

搜尋webhooks,點選【Webhooks】圖示

點選【Make a web request】

設定要傳送給Beebotte的資料
【URL】輸入:https://api.beebotte.com/v1/data/publish/Channel Name/Resource Name?token=【Channel Token】
其中Channel Name,Resource Name,Channel Token三項資料,請參閱前面設定Beebotte,舉例:
https://api.beebotte.com/v1/data/publish/mychannel/myresource?token=token_FfaxcKueWChwBI01
【Method】設定:POST
【Content Type】設定:application/json
【Body】內容使用JSON格式,可自行設定想傳送的多組字串,舉例:
{"data":[{"id":"id1","msg":"on"}]}

完成IFTTT設定

現在,來測試一下Beebotte是否能收到MQTT訊息
回到Beebotte的Control Panel,在左側選單點選【Account Settings】,複製【Secret Key】的內容

在左側選單點選【Console】,貼上【Secret Key】,輸入之前設定的Channel Name與Resource Name,然後點擊【Subscribe】訂閱MQTT

此時可看到右側Messages視窗顯示一些文字,Log視窗也顯示Successfully subscribed成功訂閱的訊息

接著,使用手機Google Assistant,下達語音命令,順利的話可以看到Messages視窗顯示我們經由IFTTT傳送的data

也可以聽到Google Assistant在手機端的回應 (我覺得設定不難,讓Assistant聽懂我的話比較難😔)

接下來,使用javascript傳送與訂閱Beebotte訊息

傳送訊息:
<html>
<head>
    <title></title>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script src="https://beebotte.com/bbt.js"></script>
</head>
<body>
<script>
    var bclient = new BBT.Connector({keyId: 'API Key', secretKey: 'Secret Key'});

    bclient.publish({
        channel: 'Channel Name',
        resource: 'Resource Name', 
        data:{myid:'testid',mymsg:'testmsg'}
    },
    function(err, res) {
    // console.log(res);
    });

    //bclient.write({
    //  channel: 'Channel Name', resource: 'Resource Name', data: 'Hello World'},
    //  function(err, res) {
    //});
</script>
</body>
</html>

訂閱訊息:
<html>
<head>
    <title></title>
    <script src="https://cdn.socket.io/socket.io-1.1.0.js"></script>
    <script src="https://beebotte.com/bbt.js"></script>
</head>
<body>
<script>
    var bbt = new BBT('API Key');
 
    bbt.subscribe({
      channel: 'Channel Name',
      resource: 'Resource Name',
    }, function(msg){
    //  console.log(msg.data.myid);
    //  console.log(msg.data.mymsg);
    });

    //bclient.read({
    //  channel: 'Channel Name',
    //  resource: 'Resource Name',
    //  limit: 1/* Retrieves last 5 records . default is 1 */
    //}, function(err, res) {
    //});
</script>
</body>
</html>

bbt.js可由github取得 https://github.com/beebotte/bbt_client_js
教學文件可參考Beebotte官網 https://beebotte.com



這個網誌中的熱門文章

Webduino使用LINE自訂積木(三):LINE Bot

Webduino使用LINE自訂積木(二):LINE Notify

製作 Micro:bit 循跡自走車(二):程式