阿川私房教材:學程式,拿 offer!

63 個專案實戰,直接上手!
無需補習,按步驟打造你的面試作品。

立即解鎖你的轉職秘笈

標題:快速建造 WhatsApp 機器人 ⚡

發表:真實

描述:建立一個將 WikiPedia 摘要發送到 WhatsApp 的🤖

標籤: twilio、replit、whatsapp、聊天機器人

封面圖片:https://i.imgur.com/XQ4FhRA.png


幾個月前,我開始在Telegram上製作聊天機器人 - 我看到了 WhatsApp 的一些 API,但它們是非官方的,並且您的號碼有可能被封鎖 📱 ❌

不久前,我看到Twilio有一個官方的 WhatsApp API。 30 分鐘後,我在 WhatsApp 上製作了一個維基百科機器人👇

本教學可協助您在 WhatsApp 上建立自己的聊天機器人 - 這些機器人可立即供超過 20 億用戶使用,並且有很多事情是可能的 🎓

我迫不及待想看看你做了什麼!現在,讓我們開始吧🏃‍♂️

🔑 帳戶和金鑰

首先,註冊Twilio - 它是免費的,您不需要信用卡 💳

驗證完電話號碼後,選擇“Procuts”>“Programmable SMS”,然後繼續為您的專案命名。

您可以隨意跳過新增隊友的步驟 - 您現在不需要這樣做。

現在您必須記下建造 WhatsApp 機器人所需的一些驗證金鑰 👇

最後一步 -在此設定您的 WhatsApp 沙盒 - 選擇任意號碼,然後按照頁面上的指示加入您的沙盒。

啊啊啊,您已完成憑證設定!別擔心,這是本教學中最困難的部分😛

🚀 開始使用

為了避免在設定上花費太多時間,我建立了一個可以在瀏覽器中使用的環境(使用repl.it !)。前往這裡,等待幾秒鐘來分叉它。

接下來,建立一個.env- 並在1行和2行輸入您的帳戶 SID 和驗證令牌

SID=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX # Account SID
KEY=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX # Auth Token

您可以看到,此環境已經安裝了依賴項,並設定了express伺服器。不過,我們仍然需要為 Twilio 提供一個用於發送傳入訊息的 URL 🔗

讓我們回到WhatsApp Sandbox ,並為傳入訊息輸入一個 Webhook URL。

此 URL 必須是您在repl.it專案的預覽面板上看到的 URL + /incoming

現在我們終於可以讀取發送給機器人的訊息了。導航到index.js ,然後在您的 webhook 處理程序中加入一個簡單的console.log() 👇

app.post('/incoming', (req, res) => {
  console.log(req.body)
});

當您向機器人發送訊息時,您應該能夠在 repl 控制台中看到類似的內容 👨‍💻

建造一個 echo 機器人看起來像這樣,使用twiml編寫訊息👇

app.post('/incoming', (req, res) => {
    const twiml = new MessagingResponse();
    twiml.message(req.body.Body);
    res.writeHead(200, {'Content-Type': 'text/xml'});
  res.end(twiml.toString());
});

但是,由於我們實際上正在嘗試建立一個有用的機器人 - 讓我們使用資訊豐富的 API!

🌐 獲取訊息

DuckDuckGo 有一個令人驚嘆的、免費的即時應答 API。它接受查詢並返回來自維基百科等的摘要。

一些例子 👉 維基百科Macbook AirTwilio

我花了一些時間建立一個像樣的解析器,它通常會從此 API 傳回資訊。嘗試將此程式碼貼到您的repl.it專案中,您的控制台中應該包含有關川普的內容 😛

var base = 'https://api.duckduckgo.com/?skip_disambig=1&format=json&pretty=1&q=';
var query = 'Donald Trump';

request(base + query, function (error, response, body) {
    body = JSON.parse(body)    
    if(body["Abstract"] == ""){
        body["Abstract"]= body["RelatedTopics"][0]["Text"]
      }   
    var msg = body["Heading"]+"\n\n"+body["Abstract"];
  console.log(msg)
  });

很簡單,對吧? 😄

🛠️ 將所有內容放在一起

為了製作我們的實際機器人,我們需要做的就是從我們的請求中獲取查詢 - 我們可以將其作為req.body.Body獲取 - 並使用twmil發送我們在msg中收集的資料

app.post('/incoming', (req, res) => {
    const twiml = new MessagingResponse();
    var base = 'https://api.duckduckgo.com/?skip_disambig=1&format=json&pretty=1&q=';
    var query = req.body.Body;

    request(base + query, function (error, response, body) {
        body = JSON.parse(body)  

        if(body["Abstract"] == ""){
            body["Abstract"]= body["RelatedTopics"][0]["Text"]
          }   

        var msg = twiml.message(body["Heading"]+"\n\n"+body["Abstract"]);
            res.writeHead(200, {'Content-Type': 'text/xml'});
          res.end(twiml.toString());
      });

});

您現在擁有一個功能齊全的 WhatsApp 機器人!發送您想了解的有關您的機器人的任何訊息 🤖,您應該會看到它的響應速度超快 💬 ⚡

加入歡迎訊息和一些格式設定非常簡單,請查看最終的repl ,看看我是如何做到的👨‍💻

{%回覆@wikibot%}

🔗 分享機器人

對於其他人使用此機器人,他們需要先加入您的沙箱 - 並發送一條訊息,就像您之前所做的那樣 👉 join <two-words>

您也可以使用此文字建立連結 - 例如此連結可讓您加入我的機器人👇

https://wa.me/14155238886?text=join ultramarine-tapir

14155238886是我的機器人號碼,而ultramarine-tapir是沙盒短語。

⚡ 接下來是什麼?

既然您已經知道如何在 WhatsApp 上建立機器人,請嘗試向自己發送通知,並建立更多有用的工具! Twilio 還有大量其他媒體可用於傳遞訊息!

我的 WikiBot 的所有程式碼都在Github上 ⬇️

{%github github/wikibot%}

我是一名 15 歲的創客 👨‍💻 想要製作更多酷炫的東西並了解我的進展,請訂閱我的時事通訊 📧


原文出處:https://dev.to/jajoosam/build-a-whatsapp-bot-fast--2hdc


共有 0 則留言


精選技術文章翻譯,幫助開發者持續吸收新知。

阿川私房教材:學程式,拿 offer!

63 個專案實戰,直接上手!
無需補習,按步驟打造你的面試作品。

立即解鎖你的轉職秘笈