【Day28】為爬蟲加上通知 - 用 axios 發出 LINE 通知

成功要選人少的路走，套件要選人多的來用

如何選擇 Node.js 中發出 Request 的套件？

雖然眾多的套件都能實現這個目標，但還是把套件做個簡單的區分：

1. 古老且沒再更新的套件：https、xmlhttprequest、request(這個套件在今年二月宣告廢棄)
2. 使用人數眾多且持續更新的套件：superagent、node-fetch、got、axios

原則上選擇使用人數眾多且持續更新的套件最安全，因為古老的套件通常文件不齊全且無人維護，如果某一天宣告廢棄你的專案就要大量改寫了

本專案採用 axios 來實現這個需求，如果你有興趣你也能嘗試不同的套件來完成今天的功能

今日目標

1. axios 基礎介紹

1.1 安裝 / GET / POST 基礎用法

1.2 請求配置說明

2. 用 axios 發出 LINE 通知

1. axios 基礎介紹

1.1 安裝 / GET / POST 基礎用法

• 安裝

  npm install axios
  yarn add axios
  

• GET 基礎用法

  const axios = require('axios'); // 引入套件
  axios.get('url/users', { // 填入 api 網址
      params: { // 傳入 params 物件
          ID: 12345
      }
  })
  .then(function (response) { 
      // 處理成功後要做的事
      console.log(response);
  })
  .catch(function (error) {
      // 發生意外地處理
      console.log(error);
  })
  

• POST 基礎用法

  axios.post('url/users', { // 要傳送的資料由後方物件帶入
      firstName: 'Fred',
      lastName: 'Flintstone'
  })
  .then(function (response) {
      console.log(response);
  })
  .catch(function (error) {
      console.log(error);
  });
  

1.2 請求配置說明

• axios 的組成結構：

  axios.(config 物件)
  .then(function (response) {})
  .catch(function (error) {});
  

• config 物件：發出 Request 的配置選項，其中只有 url 為必填

  {
      // url 為必填
      url: '/users',
  
      // method 是發出 Request 時使用的方法
      method: 'get', // 默認為 get
  
      // baseURL 如果填寫就會被添加到 url 前面，除非 url 為絕對路徑
      baseURL: 'https://some-domain.com/api/',
  
      // 你可以在這個地方定義自己的 headers
      // 通常會拿來設定 Authorization、Content-Type
      headers: {'Content-Type': 'application/json'},
  
      // params 通常跟著 GET method 一起使用
      // 這裡填寫的參數會帶入 url 後面，ex : .../user?ID=123
      params: {
          ID: 123
      },
  
      // data 只適用於 POST、PUT、PATCH 這幾個 method
      // 主要作為 Request 傳送的資料
      data: {
          firstName: 'Fred'
      },
  
      // Request 時間超過 1000毫秒(1秒)後會被中止
      timeout: 1000,
  
      // 選項: 'arraybuffer', 'document', 'json', 'text', 'stream'
      // 瀏覽器才有 'blob'
      responseType: 'json', // 默認為 json
  
       // 限制 http 回應時的內容大小
      maxContentLength: 2000,
  }
  

  這裡只列出常用的配置選項，如果你有興趣深入研究請參考官方文件

• 下面列出使用 then 時常用的回應參數

  axios.get('/users/123')
  .then(function(response) {
      console.log(response.data); // api 回傳的資料會在這裡
      console.log(response.status); // 這個是 HTTP狀態碼
      console.log(response.config); // 這個 Request 的 config
  });
  

2. 用 axios 發出 LINE 通知

在對 axios 有基礎了解後我們就把昨日在 POSTMAN 設定 Request 的參數搬移到專案程式吧。在專案 tools 資料夾內新增 lineNotify.js，今天我們要用這隻程式發出 LINE 通知

• 因為傳送 data 的資料格式為 form-data ，所以請先下指令 yarn add form-data 安裝套件喔

tools/lineNotify.js

const axios = require('axios')
var FormData = require('form-data');
require('dotenv').config();

function lineNotify () {
    const token = process.env.LINE_TOKEN;
    
    // 使用 form-data 傳遞資料
    const form_data = new FormData();
    form_data.append("message", '測試 lineNotify');

    // 設定 LINE Notify 的 權杖 & form-data
    const headers = Object.assign({
        'Authorization': `Bearer ${token}`
    }, form_data.getHeaders());
    
    axios({
        method: 'post',
        url: 'https://notify-api.line.me/api/notify',
        data: form_data,
        headers: headers
    }).then(function (response) {
        // HTTP狀態碼 200 代表成功
        console.log("HTTP狀態碼:" + response.status);
        // 觀察回傳的資料是否與 POSTMAN 測試一致
        console.log(response.data);
    }).catch(function (error) {
        console.error("LINE通知發送失敗");
        if (error.response) { // 顯示錯誤原因            
            console.error("HTTP狀態碼:" + error.response.status);
            console.error(error.response.data);
        } else {
            console.error(error);
        }
    });
}
lineNotify()

執行程式

1. 在專案資料夾的終端機(Terminal)執行指令

   node tools/lineNotify.js
   

2. 確認印出的 HTTP狀態碼 & 回傳的資料與 POSTMAN 測試結果一致

   

3. 如果你的 LINE 收到發出的通知就代表你成功嚕！

   

ℹ️ 專案原始碼

• 今天的完整程式碼可以在這裡找到喔
• 我昨天的把昨天的程式碼打包成壓縮檔，你可以在乾淨的環境為專案加入發出LINE通知的功能
  • 請記得在終端機下指令 yarn 才會把之前的套件安裝
  • windows需下載與你chrome版本相同的chrome driver放在專案根目錄
  • 要在tools/google_sheets資料夾放上自己的憑證，申請流程請參考Day17
  • 調整fanspages資料夾內目標爬蟲的粉專網址
  • 調整.env檔
    • 填上FB登入資訊
    • 填上FB版本(classic/new)
    • 填上IG登入資訊
    • 填上SPREADSHEET_ID
    • 填上爬蟲執行時間(CRONJOB_TIME)
    • 填上LINE Notify申請的權杖(LINE_TOKEN)，申請流程請參考Day27
  • 在終端機下指令 npm install forever -g ，讓你在終端機的任何位置都能管控排程
  • 在sh資料夾中設定執行排程的shell script

參考資源

1. 由前端request 的幾種方法
2. 5 Ways to Make HTTP Requests in Node.js
3. axios 基本使用 & Config

在許多人的幫助下，本系列文章已出版成書，並添加了新的篇章與細節補充：

• 加入更多實務經驗，用完整的開發流程讓讀者了解專案每個階段要注意的事項
• 將爬蟲的步驟與技巧做更詳細的說明，讓讀者可以輕鬆入門
• 調整專案架構
  • 優化爬蟲程式，以更廣的視角來擷取網頁資訊
  • 增加資料驗證、錯誤通知等功能，讓爬蟲執行遇到問題時可以第一時間通知使用者
  • 排程部分改用 node-schedule & pm2 的組合，讓讀者可以輕鬆管理專案程序並獲得更精確的 log 資訊

有興趣的朋友可以到天瓏書局選購，感謝大家的支持。

購書連結：https://www.tenlong.com.tw/products/9789864348008