in Computer, Diary

1st customized Node-RED คือตัว Downloader

ต่อจากบทความก่อนหน้าที่พูดถึงการสร้าง Node ในโปรแกรม Node-RED ขึ้นมาใช้งานเอง ตอนนี้ได้เขียนขึ้นมาชิ้นแรกที่เปิดเป็น public บน GitHub แล้วฮะ คือตัวดาวน์โหลดไฟล์

ปกติแล้วเวลาที่เราจะดาวน์โหลดไฟล์อะไรก็ตามเราก็กดเปิด URL แล้วปล่อยให้เว็บเบราวเซอร์มันทำงานเองใช่ไหมครับ แล้วถ้าเป็น Node-RED เราจะใช้งานอย่างไร อันนี้เป็นตัวอย่างนึงของการสร้าง Node ขึ้นมาใช้เอง แล้วเราจะเขียนอย่างไรล่ะ

สำหรับคนที่ไม่อยากเขียนเอง ไปดาวน์โหลดไฟล์ได้ใน Github ของผมนะครับ

ถ้าเราอ่านโพสก่อนหน้าแล้ว จะพบว่าตัว Node ที่สร้างขึ้นมามีสามส่วนได้แก่ตัวไฟล์ package.json ที่กำหนดลักษณะของแพคเกจที่เราสร้างขึ้น สองคือไฟล์ JavaScript ที่กำหนดถึงการทำงานของ Node ส่วนที่สามเป็นไฟล์ HTML ซึ่งมีสองส่วนย่อยได้แก่ก็เป็นไฟล์ JavaScript ที่ตั้งค่าตัว Node ที่เราสร้างขึ้น และโค้ด HTML ที่กำหนดหน้าตาของตัว Node ที่เราสร้างขึ้น เรามาพูดถึงส่วนแรกก่อนก็คือตัวไฟล์ JavaScript

Package.json

ไฟล์ package.json เป็นไฟล์ที่กำหนดลักษณะแพคเกจของ Node ที่เราสร้างขึ้น เรากำหนดได้ตามโพสก่อนหน้านั้นเลย แต่ตามตัวอย่างนี้เราเขียนไปว่า

ตัวอย่าง package.json

JavaScript

ไฟล์ JavaScript ที่เราสร้างขึ้นจะกำหนดการทำงานของ Node-RED ซึ่งกรณีที่เราต้องการสร้างตัวดาวน์โหลดไฟล์ขึ้นมา เราจำเป็นต้องนำเข้าแพคเกจ http, https และ fs โดยแพคเกจ http, https ใช้เวลาเชื่อมต่อเข้ากับเซิร์ฟเวอร์ที่ไม่ได้เข้ารหัส กับเข้ารหัส และแพคเกจ fs เป็นแพคเกจที่มีหน้าที่จัดการกับตัวไฟล์ โดยเวลาดาวน์โหลดไฟล์ เราจะสร้างไฟล์ที่เก็บข้่อมูลที่เราดาวน์โหลดขึ้น ขั้นตอนแรก เรานำเข้าโดยพิมพ์คำสั่ง

นำเข้าแพคเกจ

เมื่อนำเข้าเสร็จแล้ว เรากำหนดการทำงานของตัว Node ที่เราสร้างขึ้นมา โดยเราสั่งคำสั่งให้สร้าง Node ขึ้น และตั้ง Event เวลาที่มีข้อมูลเข้ามาในตัวโหลดใน Event input ตามด้านล่างนี้

เขียนไฟล์ JavaScript ให้สร้าง Node ขึ้น รวมถึงสร้างฟังก์ชันเพื่อทำงานเวลาที่มีข้อมูลเข้ามาใน Node

