2020鐵人賽彙整 - 艾瑞克的沼澤

Runs whenever a post or page is created or updated, which could be from an import, post/page edit form, xmlrpc, or post by email. Action function arguments: post ID and post object. Runs after the data is saved to the database. Note that post ID may reference a post revision and not the last saved post. Use wp_is_post_revision() to get the ID of the real post.

簡單來說就是，每當創建或更新文章或頁面的時候會運行。太好了，這就是我想找的 hook 。那我們就可以在這個 hook 上面掛上我們的 callback function 。

其他外掛提供的 hook

當然了，有的外掛也會提供 hook 給我們使用，所以我們也可以透過這種方式去插入我們自定義的 callback function 。沒錯！WordPress 的世界就是這麼方便。

舉例來說，我今天想要在 woocommerce 上面做訂單通知。我們可以試著上去外掛的官網上面找文件，於是我們找到了這份文件：Action and Filter Hook Reference，翻一翻可以找到 woocommerce_checkout_update_order_meta()，不過打開文件後，確實有點難理解要怎麼用它。

所以我這邊想分享一個網站： hookr.io。

進去後，我們可以直接打開外掛列表頁，這裡記錄了許許多多在 WordPress 上面提供的外掛，假設我們點了 Woocommerce，裡面就會有這個外掛所提供的所有filter hooks 和 action hooks 了！接著，我們找到 woocommerce_checkout_update_order_meta()。他就會告訴我們 description、他會用到哪些 parameters ，以及他的使用方法。整個很方便好用！

明天我們就要來把這個 hook 放上我們自己定義的 callback function 囉！

閱讀全文【第 26 天】我們會用到哪些 WordPress Hooks？

【第 25 天】在 WordPress 後台取得 LINE Notify token

這幾天實在太忙了，所以文章有點沒時間寫。但是鐵人賽都快結束了，不可以輕易放棄啊！！！

在取得 LINE Notify token 之前，還記得我們在第 22 天的時候說過，使用者的瀏覽器在登入授權後，會透過 redirect_uri 所設定的網址發出 HTTP POST 要求嗎？所以我們要先來搞定取得 LINE 的 POST method 。

這部分要感謝也在參加鐵人賽的 Eric 桓桓為我點通訣竅。

WordPress 接受 post method 的方法非常簡單，我們只需要在外掛的目錄下建立 get_post.php 就可以處理 post method 了，大概是這樣。

<?php 
    require_once('wp-load.php'); // add wordpress functionality
    $post = $_POST;

    if ( $something ) // security check
    // do something...
?>

接著透過 yourdomain.com/plugin_name/get_posts.php ，就可以發送 post 請求。這也意味著我們要去 LINE Notify 修改一下我們的 redirect_uri 到 https://yourdomain.com/plugin_name/get_posts.php。如此一來我們就可以取得一組 token ，所以接著我們需要把它存下來。

如此一來，我們就會有一組 token 清單在資料庫中，以後要發送 Notify 的時候，就找這個清單就可以囉！

至於實作的部分呢，小弟我還在被追殺中．．．．我假日會補啦QQ

閱讀全文【第 25 天】在 WordPress 後台取得 LINE Notify token

【第 24 天】在 WordPress 後台建立表單填入 Client ID 和 Client Secret

在【第 22 天】開一個 LINE OA 這篇文章中，我提到，我們必須先拿著 Client ID 和 Client Secret 去取得 code ，再拿這個 code 去換 token 。

所以這個流程看來，我們的第一個步驟，應該先提供一個表單給後台使用者，可以去填入他的 Client ID 和 Client Secret 按下去後會進入 LINE 提供的授權頁面，然後會換回一個 code ，然後我們再拿著這個 code 去存在 WordPress 中。

然後這邊開始我們要開始寫 code 了

然後我被叫去修 bug 了…晚上再來補文QQ

【第 23 天】初始化一個 WordPress 外掛

終於要進入這次參賽的最後尾聲了。接著幾天又要開始捲起袖子寫 code 囉！

我們在第三天有講到如何建立第一個 WordPress 外掛，可以回去複習一下：【第 03 天】第一個 WordPress 外掛。

看來，我們需要先想一個好的名稱。

好的外掛名稱

根據官方的建議，外掛的名稱應該反映你和外掛的獨特性。

所以，我們在想名字的時候，必須確保沒有侵犯商標或與其他的產品名稱產生衝突。例如，我們想做一個外掛推播 LINE 通知，但是這並不是 LINE 官方的外掛，我們就就不應該命名這個外掛為 LINE's Notify ，命名為 Notify for LINE 會更好一點。

因此，想出一個好名稱不是一件容易的事情。

建立外掛目錄

假設，我們就叫這個外掛 Notify for LINE 吧！

接著我們要先到 WordPress 的 wp-content/plugins 路徑下創建一個全新的資料夾 notify-for-line 。接著切換到這個資料夾中，創建一個 PHP 檔案 notify-for-line.php 。

