[TIL] 如何快速重置上手習慣的 MacOSX 環境

摘要

就在今年情人節,整台筆電就這樣爆炸了。 (霹靂星球….) 整個電池忽然無法充電,導致我只能盡快的麻煩公司的同事借來一台備用電腦。 但是整個使用習慣實在很痛苦,導致還是開了一個新的使用者將所有常用的設定都恢服。

這裡快速紀錄一下,我做了哪些事情。有興趣的人也可以參考我的設定。

基礎開發環境

先快速裝幾個需要的工具

漂亮的字型很重要

> git clone https://github.com/ryanoasis/nerd-fonts
> cd nerd-fonts
> ./install.sh

#

順手的東西 zsh + oh-my-zsh

這邊簡單多了,參考這篇好文章 “超簡單!十分鐘打造漂亮又好用的 zsh command line 環境”,條列出我有用到的:

  • iTerm2

  • powerline font

    • brew tap homebrew/cask-fonts
      
    • brew cask install font-source-code-pro
      
    • “SourceCodePro Nerd Font”, 18,
  • ZSH

    • brew install zsh
      
  • Install oh-my-zsh

    • sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
      
  • Install zsh integration for iTerm2

  • Install PowerLevel9k

    • git clone https://github.com/bhilburn/powerlevel9k.git ~/.oh-my-zsh/custom/themes/powerlevel9k
  • 復原 zsh configuration

    • https://github.com/kkdai/zsh

    • Install related plugin

      • git clone https://github.com/zsh-users/zsh-completions ${ZSH_CUSTOM:=~/.oh-my-zsh/custom}/plugins/zsh-completions
        git clone https://github.com/zsh-users/zsh-syntax-highlighting ${ZSH_CUSTOM:=~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting
        git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:=~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions
        
    • 有些用不到的可以先不要

      • miniconda
      • kubetcl
  • 讓 vscode terminal 顯示 zsh http://www.evanlin.com/til-zsh/

    • user.setting (cmd+,)
  • "terminal.integrated.shell.osx": "zsh",
    "terminal.integrated.cursorBlinking": true,
    "terminal.integrated.fontSize": 12,
    

我有兩個 git 網站需要兩把 key 一個 email 是 [email protected] [email protected] 我該怎麼產生這兩把 key 然後可以使用 SSH 登入?

要為兩個不同的 Git 網站(例如 GitHub、GitLab 等)生成兩把 SSH 密鑰,並分別使用不同的電子郵件地址([email protected][email protected])進行 SSH 登錄,你可以按照以下步驟操作。這些步驟假設你使用的是 Linux、macOS 或 Windows(使用 Git Bash 或 WSL)。

步驟 1:生成兩把 SSH 密鑰

  1. 打開終端

    1. 在 Linux/macOS 上使用終端。
    2. 在 Windows 上使用 Git Bash 或 WSL。
  2. 為第一個電子郵件生成第一把密鑰

    ssh-keygen -t ed25519 -C "[email protected]" -f ~/.ssh/id_ed25519_email1

    • -t ed25519:指定使用 Ed25519 算法(更安全且高效)。
    • -C “[email protected]”:添加註釋(這裡是你的電子郵件)。
    • -f ~/.ssh/id_ed25519_email1:指定生成的密鑰文件路徑(私鑰為 id_ed25519_email1,公鑰為 id_ed25519_email1.pub)。
    • 按提示設置密碼(可選,建議設置以增加安全性)。
  3. 為第二個電子郵件生成第二把密鑰

    ssh-keygen -t ed25519 -C "[email protected]" -f ~/.ssh/id_ed25519_email2

  4. 檢查生成的密鑰:

    1. ~/.ssh/ 目錄下,你應該會看到以下文件:

      id_ed25519_email1 id_ed25519_email1.pub id_ed25519_email2 id_ed25519_email2.pub

步驟 2:配置 SSH 客戶端

