Month: May 2019

เบื้องหลัง music48voter.com

by

เว็บ music48voter.com เป็นเว็บลูกของ music48project.com สร้างเพิ่มเติมขึ้นมาเพื่อเป็นช่วยในการรวบรวมคะแนนเพื่อวัดผลในการดำเนินกิจกรรมของกลุ่มแฟนคลับ Music BNK48 ต่อไป

ตัวระบบก็ปั่น “backend กึ่ง front-end” ช่วงปีใหม่ 3-4 วัน แม้ว่าจะทำเก็บมาเรื่อย ๆ แต่ว่ามันแค่โครง ๆ เป็นไอเดียในระดับ user management แล้วลองของเรื่อง .NET Core อีกหนึ่งตัว (มีอีกหลายตัวที่กำลังคิดว่าจะย้ายมาใช้ เพราะมันมีอนาคตกว่า) โดยจากการทำโครงการเล็ก ๆ ตัวนี้ เจ้า .NET Core ตั้งแต่ 2.x มาเป็นต้นมา มันเขียนสะดวก และง่ายขึ้นมาก ความสามารถต่าง ๆ ตาม .NET Framework เกือบทันแล้ว (บางจุดก็ใช้แรงหน่อย แต่รวม ๆ ก็พอไหว) เลยใช้แทน PHP ที่หลัง ๆ ยุ่งกับมันน้อยลงเยอะ

ตัวเว็บนี้ใช้ .NET Core version 2.1 ใช้ร่วมกับฐานข้อมูล MySQL version 5.7 ซึ่งตัวเดิม ๆ ที่ new project มามันไม่รองรับหรอก แต่เราใช้ Class provider อย่าง Pomelo MySql ที่เป็น Class provider ที่ on top บน Entity Framework Core มาทำงานแทน ทำให้ไม่ต้องเขียนคำสั่ง SQL จริง ๆ แต่ทำผ่าน LINQ และ ORM แทนซึ่งจบในตัว

สำหรับ background woker ใช้ Hangfire ตัว Free ก็เพียงพอ สำหรับใช้พวกส่งอีเมล เพื่อจัดคิวในการส่ง และแก้ปัญหาเรื่อง blocking UI คือกดแล้วรู้เลยว่าสมัครแล้ว ส่วนส่งอีเมลยืนยันการสมัครที่เราไปต่อ 3rd party SMTP ภายนอกที่มักทำงานช้า ในระดับหลักเกือบวินาที มันทำให้ฝั่งเว็บค้างไปแป็บนึงมาช่วยให้มันไม่ต้องรอจุดนั้น แถมยังลดปัญหา waiting ที่ thread ช่วงส่งเมล ส่วนในหน้า Ranking ตัว report เนี่ย มันใช้พลังในการ summary เยอะ ก็ใช้ schedule woker ที่อยู่ในตัว Hangfire อยู่แล้วทำ ให้มันทำงานทุก ๆ 5 – 10 นาทีเพื่อสร้างข้อมูลใหม่ใน report table แทน แล้วเวลาแสดงผลก็ให้มาดึงที่ตัวนี้แทน การแสดงผลตารางดังกล่าวจะได้ไม่หนักฐานข้อมูล

ในส่วนของ Front-end Lib ก็ใช้ Bootstrap 4 เอาง่าย ๆ โดยจะมึนหัวนิดนึงตอน upgrade มาใช้ เพราะตัว default ของ .NET Core 2.1 คือ Bootstrap 3 ก็เลยต้องใช้ bower มาช่วยในการจัดการตรงนี้ แก้ default style ที่มันค้างใน Framework อยู่เยอะพอสมควร แต่แลกกับการทำงานดีง่ายกว่ามาก สำหรับทีมออกแบบหน้าเว็บ ที่เป็นอีกทีมหนึ่ง ที่เค้าใช้ Bootstrap 4 เข้ามาช่วยกันแก้ไข และตบแต่งเพิ่มเติมให้ออกมาสวยงามขึ้นอีก ทั้ง layout และ stylesheet ถ้าใครติดตามตัวเว็บช่วงนั้นจะเห็นว่าเราปรับปรุงตลอดเวลา ยิ่งช่วงวันท้าย ๆ เรามีการปรับโทนสีของเว็บใหม่ทั้งหมด เพื่อให้เข้ากับแนวทางการทำกิจกรรมช่วงสุดท้าย