別忘了 README.text

README.text 文件不是必須的，但是她很重要，README.text 可以讓其他開發者清楚確定這份外掛的相關資訊。所以我們要確保該文件中包含：

簡要描述外掛的實際作用是什麼。
安裝說明，特別是需要特殊配置的時候。
關於外掛開發主人可以提供和不提供什麼樣的支持。

定義一下外掛

我們來編輯一下 notify-for-line.php 吧！在開頭的地方加入我們資訊：

<?php
/*
Plugin Name：Notify for LINE
Plugin URI：https://ericwu.asia
Description：Notify for LINE
Version：1.1.1
Author：Eric Wu
Author URI：https://ericwu.asia
License：GPL2
License URI：https://www.gnu.org/licenses/gpl-2.0.html
*/

這樣應該就可以在我們的後台看到一個我們剛裝上去的外掛了。

接著，明天我們會來試著取得 LINE notify 所需要的 code 和 access_token

【第 22 天】開一個 LINE OA

在 WordPress 上面建立 LINE Chatbot 推播外掛之前，我們需要在 LINE 平台上面處理一些事情，才可以繼續。如果你對 LINE Chatbot 已經很熟悉，可以跳過這個章節。

服務提供者

還記得昨天我們說的說嗎？我們站在發送訊息方的角色，所以我們需要提供一支程式或網站、和一個 callback 網址給 LINE。

等等！你說我們要一個 callback 網址？那這樣不就意味著，我要搞台主機、再搞個網址、搞完還要弄 SSL？

還好有個好工具 ngrok ，提供我們快速建立一個外部可存取的網站。

ngrok

安裝 ngrok

因為我是使用 mac ，我這邊建議直接使用 Homebrew 來安裝(你也可以直接官網下載解壓縮包來使用)。

brew cask install ngrok

如果你是 windows 的使用者，可以直接去官方網站中下載對應的位元版本下載，解壓縮後直接啟動 ngrok.exe 就可以囉。

啟用 ngrok

我們直接在終端機輸入（我這邊示範 port 8000）：

ngrok http 8000

你會看到如附圖的畫面，會有兩個 Forwarding，因為 LINE 的 callback 有規範要使用 https ，所以我們選用第二個 Forwarding 來做為我們等等在 LINE Notify 訂閱通知時的 callback url：

登入 LINE Notify 服務

進入 LINE Notify 網站並登入 LINE 帳號。點選右上角的個人名稱，點選 管理登錄服務 進入管理頁面：

點擊 登錄服務 ：

輸入欄位資料。（除了服務圖片外，其餘皆為必填欄位）。服務名稱建議設定一個好是別的，未來在發通知的時候，使用者會透過服務名稱去得知這是誰發送的通知。

而 Callback URL 欄位，則是剛剛我們複製的第二個 Forwarding 網址。

接著，我們要去驗證電子郵件帳號，完成電子郵件帳號驗證後，LINE Notify 服務就算登陸完成。

登陸完成後，我們可以看到 Client ID 和 Client Secret 資訊，我們先把它記下來，等等馬上會用到。

授權通知方

昨天我們說到，我們登陸後服務後，要使用者授權 LINE Notify 發出通知才行，所以下一步，我們要讓使用者必須進入以下網址，才能授權並且訂閱我們的 LINE Notify 通知：

https://notify-bot.line.me/oauth/authorize?response_type=code&scope=notify&response_mode=form_post&client_id=xxx&redirect_uri=xxx&state=xxx

看到這一大坨，可能就頭暈了，其實這就是一個 OAuth 2.0 的登入流程，至於運作原理就不在這贅述，我們只要知道使用者可以透過這個網址登入並授權通知這件事情就好。每個查詢字串的用途說明如下：

scope: 固定寫 notify 就對了。
response_type: 固定寫 code 就對了。
response_mode: 固定寫 form_post 就對了。
redirect_uri: 填上剛剛我們複製的第二個 Forwarding 網址。
client_id: 填上剛剛我們複製的 Client ID
state: 用來防止 CSRF 攻擊，我們填上一組亂碼就可以了。

當使用者點擊這個網址進去後，可以選擇您要接收通知的聊天室，我們也可以選擇 透過1對1聊天接收LINE Notify的通知 來發通知給自己。

選取完畢後，按下 同意並連動 按鈕即可完成訂閱，此時使用者會收到與「服務名稱」連動完成的通知。此時瀏覽器會重新轉址，網站會有問題，但是不重要。

順帶一提，如果訊息接收者是群組，那麼你還必須把這個 LINE Notify 帳號加入到該聊天室才可以正常收到通知喔！

訊息接收者

取得授權碼 (code)

當授權通知方按下剛剛那坨網址，並且點選 同意並連動 按鈕之後，使用者的瀏覽器會直接對 redirect_uri 所設定的網址發出 HTTP POST 要求，這個請求會被打到剛剛 ngrok 產生的網址。