為了讓 SSH 知道如何根據不同的 Git 網站使用不同的密鑰,你需要創建或編輯 SSH 配置文件。

  1. 創建或編輯 SSH 配置文件

    1. touch ~/.ssh/config chmod 600 ~/.ssh/config

    2. 用編輯器(例如 nano 或 vim)打開 ``~/.ssh/config`

    3. 添加以下配置

# 第一個 Git 網站(例如 GitHub)
Host github.com
    HostName github.com
    User git
    IdentityFile ~/.ssh/id_ed25519_email1
    IdentitiesOnly yes

# 第二個 Git 網站(例如 GitLab)
Host gitlab.com
    HostName gitlab.com
    User git
    IdentityFile ~/.ssh/id_ed25519_email2
    IdentitiesOnly yes
  • Host:自定義一個別名(例如 github.com 或 gitlab.com)。
  • HostName:實際的域名。
  • User:Git 服務通常使用 git 作為用戶名。
  • IdentityFile:指定對應的私鑰文件。
  • IdentitiesOnly yes:確保只使用指定的密鑰。
  1. 保存並退出

步驟 3:將公鑰添加到 Git 網站

  1. 複製公鑰到剪貼板

    1. cat ~/.ssh/id_ed25519_email1.pub
  2. 對於第二把密鑰:

  3. cat ~/.ssh/id_ed25519_email2.pub

  4. 添加到 Git 網站

    • GitHub

      1. 登錄到 GitHub,進入 Settings > SSH and GPG keys > New SSH keyAdd SSH key
      2. 粘貼第一把公鑰(id_ed25519_email1.pub),給它一個描述性名稱(例如 email1-key)。
    • GitLab

      (或其他網站):

      1. 登錄到 GitLab,進入 User Settings > SSH Keys
      2. 粘貼第二把公鑰(id_ed25519_email2.pub),給它一個描述性名稱。
    • 根據網站的具體要求保存。


步驟 4:啟動 SSH Agent 並添加密鑰

  1. 啟動 SSH Agenteval "$(ssh-agent -s)"

  2. 添加私鑰到 SSH Agent ssh-add ~/.ssh/id_ed25519_email1 ssh-add ~/.ssh/id_ed25519_email2

    如果設置了密碼,會提示你輸入。

  3. 檢查已添加的密鑰 ssh-add -l

    你應該能看到兩把密鑰的指紋。

步驟 5:測試 SSH 連接

  1. 測試第一個 Git 網站 ssh -T [email protected]

    1. 如果配置正確,你會看到類似以下的輸出:

    2. Hi username! You’ve successfully authenticated…`

  2. 測試第二個 Git 網站 ssh -T [email protected]

    同樣應該返回成功信息。

電腦電池壞掉我學到什麼

  • 就算是 blog 文章還沒寫文,每天進度也要放上 github
    • 原本只有 local commit 忘記 push
  • “A git push a day, keep your computer safe anyway”

Reference


[好書分享] 瘋狂改變世界(Things a Little Bird Told Me : Confessions of the Creative Mind)

(圖片參考 讀墨)

作者:畢茲.史東  
原文作者:Biz Stone  
出版社:時報出版

買書推薦網址: http://moo.im/a/5bvHJO

前言:

雖然沒有工程的背景,卻用滿滿的熱情進入了 Google 工作。卻又因為自己想要創業的想法而離開 Google 並且透過熱情與創意的想法,建立了 Twitter 。這個 140 字卻具有天馬行空想像力的社交平台,全世界最受歡迎的社群網路之一。

這本書的文字不多,但是卻讓人讀起來相當的過癮。我週六就迫不及待的把它讀完。算是年假中心靈上第一個讓我覺得充實的收穫。

內容簡介:

就如同我提到的,一開始沒有工程背景的 Biz Stone 就透過 Google 的自我推薦的勇氣並且勇敢地參加 Google 的面試流程作為第一個章節的開場。 這本書主要的內容在敘述著:自我追求,勇氣與透過熱情來追求自己喜愛的事業。