ตัว Binary ตอน deploy ขึ้นทำงานบน CentOS 7 ทั้งฝั่ง App และ Database โดยตัว App วิ่งผ่าน HAProxy ที่ทำหน้าที่ reverse proxy อีกที (เป็น best practice ที่ควรทำ เพื่อสำหรับ HA และทำ hot deploy ได้)

สำหรับขั้นตอนการตรวจสอบโค้ดโหวตในฝั่งแอปก็ไปแกะเอามาจาก javascript ของฝั่งเว็บโหวตเพื่อเอามาตรวจสอบอีกรอบก่อนเอาลงฐานข้อมูลเพื่อลดงานหลักบ้าน ส่วนงานตรวจสอบอีกชั้นว่าโหวต หรือไม่ก ็ทำระบบหลังบ้านให้ทีมงานมาตรวจสอบจาก screen recorder อีกที ซึ่งยุ่งยากหน่อย แต่มันเป็นทางเดียว เพราะจะให้แฟนคลับแต่ละคนมากรอก username และ password เพื่อให้เราไปดึง token ผ่าน OAuth2 แล้วเอาไปดึงข้อมูลจาก API ออกจากเว็บโหวตโดยตรงคงมีไม่กี่คนจะมาใช้

สำหรับตัวเนื้อหาจะมีทีมงานอีกทีมลงมาช่วยกันหลายสิบคน เพื่อคอยค้นหากิจกรรมของแฟนคลับมาลงในหน้า Activity เพื่อเป็นจุดรวมข้อมูล และรวมถึงหน้าข้อมูล-รายละเอียดที่เป็นภาษาญี่ปุ่นที่มีการเพิ่มเติมเข้ามาในช่วงหลัก เพื่อช่วยให้แฟนคลับที่เป็นคนญี่ปุ่นได้เข้าร่วมทำกิจกรรมได้

มีเรื่องฮา ๆ และตื่นเต้นคือ ตอนเปิดให้สมัครวันแรก คนเข้ามาเว็บค่อนข้างเยอะมาก หลักพันกว่าคน แล้วตอนนั้นหน้าลงทะเบียนดันมี bug เกิดขึ้น เลยต้อง hot deploy ใหม่ในช่วงนั้นไป ทำเอาคนสมัครตอนนั้นบ่นกัน timeline ไหม้เลย (ToT)/~~~

แล้วระหว่างการเปิดให้ใช้งานก็มีปัญหาอยู่เรื่อย ๆ เพราะระบบจัดการเว็บบางจุดก็มี bug อยู่ แต่ด้วยความที่งานส่วนตัวก็มี ทำให้บางจุดก็ไม่ได้แก้ หรือแก้ข้อมูลโดยตรงผ่านตัวจัดการฐานข้อมูลตรง ๆ ไปแทน ส่วนหลัก ๆ ที่เจอเยอะ คือลงทะเบียนแล้วไม่ได้ยืนยันการลงทะเบียนที่อยู่ในอีเมลที่ส่งไปยังอีเมลตอนสมัคร ทำให้เข้าใช้งานไม่ได้ ซึ่งเหตุผลที่ต้องยืนยันอีเมลด้วย เพราะต้องใช้เพื่อเป็นช่องทางติดต่อที่ต้องใช้งานได้จริง เพื่อรับของตอนกิจกรรมสิ้นสุดลง เลยจำเป็นต้องมีขั้นตอนนี้

อันนี้บันทึกเท่าที่คิดออก ณ ตอนนี้ ไม่รู้ตกหล่นอะไรไหมนะ ԅ(¯﹃¯ԅ)

ความสามารถอะไรบ้างใน Windows 10 May 2019 Update (version 1903) ที่ถูกตัดออก หยุดทำงาน หรือหยุดพัฒนา

by

