【LINE】如何讓顧客使用 LINE 帳號登入
LINE帳號登入:
商家可以使用自己的公司作為 LINE 登入提供者
串接 EasyStore 與商家的 LINE 商用帳號
登入 LINE Bussiness ID
![](https://storage.crisp.chat/users/helpdesk/website/98a7370e9bd67800/cc4ff031-2e28-4887-bb5a-d95b75_1yomlqq.png)
點擊【設定】> 【Messaging API】 > 【啟用Messaging API】
![](https://storage.crisp.chat/users/helpdesk/website/253b9f2ceff68000/f31cf4f6-759d-486e-a7b4-ee69c8_l3fsdd.png)
【建立服務提供者】,建議填寫品牌商店名稱
![](https://storage.crisp.chat/users/helpdesk/website/1fe3f67b23781300/ddeb5b41-a0d7-4c61-a7d3-617861_188khhg.png)
這裡可留空白,直接點擊【確定】
![](https://storage.crisp.chat/users/helpdesk/website/3af6cd13a7c8f20/e631d2d6-f96e-4131-8245-47df4e_3rqez0.png)
再點擊【確定】,這樣就已經成功開啟 Messaging API
![](https://storage.crisp.chat/users/helpdesk/website/9d4d42480db5b000/d870d4e6-1833-4bee-8588-1cded5_jbgim1.png)
開啟完後的頁面,如圖下:
![](https://storage.crisp.chat/users/helpdesk/website/58ca7dc597b90c00/440150c0-8f86-400c-8073-100a3c_1h3mp61.png)
下方點選【LINE Developers】的後台
![](https://storage.crisp.chat/users/helpdesk/website/8bf0c49394b66000/c6c6d6c4-7378-4c6d-95e5-78e064_109d4kw.png)
點選【右上頭貼】> 按【LINE Developers Console】
![](https://storage.crisp.chat/users/helpdesk/website/d080426984cc9800/ad7f0d8d-c666-42f3-b363-8466a0_hwubxc.png)
選擇剛建立的 provider (服務提供者)> 點擊【Create a new channel】
![](https://storage.crisp.chat/users/helpdesk/website/e47f8cbccf138800/4044058c-32ba-4365-a148-cb758a_czqtp0.png)
點擊 "Create a LINE Login channel"
![](https://storage.crisp.chat/users/helpdesk/website/87986a0aa13c5800/76ecbc02-ea0a-41a3-abf2-ef8cdd_2l29fq.png)
確保您的 Channel type 是 LINE Login,Provider 是您公司名稱,選擇您的 Region,例如 台灣
![](https://storage.crisp.chat/users/helpdesk/website/6349da77292d0400/4c2e1be8-3f25-4a5c-831f-fb1726_77b9yi.png)
輸入以下的設定:
Channel name
Channel description
App types : 選擇 Web app
![](https://storage.crisp.chat/users/helpdesk/website/dd7866aabada8800/7794aa61-597e-41c9-bf24-07f59a_rvh4pu.png)
您可以參考以下是顯示在前台的例子:
![](https://storage.crisp.chat/users/helpdesk/website/e667066add59f000/4ac99d6a-6c00-4ee1-b9a5-cb9c47_d3s3cp.png)
點擊 【同意】 ,並前往點擊 【Create】
![](https://storage.crisp.chat/users/helpdesk/website/1b9c5f68c5255500/e272d58d-573c-4516-816c-347455_kun1ms.png)
您已經成功建立了 LINE 登入管道
![](https://storage.crisp.chat/users/helpdesk/website/d99c625142afe800/481fb5be-59f7-463a-9d21-935ce5_r2onbl.png)
這裡您在 Basic settings > Basic Information > Channel ID > 複製
![](https://storage.crisp.chat/users/helpdesk/website/773cf1ecc9286000/9f0bc887-aaad-455e-9887-e7d350_1jykmyl.png)
接下來,您會看到:Channel secret > 複製
![](https://storage.crisp.chat/users/helpdesk/website/9dd957142d7b680/496cf365-35f7-4ea2-b649-33bdbe_265df4.png)
複製了 Channel ID 和 Channel Secret, 前往 EasyStore 後台 > 客戶管理 > 更多 > 客戶設定 >
![](https://storage.crisp.chat/users/helpdesk/website/ed47a10bf186d800/09cf961f-1d16-4056-be09-1d3485_1agnr11.png)
在客戶設定 > Login methods > LINE > 設定 Enabled 啟用 > 將所複製的 Channel ID 和 Channel Secret 填入後台
![](https://storage.crisp.chat/users/helpdesk/website/9f4e4537f9496000/91afd06b-f3b0-40b9-948f-9ba8c8_3rtiek.png)
回到 LINE Developers Console 後台,前往 【LINE Login】
![](https://storage.crisp.chat/users/helpdesk/website/fa85a1ec5959b000/86d3f192-4a71-4cec-8f97-137fc9_1w8ymfl.png)
在LINE Login settings 里 > Callback URL > 輸入 https://easy.co/multipass/line > 點擊 Update
![](https://storage.crisp.chat/users/helpdesk/website/a272dc81e8258800/334e7a70-2cc9-4028-b37c-6b9c75_gefm86.png)
設定完畢之後,回到 > Basic settings > 拉直最下方 > OpenID Connect 區塊
![](https://storage.crisp.chat/users/helpdesk/website/8decdfad28fac000/07dfec17-a693-46ef-a638-6db7c3_19ej5bm.png)
在 OpenID Connect,需要提交電郵地址允許申請 > 勾取以下格子 > 並點擊 Apply
![](https://storage.crisp.chat/users/helpdesk/website/d4a54dd82dc3d000/bf1bf4c7-9462-44a5-aee0-44236d_1aeqy1a.png)
在Screenshot > 上傳您的官網 【登入頁面】截圖 > 點擊 【Submit 提交】
![](https://storage.crisp.chat/users/helpdesk/website/e762d54d39a45800/87297f67-3e4d-495f-930e-8d3005_hx56x3.png)
小提示:以下是您官網 “登入頁面” 的截圖參考
![](https://storage.crisp.chat/users/helpdesk/website/74991ebb05065c00/57916614-97bb-45d2-8025-21ddee_b4itsb.png)
最後步驟,回到頁面最頂端,點擊 【Developing】 按鈕
![](https://storage.crisp.chat/users/helpdesk/website/9ca09c5484dfc000/3a0b5204-c4f2-4bb9-b61d-38243e_1so2fd5.png)
點擊 【Publish】, 發佈您的 LINE 登入管道就完成了
![](https://storage.crisp.chat/users/helpdesk/website/b91b797220387000/ffb6c712-4bfc-4067-8098-cceb6c_1vtxtid.png)
以下是當客戶使用 LINE 登入您後台的流程:
![](https://storage.crisp.chat/users/helpdesk/website/1f2de4cc97fbb500/144f3752-ce21-4db0-9881-962d81_19rihjc.gif)
顧客在使用 LINE 登入之後,自動跳出 “加入好友” 功能,讓客戶加您的 LINE 官方帳號為好友。
設定步驟教學:
1.前往 LINE Developers ,點擊 “Console” 或者 “Log In” 按鈕。
⭐ 請登入與申辦官方帳號相同的 Email
![](https://storage.crisp.chat/users/helpdesk/website/dc61b114a929a000/3eae9976-53f0-4a3e-938a-cd71cb_9founp.png)
或
於 LINE 官方帳號後台 > Messaging API > 下方點選**【LINE Developers】**登入 LINE Developer 後台
![](https://storage.crisp.chat/users/helpdesk/website/3663a5dc1b212600/9070bfa6-2ada-4663-a8d6-fdd32a_1nkekc0.png)
選擇 Provider > 點選【Messaging API】的Channel
![](https://storage.crisp.chat/users/helpdesk/website/11a56ec72bd59d0/5e3cbd7f-01a8-45ed-b924-082f32_qo1kzw.png)
點擊**【Messaging API頁籤】**
![](https://storage.crisp.chat/users/helpdesk/website/5dc6b5e9d2eb1000/a1b53c57-4bf1-4f9d-8fd7-f782fb_7kum1q.png)
![](https://storage.crisp.chat/users/helpdesk/website/f69d35dbf3cf4800/4555e28d-01b2-49b8-bffc-6044d3_crdtdy.png)
滑至頁面最下方, 在Channel access token中,點擊 “Issue”。
![](https://storage.crisp.chat/users/helpdesk/website/d78e217e1bb0400/e51a934c-9558-4464-80a2-489f9a_13983yg.png)
您已經成功獲得 Channel access token ,點擊 “複製”。
![](https://storage.crisp.chat/users/helpdesk/website/a441de06b0248000/eba3f4b4-27d3-4f69-a9e8-b5127a_1xqwli0.png)
複製好之後,回到您的 EasyStore 後台 > 銷售管道 > LINE>設定>存取權杖>粘貼上複製好的文字>儲存。
![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1paiyh3.png)
最後,前往 LINE Developer Console > LINE Login Channel > Basic Settings 界面 >尋找 Linked LINE Official Account 欄位>選擇您的官方帳號 > Update
![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_adkjhs.png)
設定完畢之後,客人在使用 LINE 登入時,會顯示以下“加入好友”按鈕,讓客戶可以馬上點擊按鈕,加您的LINE官方帳號
![](https://storage.crisp.chat/users/helpdesk/website/2fcb6780759b3200/99ba1221-d2aa-4301-9f27-c08108_eh55xa.png)
因 LINE Developer 改版,若設定後未成功串接,請檢查 Webhook 有無開啟,如下圖:
![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/frame-12_yb38f9.png)
顧客可以直接在 LINE 裡綁定官網帳號以接收訂單通知。你可參考這篇文章進行其餘設定: 【LINE】LINE 訂單通知
商家可以使用自己的公司作為 LINE 登入提供者
串接 EasyStore 與商家的 LINE 商用帳號
在這篇文章中:
1. LINE 帳號登入設定步驟
2. LINE 登入加入好友功能
1. LINE 帳號登入設定步驟:
登入 LINE Bussiness ID
![](https://storage.crisp.chat/users/helpdesk/website/98a7370e9bd67800/cc4ff031-2e28-4887-bb5a-d95b75_1yomlqq.png)
點擊【設定】> 【Messaging API】 > 【啟用Messaging API】
![](https://storage.crisp.chat/users/helpdesk/website/253b9f2ceff68000/f31cf4f6-759d-486e-a7b4-ee69c8_l3fsdd.png)
【建立服務提供者】,建議填寫品牌商店名稱
![](https://storage.crisp.chat/users/helpdesk/website/1fe3f67b23781300/ddeb5b41-a0d7-4c61-a7d3-617861_188khhg.png)
這裡可留空白,直接點擊【確定】
![](https://storage.crisp.chat/users/helpdesk/website/3af6cd13a7c8f20/e631d2d6-f96e-4131-8245-47df4e_3rqez0.png)
再點擊【確定】,這樣就已經成功開啟 Messaging API
![](https://storage.crisp.chat/users/helpdesk/website/9d4d42480db5b000/d870d4e6-1833-4bee-8588-1cded5_jbgim1.png)
開啟完後的頁面,如圖下:
![](https://storage.crisp.chat/users/helpdesk/website/58ca7dc597b90c00/440150c0-8f86-400c-8073-100a3c_1h3mp61.png)
下方點選【LINE Developers】的後台
![](https://storage.crisp.chat/users/helpdesk/website/8bf0c49394b66000/c6c6d6c4-7378-4c6d-95e5-78e064_109d4kw.png)
點選【右上頭貼】> 按【LINE Developers Console】
![](https://storage.crisp.chat/users/helpdesk/website/d080426984cc9800/ad7f0d8d-c666-42f3-b363-8466a0_hwubxc.png)
選擇剛建立的 provider (服務提供者)> 點擊【Create a new channel】
![](https://storage.crisp.chat/users/helpdesk/website/e47f8cbccf138800/4044058c-32ba-4365-a148-cb758a_czqtp0.png)
點擊 "Create a LINE Login channel"
![](https://storage.crisp.chat/users/helpdesk/website/87986a0aa13c5800/76ecbc02-ea0a-41a3-abf2-ef8cdd_2l29fq.png)
確保您的 Channel type 是 LINE Login,Provider 是您公司名稱,選擇您的 Region,例如 台灣
![](https://storage.crisp.chat/users/helpdesk/website/6349da77292d0400/4c2e1be8-3f25-4a5c-831f-fb1726_77b9yi.png)
輸入以下的設定:
Channel name
Channel description
App types : 選擇 Web app
![](https://storage.crisp.chat/users/helpdesk/website/dd7866aabada8800/7794aa61-597e-41c9-bf24-07f59a_rvh4pu.png)
您可以參考以下是顯示在前台的例子:
![](https://storage.crisp.chat/users/helpdesk/website/e667066add59f000/4ac99d6a-6c00-4ee1-b9a5-cb9c47_d3s3cp.png)
點擊 【同意】 ,並前往點擊 【Create】
![](https://storage.crisp.chat/users/helpdesk/website/1b9c5f68c5255500/e272d58d-573c-4516-816c-347455_kun1ms.png)
您已經成功建立了 LINE 登入管道
![](https://storage.crisp.chat/users/helpdesk/website/d99c625142afe800/481fb5be-59f7-463a-9d21-935ce5_r2onbl.png)
這裡您在 Basic settings > Basic Information > Channel ID > 複製
![](https://storage.crisp.chat/users/helpdesk/website/773cf1ecc9286000/9f0bc887-aaad-455e-9887-e7d350_1jykmyl.png)
接下來,您會看到:Channel secret > 複製
![](https://storage.crisp.chat/users/helpdesk/website/9dd957142d7b680/496cf365-35f7-4ea2-b649-33bdbe_265df4.png)
複製了 Channel ID 和 Channel Secret, 前往 EasyStore 後台 > 客戶管理 > 更多 > 客戶設定 >
![](https://storage.crisp.chat/users/helpdesk/website/ed47a10bf186d800/09cf961f-1d16-4056-be09-1d3485_1agnr11.png)
在客戶設定 > Login methods > LINE > 設定 Enabled 啟用 > 將所複製的 Channel ID 和 Channel Secret 填入後台
![](https://storage.crisp.chat/users/helpdesk/website/9f4e4537f9496000/91afd06b-f3b0-40b9-948f-9ba8c8_3rtiek.png)
回到 LINE Developers Console 後台,前往 【LINE Login】
![](https://storage.crisp.chat/users/helpdesk/website/fa85a1ec5959b000/86d3f192-4a71-4cec-8f97-137fc9_1w8ymfl.png)
在LINE Login settings 里 > Callback URL > 輸入 https://easy.co/multipass/line > 點擊 Update
![](https://storage.crisp.chat/users/helpdesk/website/a272dc81e8258800/334e7a70-2cc9-4028-b37c-6b9c75_gefm86.png)
設定完畢之後,回到 > Basic settings > 拉直最下方 > OpenID Connect 區塊
![](https://storage.crisp.chat/users/helpdesk/website/8decdfad28fac000/07dfec17-a693-46ef-a638-6db7c3_19ej5bm.png)
在 OpenID Connect,需要提交電郵地址允許申請 > 勾取以下格子 > 並點擊 Apply
![](https://storage.crisp.chat/users/helpdesk/website/d4a54dd82dc3d000/bf1bf4c7-9462-44a5-aee0-44236d_1aeqy1a.png)
在Screenshot > 上傳您的官網 【登入頁面】截圖 > 點擊 【Submit 提交】
![](https://storage.crisp.chat/users/helpdesk/website/e762d54d39a45800/87297f67-3e4d-495f-930e-8d3005_hx56x3.png)
小提示:以下是您官網 “登入頁面” 的截圖參考
![](https://storage.crisp.chat/users/helpdesk/website/74991ebb05065c00/57916614-97bb-45d2-8025-21ddee_b4itsb.png)
最後步驟,回到頁面最頂端,點擊 【Developing】 按鈕
![](https://storage.crisp.chat/users/helpdesk/website/9ca09c5484dfc000/3a0b5204-c4f2-4bb9-b61d-38243e_1so2fd5.png)
點擊 【Publish】, 發佈您的 LINE 登入管道就完成了
![](https://storage.crisp.chat/users/helpdesk/website/b91b797220387000/ffb6c712-4bfc-4067-8098-cceb6c_1vtxtid.png)
以下是當客戶使用 LINE 登入您後台的流程:
![](https://storage.crisp.chat/users/helpdesk/website/1f2de4cc97fbb500/144f3752-ce21-4db0-9881-962d81_19rihjc.gif)
2. LINE 登入加入好友功能
顧客在使用 LINE 登入之後,自動跳出 “加入好友” 功能,讓客戶加您的 LINE 官方帳號為好友。
設定步驟教學:
1.前往 LINE Developers ,點擊 “Console” 或者 “Log In” 按鈕。
⭐ 請登入與申辦官方帳號相同的 Email
![](https://storage.crisp.chat/users/helpdesk/website/dc61b114a929a000/3eae9976-53f0-4a3e-938a-cd71cb_9founp.png)
或
於 LINE 官方帳號後台 > Messaging API > 下方點選**【LINE Developers】**登入 LINE Developer 後台
![](https://storage.crisp.chat/users/helpdesk/website/3663a5dc1b212600/9070bfa6-2ada-4663-a8d6-fdd32a_1nkekc0.png)
選擇 Provider > 點選【Messaging API】的Channel
![](https://storage.crisp.chat/users/helpdesk/website/11a56ec72bd59d0/5e3cbd7f-01a8-45ed-b924-082f32_qo1kzw.png)
點擊**【Messaging API頁籤】**
![](https://storage.crisp.chat/users/helpdesk/website/5dc6b5e9d2eb1000/a1b53c57-4bf1-4f9d-8fd7-f782fb_7kum1q.png)
![](https://storage.crisp.chat/users/helpdesk/website/f69d35dbf3cf4800/4555e28d-01b2-49b8-bffc-6044d3_crdtdy.png)
滑至頁面最下方, 在Channel access token中,點擊 “Issue”。
![](https://storage.crisp.chat/users/helpdesk/website/d78e217e1bb0400/e51a934c-9558-4464-80a2-489f9a_13983yg.png)
您已經成功獲得 Channel access token ,點擊 “複製”。
![](https://storage.crisp.chat/users/helpdesk/website/a441de06b0248000/eba3f4b4-27d3-4f69-a9e8-b5127a_1xqwli0.png)
複製好之後,回到您的 EasyStore 後台 > 銷售管道 > LINE>設定>存取權杖>粘貼上複製好的文字>儲存。
![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_1paiyh3.png)
最後,前往 LINE Developer Console > LINE Login Channel > Basic Settings 界面 >尋找 Linked LINE Official Account 欄位>選擇您的官方帳號 > Update
![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/image_adkjhs.png)
設定完畢之後,客人在使用 LINE 登入時,會顯示以下“加入好友”按鈕,讓客戶可以馬上點擊按鈕,加您的LINE官方帳號
![](https://storage.crisp.chat/users/helpdesk/website/2fcb6780759b3200/99ba1221-d2aa-4301-9f27-c08108_eh55xa.png)
注意事項
因 LINE Developer 改版,若設定後未成功串接,請檢查 Webhook 有無開啟,如下圖:
![](https://storage.crisp.chat/users/helpdesk/website/b34797d9594d3000/frame-12_yb38f9.png)
顧客可以直接在 LINE 裡綁定官網帳號以接收訂單通知。你可參考這篇文章進行其餘設定: 【LINE】LINE 訂單通知
更新時間: 12/01/2024
感謝!