เค้าเอาไฟล์ MP4 บน Google Drive ไปแสดงใน Video Player บนเว็บได้อย่างไร

สมมุติว่า เรามีไฟล์วิดีโอเป็น .mp4 อยู่ไฟล์หนึ่ง อยู่ใน Google Drive ต้องการเผยแพร่ เฉพาะบน Website ของเราเท่านั้น จะต้องทำอย่างไร? Javascript video player สิ่งแรกที่ต้องมีคือ ตัว Video Player บนเว็บ ลอง Google ด้วยคำว่า “javascript video player” ดู มีหลายตัวให้เลือกใช้ แต่ในที่นี้ ขอทดลองกับ video.js (เว็บไซต์ https://videojs.com ) คลิกที่ USE NOW ( https://videojs.com/getting-started/ ) จากนั้น ลองสร้างไฟล์ test.html โดยเอา Code จาก Video.js CDN ไปแปะเลย จาก Code นี้ JavaScript จาะเรียกไฟล์ .MP4 จากไฟล์ชื่อ MY_VIDEO.mp4 ซึ่ง ถ้าเอา test.html นี้ไปวางบน Web Server ก็หมายความว่า เราต้องมีไฟล์ MY_VIDEO.mp4 ด้วย ไฟล์ MP4 บน Google Drive ตัวอย่างเช่น เราอาจอัดคลิปวิดีโอการสอน อยากจะเผยแพร่บนเว็บไซต์ของหน่วยงาน ผ่าน JavaScript Video Player อย่าง video.js ข้างต้น ก็สามารถทำได้ดังนี้ แชร์ไฟล์ดังกล่าว ให้เป็น Anyone with the link can View แล้ว copy link นั้นมา หน้าตาประมาณนี้ https://drive.google.com/open?id=FILE_ID จะเห็นคำว่า id= FILE_ID ตรงนี้ให้ Copy เก็บไว้ แต่การที่เราจะเอา Link นี้ไปใช้ใน Video Player ตรง ๆ ไม่ได้ เพราะมันเป็นการเรียกใช้ Google Drive ไม่ใช่การเรียก File Content GoogleAPI วิธีการที่จะ Get Content ของไฟล์ที่ต้องการออกมากจาก Google Drive สามารถเรียกผ่าน Google API ซึ่ง หากจะทำเองก็สามารถทำได้ มีพวก node.js ให้ใช้งานอยู่ แต่พบว่า สามารถเรียกใช้ www.googleapis.com ได้ โดยอ้างอิงจาก https://googleapis.github.io/ ในที่นี้ จะเรียกผ่าน Google Drive API ใน Version 3 รูปแบบ URL จะเป็นดังนี้ ในการใช้งาน ต้องการ 2 ส่วน FILE_ID ได้จากการแชร์ไฟล์ข้างต้น API_KEY ได้มาจากการสร้าง Credential บน Google Cloud Platform วิธีการทำตามนี้ https://cloud.google.com/docs/authentication/api-keys การใช้งาน Google API นั้น มีส่วนทั้งที่ต้องจ่ายเงิน และส่วนที่ใช้ฟรี แต่ถูกจำกัด Quota ในกรณี Google Drive API สามารถใช้ได้ฟรี แต่จะมี Quota อยู่ โดยดูได้จาก https://developers.google.com/drive/api/v3/about-sdk ประกอบร่าง เมื่อได้ FILE_ID และ API_KEY มาแล้ว ก็เอาไปใส่ใน Code ข้างต้น หวังว่าจะเป็นประโยชน์ครับ Disclaimer: จุดประสงค์ของบทความนี้ เพื่อแนะนำวิธีการทำเท่านั้น โปรดนำความรู้นี้ไปใช้งานอย่างสร้างสรรค์นะครับ ผู้เขียนบทความไม่เกี่ยวข้องใด ๆ กับผู้นำไปใช้ทั้งสิ้น

Read More »

แนวทางการพัฒนา Web Application ด้วย django จาก local docker สู่ Google Cloud Run

ในการพัฒนาแอพพลิเคชั่น เราก็จะเจอปัญหานึงเสมอ ๆ คือ เวอร์ชั่น (Version) ของเครื่องมือที่ใช้ในการพัฒนานั้น แต่ละโปรเจคมีความแตกต่างกัน เช่น ในกรณีของ การพัฒนา Web Application ด้วย django web framework เราอาจจะอยากใช้ python รุ่นล่าสุด คือ 3.8 แต่ในขณะเดียวกัน เมื่อหลังบ้านต้องการไปติดต่อ Tensorflow 2.0 ซึ่งยังต้องใช้งานกับ Python 3.6 เป็นต้น วิธีแก้ไขปัญหาทั่วไปคือ ติดตั้ง package ‘virtualenv’ เพื่อให้การพัฒนาแต่ละโปรเจค มี Environment แตกต่างกันได้ แต่จากการใช้งานจริง พบว่า สุดท้าย ตอนเอาไป Production บนเครื่อง Server ก็ต้องตามไปติดตั้งเครื่องมือ และรุ่นที่ถูกต้อง แม้ใน Python จะมีคำสั่ง pip install -r requirements.txt ก็ตาม แต่ก็ยังไปติดปัญหาว่า OS ของเครื่องที่จะ Production นั้น รองรับรุ่นของเครื่องมืออีกหรือไม่ด้วย แนวทางการใช้ Container ด้วย Docker จึงเป็นที่นิยม เพราะ เมื่อเราพัฒนาเสร็จแล้ว สามารถ Pack เข้าไปใน Container แล้วเอาไป Deploy ได้ โดย (แทบจะ) ไม่ต้องกังวลกับ Environment ปลายทาง อีกทั้ง ยังสามารถทดสอบ Environment ใหม่ ๆ ก่อนจะ Deploy ได้ด้วย เช่นการเปลี่ยนรุ่นของ Python เป็นต้น ในบทความนี้ จะนำเสนอ แนวทางการสร้าง docker container เพื่อใช้เป็นฐานในการพัฒนา django และ สามารถต่อยอด ติดตั้ง package อื่น ๆ ตามต้องการ ตั้งแต่ Development ไปจนถึง Deployment สู่ Serverless Environment อย่าง Google Cloud Run สร้าง Development Container เริ่มจาก สร้างโฟลเดอร์ใหม่ขึ้นมา ในนั้นมี 2 ไฟล์ คือ Dockerfile และ requirements.txt กับ โฟลเดอร์ ชื่อ code Dockerfile ใช้ image ของ python เป็นรุ่น 3.7-slim ซึ่งตัดส่วนที่ไม่จำเป็นออกแล้ว (ไม่ใช้ alpine เนื่องจาก พบรายงานว่า แม้จะมีขนาดเล็กกว่า แต่ถูกจำกัดทรัพยากรบางอย่าง ทำให้ทำงานได้ช้ากว่า) สร้าง /code แล้วเข้าไปใช้พื้นที่นี้ (เหมือนคำสั่ง mkdir /code ; cd /code อะไรประมาณนั้น) สั่งให้ copy ไฟล์ requirements.txt ไปใช้ที่ root ( / ) จากนั้น Upgrade คำสั่ง pip เป็นรุ่นล่าสุด แล้ว ติดตั้ง package ตามที่กำหนดใน requirements.txt เปิด Port 8080 ไว้ เพื่อใช้ในการทดสอบ และเป็นไปในแนวทางเดียวกับการใช้บน Google Cloud Run ต่อไป requirements.txt ในการพัฒนา django เมื่อทำการติดตั้ง package ใดเพิ่มเติมด้วยคำสั่ง pip install ก็จะบันทึกรายการ พร้อมรุ่นของ package มาในไฟล์นี้ ในที่นี้ ใช้

Read More »

วิธีการระบบการจองตั๋ว (Ticket Reservation System ) alf.io

ALF.io เป็น Open Source Ticket Reservation System แบบ Web Application ผู้ดูแลระบบสามารถสร้าง Event อย่างเช่นงานประชุมสัมนา เมื่อเปิดรับลงทะเบียนเข้าร่วมงานได้ (แบบเก็บเงินหรือฟรีก็ได้) กำหนดจำนวนที่นั่งได้ ผู้เข้าร่วมงานกรอกข้อมูลส่วนตัว (และชำระเงินก็ได้) ระบบจะส่ง Ticket ไปให้ทาง Email ในรูปแบบ QR Code เมื่อถึงวันงาน เจ้าหน้าที่ที่หน้างานติดตั้ง Application บน Smartphone ของตนเอง (ซึ่งต้องลงทะเบียนกับระบบ) ผู้เข้าร่วมงานแสดง QR ของตนเองให้เจ้าหน้าที่ Scan ได้เลย วิธีการติดตั้ง ต่อไปนี้ เป็นวิธีการติดตั้ง alf.io รุ่น 2.0-M1-1909 บน Windows 10 Education และ Windows Server 2016 Prerequisite Java JDK เนื่องจาก alf.io พัฒนาด้วย Java รุ่น 12 จึงแนะนำให้ติดตั้ง Oracle JAVA SE รุ่นล่าสุด (ปัจจุบันคือ Java SE 13) โดยสามารถ download จาก Link นี้ https://www.oracle.com/technetwork/java/javase/downloads/index.html Database Serverสำหรับ Database แนะนำให้ใช้ Postgresql (ปัจจุบัน รุ่นล่าสุดคือ รุ่น 11) จากนั้น– สร้าง Database ชื่อ alfio– User ชื่อ alfio ให้สามารถสิทธิ์ CREATE ได้ โดยสามารถ Download จาก Link นี้ https://www.postgresql.org/download/windows/ ขั้นตอนการติดตั้ง สร้าง Folderเช่น C:\alfio เป็นต้น Download alf.ioจาก https://github.com/alfio-event/alf.io/releases/tag/2.0-M1-1909 เลือกไฟล์ชื่อ alfio-2.0-M1-1909-boot.war เก็บไว้ใน Folder ที่สร้างขึ้น (ในที่นี้ C:\alfio) สร้างไฟล์ Configurationสร้างไฟล์ชื่อ application.properties เพื่อกำหนดค่าเกี่ยวกับ Database ได้แก่ Host, Database, User, Password และอื่น ดังตัวอย่าง (อย่าลืมเปลี่ยน Password ให้ตรงกับที่ตั้งไว้) Run ! ด้วยคำสั่ง หน้า Event http://localhost:8080/ หน้า Admin http://localhost:8080/admin ตัวอย่างการใช้งาน https://ticket.psu.ac.th/event/KPC2019/ เมื่อ Admin ของงาน (แต่ละ Server มีได้หลาย Event) สร้าง Ticket ให้ หรือ ผู้สนใจเข้าร่วมงาน เข้ามาสมัครร่วมงานเองก็ได้ จะได้ Email แจ้งดังนี้ ซึ่งจะมี QR Code แนบมา (ที่เห็นเป็น # เพราะยังไม่ได้ใส่ Font ภาษาไทยในการ Generate PDF ให้ถูกต้อง — ไว้ค่อยเล่าให้ฟัง) เมื่อถึงวันงาน เจ้าหน้าที่รับลงทะเบียน จะติดตั้ง Application ลงใน Smartphone ของตนเอง แล้วมีการสร้าง Account เพื่อรับ Check-in (ค่อยมาลงรายละเอียด) ก็สามารถคลิกที่ Scan Attendees QR Code ของผู้มาลงทะเบียนเข้างานได้เลย หวังว่าจะเป็นประโยชน์ครับ

Read More »

TOTP Second-factor Auth and OAuth2 in ownCloud 10.2.1

คิดว่าเรื่อง security หรือ ความปลอดภัย ในการใช้ username และ password ก็เป็นความรู้ที่น่าจะได้มาเล่าสู่กันฟัง ในครั้งนี้ผมได้ลองตั้งค่าการใช้ TOTP Second-factor Auth ร่วมกับ password ของ ownCloud ในหน้า login ที่ web page การใช้ TOTP Second-factor Auth ร่วมกับ password ก็คือ การที่แอดมินที่ดูแล ownCloud Server ได้เพิ่ม App ชื่อ 2-Factor Authentication ไว้เพื่อให้ user ได้เลือกเองว่าจะใช้งานหรือไม่ โดยแสดงเป็น option อยู่ในหน้า settings ของ user ข้างล่างนี้เป็น captured รูปภาพที่แอดมินเพิ่ม App TOTP Second-factor Auth โดยติดตั้งจาก Market ส่วนข้างล่างนี้เป็น captured รูปภาพเมื่อ user เลือกใช้ TOTP และ เข้าใช้งานผ่านเบราว์เซอร์ โดยใส่ TOTP ที่ได้จาก App บนมือถือ เช่น Google Authentication หรือ Microsoft Authentication เป็นต้น นอกจากนี้เราสามารถตั้งค่า App passwords สำหรับ ownCloud Desktop Client ดังรูป ส่วนข้างล่างนี้เป็น captured รูปภาพ ownCloud Desktop Client หากมีการตั้ง App passwords แต่ถ้าแอดมินเลือกติดตั้ง OAuth2 ก็จะทำให้การใช้งานทั้ง desktop client และ app บน smart phone นั้นมีความปลอดภัยมากขึ้น สะดวกมากขึ้น เพราะว่าจะเป็นการส่ง token ไปเก็บไว้แทนการเก็บ username และ password ไว้ใน app ข้างล่างนี้เป็น captured รูปภาพที่แอดมินเพิ่ม App OAuth2 ในครั้งแรกที่เข้าใช้ Desktop Client หรือ App จะมีหน้าเว็บเพจเด้งขึ้นมาให้ใส่ username กับ password เพียงครั้งเดียว และขอให้ผู้ใช้คลิก Authorize จากนั้นก็ใช้งานได้ตลอดแล้ว รูปแสดงว่า เรามีการเข้าใช้อุปกรณ์อะไรบ้าง ดังนั้น หากใช้ OAuth2 ก็ไม่จำเป็นต้องใช้ TOTP Second-factor Auth แล้วครับ สภาพแวดล้อมการทำงาน ownCloud Server (ownCloud community) version 10.2.1 (stable) ติดตั้งบน Ubuntu 16.04 server และ ownCloud Desktop client version 2.5.4 (build 11415) รันบน Windows 10 version 1903

Read More »