เมื่อไม่กี่วันก่อน Microsoft ปล่อย Windows 10 May 2019 Update (version 1903) ออกมาให้อัพเดทกัน สำหรับความสามารถใหม่ ๆ คงไม่ต้องพูดถึงกันมากนัก แต่ก็มีหลาย ๆ ความสามารถที่ถูกตัดออก หยุดทำงาน หรือหยุดพัฒนาไปเช่นกัน เรามาดูกันว่ามีอะไรบ้าง

  • Windows 2000 Display Driver Model (XDDM) หรือ XDDM-based remote display driver บน Remote Desktop Services จะถูกนำออกไปในอนาคต และแนะนำให้ย้ายมาใช้งาน Windows Display Driver Model (WDDM) แทน
  • แอป messaging บน Windows จะไม่สามารถ sync ข้อความ SMS กับ Windows Mobile ได้อีกต่อไป
  • Taskbar settings roaming จะไม่มีการพัฒนาต่อ และในอนาคตจะปิดการทำงานส่วนนี้
  • การเชื่อมต่อกับ Wi-Fi ที่ใช้การเข้ารหัสแบบ WEP หรือ TKIP ซึ่งเป็นการเชื่อมต่อที่ไม่ปลอดภัย จะมีข้อความแจ้งเตือนเพื่อแนะนำให้ใช้ WPA2 หรือ WPA3 และในอนาคตการเชื่อตม่อด้วยเทคโนโลยีที่ไม่ปลอดภัยนี้ จะถูกปิดในอนาคต
  • Windows To Go จะไม่ได้รับการพัฒนาต่อ
  • แอป Print 3D จะไม่มีการพัฒนาต่อ และถูกแทนที่ด้วยแอป 3D Builder แทนโดยสามารถโหลดได้ผ่าน Microsoft Store

ข้อมูลทั้งหมดจาก Features removed or planned for replacement starting with Windows 10, version 1903

แนะนำการใช้ HTTP Strict Transport Security (HSTS) เพื่อให้เว็บเบราว์เซอร์ติดต่อผ่านช่องทางเข้ารหัสเท่านั้น

by

ไม่ได้เขียนเรื่องเทคโนโลยีมานาน รอบนี้เป็นบทความที่ดองมานานมาก รอบนี้เป็นบทความที่ต่อจากเรื่อง HTTP Public Key Pinning (HPKP) เพื่อป้องกัน Certification Authority ออก TLS Certificate ซ้ำซ้อน ที่เขียนไปก่อนหน้านี้

โดย HTTP Strict Transport Security (ต่อไปจะเรียกว่า HSTS) เป็นการเพิ่มประสิทธิภาพในรักษาความปลอดภัย เพื่อบอกให้เว็บเบราว์เซอร์ที่กำลังเข้ามาใช้บริการเว็บไซต์ ต้องทำงานผ่านช่องทางเข้ารหัส Hypertext Transfer Protocol Secure เท่านั้น (ต่อไปจะเรียกว่า HTTPS)

โดยจะเพิ่มชุดคำสั่งด้านล่างลงใน HTTP Header เพื่อส่งไปบอกเว็บเบราว์เซอร์

Strict-Transport-Security: max-age=expireTime [; includeSubDomains][; preload]

อธิบายโค้ดแต่ละส่วน

  • max-age required
    ระยะเวลาที่บอก client ว่าจะให้จำว่าควรเข้าเว็บผ่านช่องทางเข้ารหัส HTTPS นานเท่าใด โดยหน่วยเป็นวินาที
  • includeSubDomains Optional
    ระบุว่าการใช้งาน HSTS ดังกล่าวรวมถึง subdomain ด้วย
  • preload Optional
    หากในตัว domain ข้างต้น มีการเรียกใช้ข้อมูลใด ๆ ที่โหลดมาจาก domain ที่อยู่ในรายการ HSTS preload service บน browser ให้ใช้การเชื่อมต่อผ่านช่องทางเข้ารหัส HTTPS เช่นกัน โดย HSTS preload service นี้ Google เป็นคนดูแลรายชื่อ domain ดังกล่าวผ่าน https://hstspreload.org ซึ่งตอนนี้มี Browser อย่าง Chrome, Firefox, Opera, Safari, IE 11 และ Edge ที่ใช้รายการ domain ดังกล่าวใส่ลงใน browser ตัวเอง ซึ่งมักถูกแนะนำให้ใช้เสมอหากเราใช้ 3rd party อย่าง Javascript หรือ CSS ที่โหลดผ่าน CDN ต่าง ๆ

การใช้งาน HSTS ในเว็บเซิร์ฟเวอร์

พอได้ข้อมูลครบตามนี้ ก็เอาไปใส่ในเว็บเซิร์ฟเวอร์ โดยบทความจะยกตัวอย่าง 4 ตัว คือ Apache, Nginx, IIS และ .NET Core

Apache – (ต้องเปิด mod_headers ด้วย) เพิ่มในส่วนของ Web Server config อาจจะใส่ในส่วนของ vhost ก็ได้ 

Header always set Strict-Transport-Security: max-age=31536000

หรือหากมีเพิ่มพารามิเตอร์

Header always set Strict-Transport-Security: max-age=31536000; includeSubDomains

Nginx – (ต้องเปิด ngx_http_headers_module ด้วย) เพิ่มในส่วนของ Web Server config อาจจะใส่ในส่วนของ vhost ก็ได้ 