我們接著透過 ngrok 後台 http://127.0.0.1:4040/ 來看看剛剛 HTTP POST 傳入的內容，其中我們可以看到有 code 這個參數，先複製下來，我們等等要使用！

取得存取權杖 (access_token)

安裝 curl 工具

我們一樣使用 homebrew 來安裝 curl 工具

brew install curl

發送請求取得 token

任何通知訊息都需要有 Access Token 才能發出，所以我們要先請求一個 token 來發送通知：

curl -d "grant_type=authorization_code&redirect_uri=xx&client_id=xx&client_secret=xx&code=xx" https://notify-bot.line.me/oauth/token

參數說明如下：

grant_type：固定寫 authorization_code 就對了。
redirect_uri：填上剛剛我們複製的第二個 Forwarding 網址。。
client_id：登錄服務的 Client ID
client_secret：登錄服務的 Client Secret
code：剛剛複製的授權碼 code

你將會得到以下 JSON 內容：

{
    "status":200,
    "message":"access_token is issued",
    "access_token":"xxxxxxx"
}

太好了，這樣我們就拿到 access_token 了。接著，我們就可以透過這個 access token 來發送推播通知給訂閱者囉！

發送 LINE Notify 通知訊息

接著我們可以透過 curl 命令來發出 LINE Notify 訊息：

curl -H "Authorization: Bearer xxxx" -d "message=I Love WordPress" https://notify-api.line.me/api/notify

我們會需要在 Custom Header 放一個 Bearer Token 的 Authorization。所以我們要在 Bearer 後面放上我們剛剛拿到的 Access Token。如果成功發出訊息，也會得到 JSON 回應：

{
    "status":200,
    "message":"ok"
}

並且在 LINE 上也會即時收到通知訊息：

【第 21 天】什麼是 LINE Notify？

有在使用 LINE OA 的人應該都有一種痛，那就是發送推播的成本真的很痛。但其實你要透過 LINE 完全免費 的訊息推播服務也不是不行，有種東西就叫做 LINE Notify，這就是我們今天要介紹的主角！

運作方式

LINE Notify 是一個「訊息推播」服務，但和以往我們認識的訊息推播有那麼一些些的不同，他的運作方式是這樣的：

首先，LINE 官方提供了一個 LINE Notify 帳號，他也是一個 LINE chatbot。只要使用者有訂閱你的 LINE Notify 推播服務，當你發送訊息的時候，使用者就會透過這個 LINE Notify 帳號收到通知。也因此我們都可以成為服務提供者，發送推播給任何人，而且完全不用任何費用！

真的認真要說有什麼缺點的話，我覺得．．．

因為訊息變成一律由官方的 LINE Notify 帳號發出，而不是由自己建立的 LINE OA 來發出訊息。LINE Notify 就會顯得沒 LINE OA 有那麼強烈的品牌連結！
所有 LINE 用戶都要主動去訂閱你的通知服務才收得到訊息，大部分 LINE 使用者根本不清楚 LINE Notify 是什麼東西！也就會不敢使用。
目前還只能發送文字訊息，所以有時候就顯得沒 LINE OA 可以發送 flex message, template message 或 image ….這麼豐富，

但是不得不說，如果要找一個經濟實惠的解決方案，來作為特定訊息的通知，或是用來整合現有服務的通知，LINE Notify 還是個很實際的解決方案！

角色定義

在我們開始使用 LINE Notify 完成通知任務前，我們必須先理解以下角色：

服務提供者

就是發送訊息的我們，通常會是一支程式或網站（是的，我們等等就是要用 WordPress 來發送），他必須要有一個可以接受 OAuth 2.0 認證通過後的 callback 網址。

另外，在發送 LINE Notify 通知的時候必須使用 Access Token ，我們我們也必須透過這個網址來取得。

授權通知方

也就是使用者，而這些 LINE 使用者必須擁有一個可以登入 LINE 的 E-mail 帳號，才能授權 LINE Notify 發出通知。

訊息接收者

也就是授權後的使用者，而 LINE Notify 服務有兩種訊息接收者：

用戶 user：就是授權的使用者。
群組 group：就是授權的群組。

這樣應該對 LINE Notify 有些基礎的觀念囉！明天我們會來建立一個 LINE OA ，然後試著透過 curl 發送我們的第一則 LINE Notify 囉！

WordPress 核心提供的 hook

其他外掛提供的 hook

好的外掛名稱

建立外掛目錄

別忘了 README.text

定義一下外掛

服務提供者

ngrok

安裝 ngrok

啟用 ngrok

登入 LINE Notify 服務

授權通知方

訊息接收者

取得授權碼 (code)

取得存取權杖 (access_token)

安裝 curl 工具

發送 請求取得 token

發送 LINE Notify 通知訊息

運作方式

角色定義

服務提供者

授權通知方

訊息接收者

發送請求取得 token