之後開始敘述 Biz Stone 與 Evan Williams (部落格的創始人)一同離開 Google 之後想要尋找自己熱愛的下一個行業。當然過程中也沒有那麼順利,從 Odeo (podcast 的新創公司) 到重新決定要透過內部創業來思索下一個產品。充滿的熱情喜愛自由的 Biz Stone ,充分的發揮他的不畏懼任何失敗與自由的想法。 以下分享兩個書中提到的例子:

  1. 大學時候的 Biz Stone 拿到了全額的獎學金在設計學院之內。但是同時也在幫雜誌社擔任搬運的工讀生工作。因緣巧合下,偶爾的把自己的作品讓編輯看到大獲好評。當時也就勇敢的休息來擔任當全職設計師。邊在工作,邊學習設計相關的產業。
  2. 聽到 Blogger 被 Google 收購後,勇敢地寫下慶祝信件給沒見過面的 Evan Williams 並且毛遂自薦 Google 應該錄取他。

這些都充分地展現出來他骨子裡的勇氣與自由的因子。這些也都是造就 Twitter 的成功因素。全書也大部分在分享著他的自己是如何看到失敗,如何面對著疑惑的時候如何鼓起勇氣大膽做出具有創造力的嘗試。

心得:

這本書頁數不算多,但是讀起來相當的引人入勝。並不是因為你見證了網際網路裡面最瘋狂的因子,而是 Biz Stone 想要透過這短短的頁數來分享他是如何「瘋狂」 ,應該是說他是如何的無懼去面對每一個疑惑的選擇,透過從小的許多故事。你可以了解他如何來面對這些時刻,如何的勇敢到近乎瘋狂的狀態來處理每一個抉擇。 Twitter 無疑是網路上最自由的想法,如同他的圖示一般。自由而不受拘束的想法。

如果讀者們常常感受到疑慮,害怕失敗而不敢做決定,不敢往前邁進。建議來看看這本書。做個瘋狂而自由的自己。

[好書分享] 貝佐斯傳(The Everything Store : Jeff Bezos and the Age of Amazon)

(圖片參考 讀墨)

貝佐斯傳
從電商之王到物聯網中樞,亞馬遜成功的關鍵
The Everything Store : Jeff Bezos and the Age of Amazon

買書推薦網址: http://moo.im/a/14auRV

前言:

最近要開始撰寫一些之前看完的書籍的書,這一本貝佐斯傳應該是很久以前就想要拜讀的一本書。被《哈佛商業評論》評為「全球最佳現任CEO」,貝佐斯除了無止境的創造力與才能之外,大概為人熟知的就是跟賈伯斯齊名的暴躁性格。身為世界前三大(不斷輪替的排名)的企業執行長。到底是透過哪些轉折與哪些堅持才能讓亞馬遜到達今天的高度,都是我在開啟這本書之前的疑問。

內容簡介:

一開始就從奇特的前言。一本被敘述天才兒童的書籍<引爆天才>一本敘述著12歲但是穩重的天才兒童的書籍。「身材瘦小,待人和善但是個姓嚴肅」是這本書這樣敘述著這個稱為“提姆”的天才兒童。後來畫面一轉才帶到,他就是我們這本書的主角貝佐斯的小時候。

書籍一開始開始敘述著貝佐斯的性念。喜歡讀書的貝佐斯,辭掉了在華爾街的風險交易公司大筆薪水。隻身決定創立亞馬遜一個網際網路販賣書籍的電子商務。信念就是要滿足客戶所有的需求,以及要讓客戶獲得最大的利益。透過這樣的信念,從一開始的網路商城的販賣,到經歷著千禧年的網路泡沫的風暴。亞馬遜就是不段秉持著要讓客戶獲得最佳購買體驗的堅持下。不斷的修改與擴充著網站的功能。一鍵購買, Amazon Prime, 到相關推薦的功能。每一個都是亞馬遜的獲勝關鍵,但是回過頭來看卻都是最能夠讓使用者方便購買與提升滿意度的功能。