add_header Strict-Transport-Security: max-age=31536000

หรือหากมีเพิ่มพารามิเตอร์ 

add_header Strict-Transport-Security: max-age=31536000; includeSubDomains

IIS – แก้ไขที่ Web.config 

<httpProtocol>
 <customHeaders>
 <add name="Strict-Transport-Security" value="max-age=31536000" />
 </customHeaders>
</httpProtocol>

หรือหากมีเพิ่มพารามิเตอร์ 

<httpProtocol>
 <customHeaders>
 <add name="Strict-Transport-Security" value="max-age=31536000; includeSubDomains" />
 </customHeaders>
</httpProtocol>

ASP.NET Core 2.1 หรือมากกว่า เพิ่มเติมดังนี้

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    ...
    app.UseHsts();
    ...
}

การแก้ไขพารามิเตอร์ทำผ่าน method ชื่อ ConfigureServices ได้ตามด้านล่าง

public void ConfigureServices(IServiceCollection services)
{
    ...
    services.AddHsts(options =>
    {
        options.Preload = true;
        options.IncludeSubDomains = true;
        options.MaxAge = TimeSpan.FromDays(365);
    });
    ...
}

จากข้อมูลการใช้งาน และตัวอย่างทั้งหมด การเพิ่มเติมดังกล่าวมีประโยชน์ในการช่วยให้ผู้ใช้งาน เข้าเว็บผ่าน HTTPS ได้ปลอดภัยขึ้น หากในครั้งแรกที่เข้าเว็บได้รับ HTTP Header ข้างต้นอย่างถูกต้อง ในครั้งต่อไปตัวเว็บเบราว์เซอร์จะเข้าผ่าน URL protocal “https://” ทันที โดยไม่ต้องผ่าน “http://” อีก ทำให้ลดการถูก man-in-the-middle attacker เพื่อดังฟังข้อมูลอื่น ๆ ระหว่างการเปลี่ยนผ่านจาก URL protocal “http://” ไปยัง “https://” ได้ รวมไปถึงการโดน intercept traffic เพื่อให้เรารับ Certificate ที่ไม่ถูกต้องระหว่างการเข้าถึงหน้า HTTPS ได้

รีวิว Xiaomi Mi AirDots

by

ได้ Xiaomi Mi AirDots มาใช้งานประมาณ 1 เดือน ก็เลยคิดว่ารีวิวจากประสบการณ์ใช้งานจริงสักหน่อยว่าเป็นอย่างไรบ้าง

