DEV Community 👩‍💻👨‍💻

Cover image for วิธีการติดตั้ง Cloudflare Argo Tunnel ใน Home Assistant
Pattanapong Cherthong
Pattanapong Cherthong

Posted on • Updated on

วิธีการติดตั้ง Cloudflare Argo Tunnel ใน Home Assistant

สวัสดีครับ บทความนี้จะมาแนะนำวิธีการใช้งาน Cloudflare Argo Tunnel ใน Home Assistant ครับ
ขออธิบายก่อนครับ โดยทั่วไปแล้วถ้าเราจะตั้ง server จากที่บ้านหรือสำนักงานและสามารถเข้าถึงได้จากอินเตอร์เน็ตจะต้องเข้าถึงด้วย Public IP แต่ปัจจุบันผู้ให้บริการอินเตอร์เน็ต (ISP) จะไม่ได้แจก Public IP ให้กับผู้ใช้บริการทั่วไปแล้ว ส่วนมากจะได้เป็น private ip ที่อยู่หลัง NAT อีกที แต่อาจทดแทน ด้วยการเปิด port ให้เข้าถึงผ่านทาง ddns ของ ISP แต่ก็ไม่สามารถใช้งาน web server ผ่านทาง port ปกติอย่างเช่น 80 และ 443 ได้

สำหรับ Home Assistant โดยปกติแล้วถ้าเข้าถึงใน local network ก็จะต้องใช้งานผ่าน port 8123 ใช่ไหมหละครับ แต่ถ้าจะเข้าถึงได้ทางอินเตอร์เน็ตและ
ถ้าต้องการเข้าถึงโดย link ที่เป็น https อาจจะต้องใช้ reverse proxy เข้ามาช่วยเพื่อที่จะเข้าใช้งานใน https ใน port 443 อีกทั้งยังต้องมี SSL Certificate ที่อาจจะต้องเช่าไว้รายปี หรือจะใช้ Let's Encrypt ที่เป็น Free SSL ผูกเข้าไปด้วย
แต่มีอีกหนึ่งตัวเลือกที่สะดวกมากๆไม่ต้องทำอะไรมากก็คือใช้งานผ่าน Cloudflare Argo Tunnel เป็นการเชื่อมต่อ tunnel ไปยัง server ของ cloudflare ตรงๆโดยไม่ต้องใช้ Public IP ซึ่งถ้าหากใครเคยใช้งาน ngrok.com ก็คือมีจะมีหลักการคล้ายๆกันนี่แหละครับ และที่สำคัญคือ Cloudflare Argo Tunnel ตอนนี้เปิดให้ใช้งานได้ฟรี

สิ่งสำคัญที่จะต้องมีก่อนใช้งาน Cloudflare Argo Tunnel ก็คือจะต้องมี domain name ที่ผูกกับ cloudflare ไว้แล้ว ซึ่งถ้าหากใครยังไม่มีจะต้องจด domain name กับผู้ให้บริการต่างๆแล้วมาผูกกับ cloudflare ก่อนครับ

เริ่มจากเราจะต้อง setup tunnel ในคอมพิวเตอร์ก่อน เพื่อที่จะเอา config ต่างๆไปตั้งค่าใน Home Assistant อีกที
ขั้นตอนแรกให้ติดตั้ง cloudflared Link นี้
มีให้ใช้งานทั้งใน Windows, Mac และ Linux ส่วนการใช้งาน cloudflared จะเป็นการใช้งานใน Terminal หรือถ้าใน Windows ก็จะเรียกใช้ได้ใน PowerShell หรือ CMD ก็ได้

ทำการ login cloudflare ด้วยคำสั่ง

cloudflared tunnel login
Enter fullscreen mode Exit fullscreen mode

Alt Text
จะเด้งเข้า Browser ให้เพื่อเรา Login cloudflare
หรือถ้าไม่เด้งเข้า Browser อัตโนมัติ ก็อาจจะต้องก๊อป Link ไปเปิด browser เองนะครับ
Alt Text

หลังจากนั้นให้เลือกโดเมนเนมที่เราต้องการผูกกับ Tunnel

Alt Text

กดปุ่ม Authorize เป็นอันเสร็จขั้นตอน Login

หลังจากนั้นสร้าง tunnel ด้วยคำสั่ง

cloudflared tunnel create <NAME>

//แทนที่ <NAME> ด้วยชื่อ tunnel ที่ต้องการ

Enter fullscreen mode Exit fullscreen mode

หลังจากที่สร้าง tunnel แล้วก็จะได้ไฟล์ {UUID}.json ถูกสร้างขึ้นมา

สำหรับ Mac หรือ Linux จะอยู่ใน path นี้ครับ

~/.cloudflared/{UUID}.json 
Enter fullscreen mode Exit fullscreen mode

สำหรับใน Windows จะอยู่ใน path นี้ครับ

C:\Users\xxxx\.cloudflared\{UUID}.json
Enter fullscreen mode Exit fullscreen mode

ใช้คำสั่ง cloudflared tunnel list เพื่อดู tunnel ที่ได้สร้างไว้
Alt Text

หลังจากท่ีสร้าง tunnel แล้วเราจะได้ Link ของ tunnel ภายใต้ subdomain
TUNNELID.cfargotunnel.com
(แทนที่ TUNNELID ด้วย UUID ของเรา)

ต่อไปคือตั้งค่า DNS record (มี 2 วิธี)