第二段提到他的文學素養,從他從小喜歡閱讀書籍開始。不喜歡事情被簡化處理,於是要求部門報告捨棄投影片的格式。使用六頁的文字報告。除了要求報告的人要能夠清楚的報告與敘述問題之外,也要求他們要能夠有效的將要講解的事情縮短在六頁的內容之中。再來,喜歡閱讀的個性根深蒂固。也造就了電子閱讀器 Amazon Kindle 這個亞馬遜劃世代的秘密武器的誕生。這本書也清楚地刻畫了電子閱讀器如何在亞馬遜誕生的過程。從硬體的製造,到內容的產生如何縝密的企劃,造就 Kindle 上市的時候熱賣的熱潮。

最後面提到貝佐斯常常自詡是傳教士,希望能夠讓客戶獲得最方便最合理的價格來獲得他們要的商品。但是貝佐斯也不得不提他的商業手段。不論身為執行長的快速理解的能力,並且能夠正確的看穿每個人報告的盲點,毫不留情面的批評(恩,可能到罵)也是貝佐斯為人熟知的一面。

「這份文件是B咖團隊寫的,請給我一份A咖團隊的文件」「你這個人到底是懶惰,還是無能?」這些都是貝佐斯不留情面的批評。但是由於能夠批評到正確的點,讓團隊的每個人都能夠信服。自詡為傳教士的貝佐斯也說「我寧可當傳教士,再怎麼樣也不會去當傭兵。弔詭的是通常傳教士賺的比傭兵多」 XDDD

當然這本書也有亞馬遜在商業上的專注與霸道的一面。從聯合使用者來大砍傳統書商的價錢,到電子書方面的手法都是相當的高明。也是這本書很推薦的一個部分。

心得:

起初看貝佐斯的時候,會以為他比較像是賈伯斯一樣的是極端的完美主義者。但是飽讀詩書的貝佐斯又不僅僅是完美主義者。更是完美的現實主義者。透過許多實際的手段要達到他心目中的理想境界。 在亞馬遜連續虧損的狀況下,卻能夠堅持已見不段打造出強大的亞馬遜王國。透過他自己的夢想,一個喜歡閱讀書籍,喜歡太空產業的小男孩。搖身一變成為世界上數一數二強權的執行長。這本書的敘述會讓你覺得一點都不是運氣,是不斷的堅持,不斷的努力。 日以繼夜地思考與努力打磨著最好的消費者體驗的結果。

這本書會像是看著一個記者不斷的從旁側寫的狀況來敘述。但是又能夠清楚的讓人了解貝佐斯的理念與想法,是如何深刻的影響他的處世與亞馬遜企業的核心價值。相當推薦大家來看看這本書。

[Golang][LINE][教學] 導入 LINE Login 到你的商業網站之中,並且加入官方帳號為好友

(圖片來自: Linking a bot with your LINE Login channel )

前言

剛起步的商業網站或是服務,想要吸引使用者來註冊,但是由於需要輸入一堆資訊讓使用者望之卻步。這個時候透過 OpenID 的登入方式常常可以吸引許多使用者快速加入服務。不論是透過透過 Google 或是 Facebook 的帳號都是很方便的。做為台灣手機軟體佔有率名列前茅的 LINE ,當然也有相關的服務稱為 LINE Login 。

繼上一篇 [Golang][LINE][教學] 將你的 chatbot 透過 account link 連接你的服務 教學之後,本篇文章將介紹 LINE Login 並且提供一個範例 (Golang) 講解如何導入 LINE Login 在已經有的商業網站服務之中。

常常也很多開發者在詢問,如何透過 LINE Login 在使用這加入服務的時候直接幫使用者加入官方帳號。這篇文章也會在最後的範例裡面提到該如何做。

為何要使用 LINE Login

許多的商業服務都會透過會員機制來提供許多專屬的優惠或是獎勵活動,但是會員的註冊與登入流程常常讓許多使用者覺得為難。除了要填寫許多的資料外,使用者還需要額外記住另外一組的帳號密碼。 LINE 在台灣的佔有率相當的高,並且幾乎每個使用者都有 LINE 的帳戶的狀況下,這時候如果能夠直接使用 LINE 帳戶來註冊與登入網站服務的話是不是相當的方便?