ผมจะเขียนเป็นข้อ ๆ ไปน่าจะดีกว่า ชอบและไม่ชอบจะปน ๆ กันไป

  1. ตัวนี้ได้ราคามาประมาณ 1,2xx บาทเห็นจะได้ ฝากร้านเค้าหิ้วมาจากจีน
  2. ในกล่องบรรจุภัณฑ์มีจุกหูฟังสำรองมาให้พร้อมกับ USB to micro USB สำหรับชาร์จ ที่เป็นสายเล็ก ๆ มาให้พร้อมใช้งาน
  3. ตัวที่ได้เป็นสีขาว ตัวหูฟังตอนแรกคิดว่าจะสกปรกง่าย พอใช้ไป ก็พอไหว ไม่แย่มาก
  4. หูฟังเป็นแบบ In-Ear ตัวหูฟังกระชับกับหูดี ใส่แล้วไม่หลุดง่าย แต่ขนาดที่มันเล็กไปหน่อย การถอดใส่ เข้า-ออก ลำบากพอสมควรเพราะมือมักไปโดนตัว touch control ทำให้หยุดเล่นเพลงได้ง่ายมาก ก็รำคาญพอสมควร
  5. กล่องใส่เบากว่าที่คิดไว้ ขนาดกำลังดีใส่กระเป๋าเสื้อได้ กระเป๋ากางเกงก็พอไหว โดยภายในช่องใส่หูฟังเป็นแม่เหล็กช่วยดูดหูฟังลงกล่องพร้อมยึดกับกล่องไม่ให้หลุดออกมา
  6. เปิดกล่องเอาหูฟังใส่หูแล้ว pair เสียงพูดเป็นภาษาจีน และเปลี่ยนไม่ได้ แรก ๆ ก็รำคาญ หลัง ๆ เริ่มชิน
  7. การชาร์จให้แบตเตอรี่ที่หูฟังเต็มจากตัวกล่องจะใช้เวลาประมาณ 1 ชั่วโมงครึ่ง สำหรับด้านความจุของแบตเตอรี่ที่ตัวหูฟังรองรับการฟังเพลงได้ประมาณ 4 ชั่วโมง และความจุของแบตเตอรี่ที่ตัวกล่องรองรับชาร์จได้ประมาณ 12 ชั่วโมง
  8. ตัวหูฟังซ้าย-ขวาอิสระจากกันแบบ True Wireless อยากใช้ข้างเดียวก็ได้ หรือทั้งสองข้างก็ได้ จากประสบการณ์ที่ใช้จะ pair ข้างขวาเป็นหลัก ส่วนข้างซ้ายจะมาต่อกับข้างขวาต่ออีกทีหนึ่ง
  9. การฟังเพลง ด้วยความที่ใช้ Sony Xperia XZ1 ที่เป็น Bluetooth 5.0 เช่นเดียวกัน พอใช้ไปแล้วเปิดเชื่อมต่อ มักจะเจอเหตุการณ์เสียงขาด ๆ หาย ๆ อยู่เสมอ ในสภาพแวดล้อมทั้งบนรถไฟฟ้า หรือใน Taxi ระหว่างการเดินทาง แม้แต่นั่งทำงานอยู่ก็ยังเจออยู่บ้าง และหากเจอหนักมาก ๆ บางครั้งหลุดหายไปเลยก็มี ทางแก้ไขที่ทำ ณ ตอนนี้คือ เปิด-ปิดใหม่ บางครั้งต้องเปิด-ปิดซ้ำ 3-4 รอบถึงจะกลับมาเสถียร และเป็นอาการที่เจอได้ทุกวันจนทำใจแล้ว
  10. ระยะทำงานของมันกับมือถือถ้าต่อกันได้แล้วประมาณ 8 – 10 เมตรเห็นจะได้
  11. คุณภาพของไมค์โครโฟนอันนี้สอบตกแทบใช้งานไม่ได้เลย พอจะโทรศัพท์ต้องเปลี่ยนมาใช้ผ่านมือถือเอาแทน ตัวหูฟังให้คุณภาพเสียงส่งให้ผู้ฟังปลายทางได้แย่มาก จับใจความได้ลำบาก
  12. คุณภาพเสียงที่ได้ ก็พอไปวัดไปวาได้ ไม่ได้ดีมากหรอก มีเบสพอตัว กลางกับแหลมก็พอไหว
  13. การควบคุมผ่าน touch control ทำได้ 4 แบบ ซึ่งบางครั้งก็ลำบากในการใช้งาน ด้วยขนาดที่เล็กของมันตามข้อข้างต้น
    • 1 tap คือ เล่นเพลง, หยุดเพลง หรือรับสาย
    • 2 tap คือ ใช้ voice assistant
    • tap ค้าง ประมาณ 3-5 วินาที ไว้คือตัดสายที่กำลังโทรเข้ามา
    • tap ค้าง ประมาณ 10 วินาทีคือปิด

จุดสำคัญที่สร้างความรำคาญที่เป็นจุดใหญ่คือ อาการเสียงขาด ๆ หาย ๆ ที่เจอบ่อย เวลาอารมณ์กำลังดี ๆ แต่เจอเสียงขาด ๆ หาย ๆ จนทำให้อารมณ์เสียก็มี ด้วยความที่ผมมี Sony SBH56 ที่เป็นชุดหูฟัง Bluetooth ซึ่งใช้งานมาก่อนหน้านี้ ก็ไม่เจอมากมายขนาดนี้

สรุป ราคาประมาณพันกว่าบาท กับอะไรประมาณข้างบน ก็คงบ่นอะไรมากไม่ได้ คุณภาพก็ตามราคากันไป ถ้ายอมรับข้อเสียมันได้ ก็ถือว่าไม่แพง คุ้มค่า แต่ถ้ารับไม่ไหว นี่แทบจะโยนทิ้ง (╯°□°）╯︵ ┻━┻

เรื่อง IPv9 มันเป็น April Fool’s Day ของ IETF ตั้งแต่ปี 1994

by

น่าจะเป็น blog ที่สั้นมาก ๆ ¯\_(ツ)_/¯


IPv9 มันเป็น April Fool’s Day ของ IETF ตั้งแต่ปี 1994 แล้ว


IETF April Fool’s Day joke ดูได้จาก RFC1606 และ RFC1607

RFC 1606 – A Historical Perspective On The Usage Of IP Version 9 (PDF)