วิธีที่ 1

  1. เข้าไปตั้งค่า DNS ในเว็บ Cloudflare
  2. สร้าง CNAME record และใส่ Link tunnel เข้าไปใน Target พร้อมด้วย subdomain ที่ต้องการในช่อง Name
  3. กด Save เป็นอันเสร็จ

Alt Text

วิธีที่ 2
ตั้งค่า DNS ด้วยคำสั่ง

cloudflared tunnel route dns <UUID or NAME> sub.domain.com

//แทนที่ <UUID or NAME> ด้วย tunnel id หรือ ชื่อ tunnel 
//แทนที่ sub.domain.com ด้วย domain name ที่ต้องการ

Enter fullscreen mode Exit fullscreen mode

ขั้นตอนต่อไป ให้เข้ามายัง Home Assistant > Supervisor > Add-on Store

Supervisor-Home-Assistant

เพิ่ม repository นี้เข้าไป

https://github.com/PanJ/hassio-addons
Enter fullscreen mode Exit fullscreen mode

จะมี Cloudflare Argo Tunnel ขึ้นมาให้ติดตั้ง
Supervisor-Home-Assistant (2)

Supervisor-Home-Assistant (4)

หลังจากติดตั้ง add-on แล้วให้สร้างไฟล์ config.yml

tunnel: { UUID }
credentials-file: /etc/cloudflared/credentials.json
ingress:
  - hostname: { hostname }
    service: http://127.0.0.1:8123
  - service: http_status:404
Enter fullscreen mode Exit fullscreen mode

แทนที่ { UUID } ด้วย tunnel id
แทนที่ { hostname } ด้วย domain name ที่ผูกไว้กับ cloudflare

ตัวอย่างไฟล์ config.yml

tunnel: 139b5cc8-de94-48ae-99e5-xxxxxxxxxxxx
credentials-file: /etc/cloudflared/credentials.json
ingress:
  - hostname: home.teamteam.cloud
    service: http://127.0.0.1:8123
  - service: http_status:404
Enter fullscreen mode Exit fullscreen mode

สุดท้ายท้ายสุดทำการตั้งค่าใน Add-on Cloudflare Argo Tunnel

  1. convert config.yml ให้เป็น base64 ด้วยคำสั่ง (สำหรับ Mac หรือ Linux)
cat config.yml | base64
Enter fullscreen mode Exit fullscreen mode

แต่สำหรับ Windows อาจจะต้องไปใช้เว็บ www.base64encode.org ในการ convert ให้เป็น base64

2.ให้ copy ข้อมูลข้างในไฟล์ {UUID}.json และ base64 string ในข้อ 1 ไปใส่ใน Configuration

Supervisor-Home-Assistant (5)

3.ตั้งแต่ Home Assistant เวอร์ชั่น 2021.07 เป็นต้นไป จะต้องเข้าไปเพิ่ม http config ใน configuratio12n.yaml ด้วยครับ

http:
  use_x_forwarded_for: true
  trusted_proxies:
   - 127.0.0.1
Enter fullscreen mode Exit fullscreen mode

อาจจะเข้าใจยากหน่อย จะต้องมีความเข้าใจพื้นฐานเรื่องระบบ Network ด้วยครับ
ค่าที่จะเป็นต้องใส่ก็คือ use_x_forwarded_for และ trusted_proxies
ใน trusted_proxies ให้ใส่ ip address ฝั่งที่เป็น gateway ที่ทำให้เราเข้า Home Assistant จาก Internet ได้

อย่างในที่นี้คือ เราใช้ add-on cloudflare tunnel ซึ่งทำงานอยู่ใน Home Assistant ซึ่งแน่นอน ในทาง Network มันคือ localhost หรือ 127.0.0.1 ใน trusted_proxies ก็จะต้องใส่ 127.0.0.1 หรือ ::1 ก็ได้ หรือถ้าใครทำ forward port ไว้จาก ฑouter ก็เอา ip ของ Router มาใส่เพิ่มได้

เสร็จแล้ว ให้กด start ที่ Add-on Cloudflare Argo Tunnel เพียงเท่านี้เราจะสามารถเข้าถึง Home Assistant ของเราได้จากข้างนอกผ่านทางโดเมนที่เราผูกไว้กับ cloudflare อีกทั้งเรายังได้ SSL ฟรีๆจาก cloudflare อีกด้วย สามารถเข้าเว็บด้วย https ได้ทันที สามารถนำไปเชื่อมต่อกับ Google Assistent ได้เลย โดยไม่ต้องพึ่ง Nabu Casa Cloud

Screen Shot 2564-04-25 at 03.32.17

Top comments (3)

Collapse
 
ajbk profile image
ajbk

ไม่สามารถลง Add on บน HASS ได้ครับ
Failed to install add-on
The command '/bin/sh -c apk add --no-cache git gcc build-base alpine-sdk; go get -v github.com/cloudflare/cloudflared/cmd/cloudflared' returned a non-zero code: 1

Collapse
 
sunphet profile image
sunphet

ขอสอบถามครับ ระบบนี้จะสามารถใช้กัน net ของ ais ได้เลยใช้มั้ยครับ ตอนนี้ใข้ผ่าน thddns อยู่

Collapse
 
teampat profile image
Pattanapong Cherthong Author

ใช้กับเน็ตได้ทุกเจ้าเลยครับ

🌚 Friends don't let friends browse without dark mode.

Sorry, it's true.