LINE Login 除了提供一個方式來登入之外,也可以提供使用者名稱,大頭照的相關資訊。並且透過 LINE Login 也可以同時讓使用者加入商業服務的 LINE官方帳號,讓使用者更無時無可都可以使用到相關的服務。

什麼樣的情況會建議使用 LINE Login

這裡會條列出哪些情況建議需使用 LINE Login 作為讀者來評量自己有沒有需要使用 LINE Login :

  • 剛開始要建立電子商務服務或是網站,想要減少使用者註冊的時間並且快速加入。
  • 想要推廣自身官方帳號的聊天機器人服務。
  • 就算是已經推廣一段時間的電子商務服務,但是想要透過 LINE 來接觸不同的客戶群。

了解為什麼使用 LINE Login 以及甚麼狀況下建議使用之後,接下來就引導讀者如何使用範例程式碼

範例程式碼

https://github.com/kkdai/line-login-go

如何部署範例程式碼:

  • LINE Developer Console 建立相關的 Provider 跟 Channel。

  • 建立一個 LINE Login 的帳號,並且將以下兩個資訊記住:

    • Channel ID
    • Channel Secret
  • 另外建立一個 LINE@ 並且打開 MessageAPI 的功能(也就是建置 chatbot 用),並且將以下兩個資訊記住:

    • Channel Secret
    • Channel Token
  • https://github.com/kkdai/line-login-go 按下 Heroku Deploy ,建立該帳號並且部署該服務。這時候會要輸入三個資訊:

    • LINECORP_PLATFORM_CHANNEL_CHANNELID
      • 填入 LINE login channel ID
    • LINECORP_PLATFORM_CHANNEL_CHANNELSECRET
      • 填入 LINE login channel Secret
    • LINECORP_PLATFORM_CHATBOT_CHANNELSECRET
      • 填入 Chatbot channel Secret
    • LINECORP_PLATFORM_CHATBOT_CHANNELTOKEN
      • 填入 Chatbot channel Token
    • LINECORP_PLATFORM_SERVERURL
      • 這個資訊根據你的 heroku app 名稱來決定,假設你的 Heroku app 名稱叫做 test-api-1234 那麼你就該填 https://test-api-1234.herokuapp.com
  • 回到 LINE Login 的帳號設定,[App setting] 將以下位置寫入 callback URL https://test-api-1234.herokuapp.com/auth

  • 回到 LINE chatbot 的帳號設定,記得把 https://test-api-1234.herokuapp.com/callback 加到 LINE chatbot web hook 才能正確地啟動聊天機器人。

實際跑一個範例

  • 當部屬好網站服務後,直接用瀏覽器登入網站即可。如果沒有部署的人,可以使用 https://login-tester-evan.herokuapp.com/
  • 連線到網站後會看到有三個 LOGIN botton 選項
    • LINE Web Login
    • LINE Web Login with chatbot (normal)
    • LINE Web Login with chatbot (aggressive)
  • 如果你選擇第一個登入,就會直接跳到 LINE Login 的選項。
  • 如果你選擇第二個選項,在 Consent Page (使用者同意頁面) 會多一個是否加入官方帳號的選項。
  • 第三個跟第二個類似.只是會將加入官方帳號的選項另外跳出一夜。讓使用者更容易加入。

流程圖與程式碼解釋

(圖片來自: Integrating LINE Login with your web app)