ต่อมา เราพิมพ์คำสั่งในฟังก์ชันที่รันขึ้นเวลาที่มีข้อมูลเข้ามาใน node.on(‘input’, เพื่อให้ดาวน์โหลด โดยรับข้อมูลจาก msg.payload เพื่อรับข้อมูล URL ที่ต้องการ, ชื่อไฟล์ที่เราต้องการเก็บข้อมูล โดยพิมพ์เพิ่มขึ้นเข้าไปตามภาพ (แต่เราจะพิมพ์แบบอื่นก็ได้นะ)

เพิ่มส่วนที่รับข้อมูลจาก Node ก่อนหน้าผ่าน msg.payload

เมื่อรับข้อมูลแล้ว เราจะสั่งให้ดาวน์โหลดไฟล์ เราจะสร้างเป็นฟังก์ชันสำหรับดาวน์โหลดไฟล์ก็ได้ หรือจะพิมพ์ลงไปในฟังก์ชัน node.on(‘input’ ก็ได้เช่นกัน แต่ของเราสร้างฟังก์ชันแยก เพื่อให้อ่านง่ายขึ้น โดยกำหนด fs.createwritestream ก่อนเพื่อบอกว่าเราจะเขียนไฟล์แล้วนะ จากนั้นสร้างตัวแปลที่เป็นชนิด URL เพื่อแบ่งว่าเป็น http หรือ https ผ่าน ตัวแปรชนิด URL.protocol แล้ว เราจะสั่งให้ตัว Node ดาวน์โหลดผ่านคำสั่ง get

พิมพ์คำสั่งให้ดาวน์โหลดไฟล์ในขั้นตอนแรกก่อน ที่มามาจากเว็บ Stackoverflow นี้ครับ

เมื่อพิมพ์ไปตามภาพแล้ว จากนั้น เราต้องการเขียนไฟล์ที่ดาวน์โหลดได้ลงในไฟล์ที่เราสร้างขึ้น ทำได้โดยใช้ตัวแปร response ให้สั่งคำสั่ง pipe ให้เขียนลงไปเป็นไฟล์ที่เราต้องการตามภาพ

เขียนไฟล์ลงในไฟล์ผ่าน response.pipe

เมื่อทำเสร็จแล้ว เรามาพิมพ์คำสั่งเพิ่มเติมในฟังก์ชัน node.on(‘input‘ เพื่อเรียกใช้คำสั่งเพื่อดาวน์โหลดไฟล์ด้วยตามภาพ

เขียนคำสั่งเพื่อเรียกใช้ฟังก์ชัน download

เมื่อเขียนเสร็จเรียบร้อย เซฟไฟล์ให้อยู่ในโฟลเดอร์ download ที่ชื่อว่า download.js

ไฟล์ HTML

ขั้นตอนต่อไป เราจะมาเขียนในไฟล์ HTML ต่อ ซึ่งในไฟล์นี้จะกำหนดหน้าตาของการตั้งค่า Node รวมถึงตั้งค่าเริ่มต้นภายในตัว Node เอง เราสามารถสร้างไฟล์เป็น Node โล่ง ๆ แบบไม่มีอะไรเลยก็ได้ เพราะยังไงเราก็สั่งโดย Node ตัวอื่นมาก่อนหน้านั้นแล้วนะแหละ ในไฟล์นี้แบ่งเป็นสองส่วนได้แก่โค้ด JavaScript และโค้ด HTML

ส่วนแรกจะเป็นส่วน JavaScript ที่กำหนด Node ที่เราสร้างขึ้นว่ามีลักษณะอย่างไร และกำหนดค่าเริ่มต้นของ Node ซึ่งเราไม่ต้องมีก็ได้ แต่เราจะกำหนดค่าเริ่มต้นเฉพาะชื่อของ Node เองเพื่อให้คนจำได้ง่าย

ไฟล์ JavaScript ที่กำหนดตัว Node และกำหนดค่าเริ่มต้น

เมื่อกำหนดค่าเริ่มต้นอะไรเสร็จแล้ว จากนั้นเราเขียนโค้ด HTML เพื่อกำหนดลักษณะหน้าตาของการตั้งค่า และพิมพ์ข้อความอธิบาย Node ที่เราสร้างขึ้นให้คนเข้าใจ

ตัวอย่างการเขียนโค้ด HTML

เมื่อเขียนเสร็จแล้ว บันทึกไฟล์ downloader.html ลงในโพลเดอร์เดียวกันกับ JavaScript

การติดตั้งแพคเกจ

การติดตั้งแพคเกจทำได้สองวิธี หนึ่งคือพิมพ์คำสั่ง npm install ตรง ๆ ไปเลย หรืออีกวิธีหนึ่งคือทำเป็นไฟล์ .tgz เพื่อนำเข้าผ่านโปรแกรม Node-RED เราจะมาพูดถึงวิธีที่สอง เทคนิคนี้ทำได้โดยพิมพ์

การ pack ไฟล์ให้อยู่ในรูปไฟล์ tgz

จากนั้นเปิด Node-RED แล้วนำเข้าแพคเกจโดยเลือกไปที่ Manage Palette แล้วเลือกแท็บ install กับเลือกไฟล์ที่เรา pack ไว้ จากนั้นโปรแกรมจะอัพโหลดไฟล์เพื่อติดตั้งแพคเกจให้

การใช้งานแพคเกจนี้

เราสั่งให้มันทำงานผ่านการส่งข้อมูลเป็นตัวแปร msg.payload ในรูปแบบ JSON โดยพิมพ์ตามภาพ

ตัวอย่างการพิมพ์คำสั่ง

เมื่อพิมพ์ไปแล้ว กด Deploy แล้วเริ่มการทำงานได้เลย เราจะพบว่าตัวโปรแกรมจะดาวน์โหลดให้ แต่มันไม่ได้แจ้งเตือนอะไร เราสามารถเพิ่มคำสั่งให้แสดงผลโดยใช้ node.status ได้เลย