以下的內容均參照 Integrating LINE Login with your web app

  • (1). 首先瀏覽器訪問該網站 (假設你直接使用 https://login-tester-evan.herokuapp.com/),進入了 browse() 顯示出三個 LINE Login 按鈕。
  • (2). 使用者按下了 LINE Web Login 的話,就會進入 gotoauthpage() 直接產生一組 API URL 直接導向到 https://access.line.me/oauth2/v2.1/authorize 。這邊其實有一些參數可以設定,可以參考 LINE Login 參數設定
  • (3). 使用者這時候會連到 LINE Platform 來進行登入的步驟,不論是透過 App 登入還是輸入帳號密碼的登入方式。登入完成後會透過 redirect_uri 網址的位址傳回一組 code ,作為使用者資料的存取之用。 這時候會呼叫到 auth() 來解析 code 。
  • (4). 在同一個 auth() 之中解析 code, state, 與 friendship_status_changed 後,檢查 state 正確性之後。就可以透過 code 去抓取使用者的資料了。 這時候會呼叫 https://api.line.me/oauth2/v2.1/token 的 API ,相關必要參數也可以參考這個網址
  • (5). 一樣在 auth() 之中,回傳的結果可以得到 id_token ,透過 id_token 需要透過解譯的方式來將它還原成使用者的資料。這邊也已經包裝好為 DecodeIDToken()
  • 透過 DecodeIDToken() 就可以得到使用這名稱與大頭照。 (email 需要額外申請)

以上就是一般的電子商務網站的導入流程,接下來就介紹如何在導入 LINE Login 的時候直接加入官方帳號 (聊天機器人) 為好友的步驟。

在 LINE Login 同時直接加入官方帳號為好友

根據 Linking a bot with your LINE Login channel的教學,以下將流程簡化讓大家能夠快速了解。讀者可以直接透過範例網站或是程式碼來感受之間的差異性。主要就是 bot_prompt={BOT_PROMPT} 這個參數的差別。

  • 使用者點下 LINE Web Login with chatbot (normal) 的按鈕,則會送出 bot_prompt=normal 。在使用者同意頁面會出現官方帳號的選項給使用者選取。
  • 使用者點下 LINE Web Login with chatbot (aggressive) 的按鈕,則會送出 bot_prompt=aggressive。這時候會跳出一個新的頁面讓使用者來使用者選取是否要加入官方帳號。

這邊提出幾個建議在接受 friendship_status_changed 的時候,需要注意的事項:

  • friendship_status_changed 回傳為 true 的時候,這時候需要透過 https://api.line.me/friendship/v1/status 的 API 再去確認好友狀態的變化。
  • 如果有加入好友的話,建議也可以緊接著進行 account-link 的相關設定。在 web login session 還維持的時候可以快速將使用者的 chatbot 與帳號鏈結在一起。

總結

對於一個新的服務,如何快速的讓使用者能夠註冊與登入是一個大難題。這時候透過 LINE Login 可以幫你解決大多數的問題,並且 LINE Login 在手機上往往可以直接開啟 LINE App 使用者連登入的流程都省略了。馬上就註冊完畢與登入。 使用者也不需要擔心, LINE Login 僅僅提供名字與大頭照作為基本資料( Email 需要申請 ) 。

本篇文章透過一個簡單的 Golang 範例,展示了如何快速導入 LINE Login 到電子商務網站之外。還指引了如何透過 LINE Login 來加入官方帳號的聊天機器人到使用者的 LINE 帳戶。 讓使用者在透過 LINE Login 的同時也馬上了解該服務的 LINE 官方帳號的位置。並且可以提供更多元的服務。

參考

[Golang][LINE][教學] 將你的 chatbot 透過 account link 連接你的服務

(圖片來自: LINE Developer Document: Link user account )

前言

經營有成的電子商務網站,如果想要透過 LINE 官方帳號( OA: Official Account) 與聊天機器人來觸及更多使用者應該要怎麼做呢? 你要如何透過安全又有效的方式來串連網站與 OA 的互動呢?

這篇文章將介紹 LINE account binding,透過 account binding 可以讓你的 chatbot 了解面對的使用者身份。並且透過綁定帳號的方式來提供使用者一制化的體驗。並且透過一個範例來讓你更容易快速建置出來。

範例程式碼

https://github.com/kkdai/line-account-link

如何部署範例程式碼:

  • LINE Developer Console 建立相關的 Provider 跟 Channel

  • 建立一個 LINE@ 並且打開 MessageAPI 的功能,並且將以下兩個資訊記住:

    • Channel Secret
    • Channel Token
  • 到 https://github.com/kkdai/line-account-link 按下 Heroku Deploy ,建立該帳號並且部署該服務。這時候會要輸入三個資訊:

    • LINECORP_PLATFORM_CHANNEL_CHANNELSECRET
    • LINECORP_PLATFORM_CHANNEL_CHANNELTOKEN
    • LINECORP_PLATFORM_CHANNEL_SERVERURL
      • 這個資訊根據你的 heroku app 名稱來決定,假設你的 Heroku app 名稱叫做 test-api-1234 那麼你就該填 https://test-api-1234.herokuapp.com/
  • 記得把 https://test-api-1234.herokuapp.com/callback 加到 LINE chatbot web hook 才能正確地啟動聊天機器人。

範例應用場景

這個範例想要表的是一家電子商務公司有 三個使用者 (ID: 11, 22, 33) 也都有相關的身份資料在該電子商務網站。而這個聊天機器人可以展示如何透過 LINE account binding 來串連你的使用者與聊天機器人。

整個場景都流程分成以下幾個步驟:

  • 使用者加入電子商務的官方帳號 。
  • 在官方帳號選單的聊天機器人視窗中,選擇“帳號綁定” (link)。
  • 連線到該電子商務網站,輸入原本已經有的帳號跟密碼。
  • 確認帳號訊息無誤後,倒回聊天機器人並且進行帳號綁定。

實際跑一個範例

  • 先 Deploy 該範例專案,或是直接加入測試機器人 @yzy8635g (也可以掃描以下 QR Code)
  • 加入帳號後 ,輸入任何字串都是會顯示帳號尚未綁定。你可以連到該商業網站顯示帳號 (list) 或是直接開始綁定帳號 (account link)

  • 按下 “list” 會傳回顯示所有使用者的網址.按下 “link” 則顯示登入頁面開始登入。

  • 到了登入網頁,就輸入該商業網站的帳號跟密碼。 這個範例程式裡面是 11, pw11 (假定使用者叫做 Paul)
  • 登入成功之後,就會收到 chatbot 回報帳號綁定成功。把綁定帳號網頁關閉即可。(要做得更好,可以透過 LIFF 來做 account binding 就可以自動關閉網頁)
  • 回到聊天機器人,這時候帳號就顯示綁定完成。表示 chatbot 能夠將你與商業網站的使用者連接一起。 chatbot 也就已經將使用者 Paul 的帳號綁定。

流程圖與程式碼解釋

根據以上的流程圖,稍微說明一下每個角色代表的意義:

  • User:
    • 就是指的是 LINE 上面的用戶。
  • Provider’s bot server:
    • 這邊指的就是該商業服務的 LINE 官方帳號的聊天機器人伺服器。
  • Provider’s web server:
    • 這個就是該商業服務的網站伺服器,如果是購物網站就是該購物網站的後台伺服器。
  • LINE Platform:
    • 這個就是指 LINE 平台的資料處理系統。

了解每個角色代表的意義之後,我們開始解釋每個流程所代表的意思.通常在 Account Link 發生的時候,商業網站的官方帳號會發送一個「是否要連接你的 LINE 帳號與商業網站?」的請求.當使用者同意之後,才會啟動以下的相關步驟:

  1. 官方帳號的 LINE bot 會對 LINE 平台發送一個該使用者要求 account link 的 token 請求。

  2. 如果請求資料正確, LINE 平台就會回覆一個 token 。

    res, err := bot.IssueLinkToken(userID).Do() 這樣可以透過該使用者帳號直接 issue token

  3. 官方帳號的 LINE bot 透過取得的 token 跟 LINE 平台請求將兩個資料做連接。

  4. LINE 平台會傳回一個網址,讓使用者透過該網址來做資料的連接。

    這邊就傳回 該網站的 /link以這個作為鏈結的網址。

  5. 使用者連線到該網址(這裡通常是透過 LINE bot 直接送出 URL scheme 讓使用者點選導向該網頁).請注意這個網址會是直接連接到商業網站之中。

  6. 顯示該商業網站的登入畫面,讓使用者登入該綱頁網站。

  7. 使用者在商業服務平台輸入了自己的登入資訊。

  8. 商業服務平台透過使用者的帳號資訊產生了一個隨機數 (nonce)。

    雖然說 nonce 為隨機數,其實有產生的規則與限制

    • 使用 secure random number generator
    • 建議透過 base64 encode
  9. 商業服務平台將使用者導向到 LINE 平台的 account-linking 的進入點。

  10. 使用者讀取 account-linking 進去點,並且將商業服務平台的隨機數帶進去。

  11. LINE 平台傳回同一組隨機數與使用者 ID (UID) 到商業服務平台的 webhook 用來作為綁定之用。

  12. LINE bot 這時候收到該隨機數 (nonce) 的認證,透過這個隨機數 (nonce) 將使用者在 LINE 上面的身份與商業服務平台帳號取得綁定。

    也就是最後要將這些資訊傳回給 Server ,作為綁定成功地確認https://access.line.me/dialog/bot/accountLink?linkToken={link token}&nonce={nonce}

  13. 這時候 chatbot 會收到 EventTypeAccountLink 的 event 並且透過結果可以知道該使用者綁定成功。 nonce 也會提供給你作為帳號比對的資訊。

為何要使用 Account Link

透過 account link 可以讓 chatbot 裡面的使用者與原先商業網站的帳號相互的綁定。透過的機制就是一開始 issue link token 並且在登入成功後將 token 帶回到 chatbot 裡面,並且透過產生的 nonce 可以確保雙方資料的無誤與正確性。 整體來說,使用 account link 具有以下的優點:

  • 步驟簡單:透過 IssueLinkToken 與 API call 即可完成整個綁定流程。
  • 安全:透過改使用者申請的 token 才能夠作為 accountLink 的回傳 token ,可以確保手續完整性。

什麼樣的情況會需要使用 Account Link

這個部分將會討論,什麼樣的情況下會需要使用 account link:

  • 已經有大量的使用者族群在原有的商業網站上面
  • chatbot 需要綁定原有的使用者資訊

總結

對於已經有相當量使用者的服務提供商而言,透過 account link 可以讓 chatbot 的使用者與原有服務的帳號資訊綁定,讓使用者有著一致的服務體驗。方法上也相當簡單,希望透過這個範例可以讓開發者更容易了解整個流程與概念。

參考

  • https://developers.line.biz/en/docs/messaging-api/linking-accounts/
  • https://github.com/kkdai/line-account-link

[Golang][LINE][教學] 如何傳送 LINE 專屬的表情符號(emoji)

前言

大家都知道 LINE 有一些自己獨特的表情符號(而非一般的 emoji) ,如果真的想要在 chatbot 中來顯示表情符號其實沒有那麼簡單。剛好發現其實網路上的資源也不多,順便寫一下相關資料分享給大家。

顯示一般的表情符號 (Emoji)

⚽️ 🏀 🏈 ⚾️ 🏐 🏉 🎾

如果要顯示 emoji ,其實他的代碼可以直接複製。這裡有兩種方式可以顯示。

  • 直接將 emoji 複製起來,貼到字串裡面即可 str := 🍆 即可

如果要顯示完整 emoji 列表可以去這裡找

如果要透過 Golang 來顯示,可以透過以下的程式碼:

關於 LINE 自訂的表情符號

首先要先解釋一下, 一般來說如果要在官方帳號(OA) 上面直接發送具有 LINE 特定的表情符號可以透過以下方式。

\uDBC0\uDC84  

這一段代表的就是顯示熊大的表情符號。但是你會發現不論你如何顯示都無法正常顯示。

經過尋找過後,發現以下的 issue 已提醒相關的資料。Python LINE SDK discussion

裡面有提到兩件重要的事情:

  • LINE Emoji 是自定義的,要參考 LINE Emoji document
  • 透過另外一個討論 Java LINE SDK discussion ,會發現 LINE Emoji 需要透過 utf32 來轉換到 utf8 。 (因為 Golang 本身都是透過 utf8 來處理字串)

所以處理方式如下:

  • 透過 LINE Emoji document 來查表,找尋需要的 熊大 Brown 表情 0x100084
  • 由於是 32 位元,前面補零 0x00100084
  • 產生 utf32 decoder
  • 轉換 utf32 成 utf8

那就直接來看程式碼:

參考