การส่ง Signed Token ระหว่างสอง PWA: ใช้ HMAC-SHA256 โดยไม่ต้องมี Backend

คุณจำเป็นต้องส่งข้อมูลระบุตัวตนของผู้ใช้ (user identity) จาก PWA หนึ่งไปยังอีก PWA หนึ่ง โดยที่ทั้งสองแอปทำงานบนโปรเจกต์ Firebase ที่แยกจากกัน ไม่มีการใช้ฐานข้อมูลร่วมกัน และไม่มีการใช้ระบบ Authentication ร่วมกัน

คุณสามารถแก้ปัญหานี้ได้โดยไม่ต้องเขียนโค้ดฝั่ง backend เลย เพียงแค่ใช้ Web Crypto API ของเบราว์เซอร์และ signed URL เท่านั้น

ปัญหาคือ: เครื่องมือภายในที่ชื่อว่า PanelControl จำเป็นต้องเปิดอีกเว็บไซต์หนึ่งที่ชื่อว่า Orders เมื่อผู้ใช้คลิกปุ่ม เว็บไซต์ Orders จะต้องทราบว่าผู้ใช้คือใคร โดยที่ผู้ใช้ไม่ควรต้องล็อกอินซ้ำเป็นครั้งที่สอง

สามวิธีในการทำสิ่งนี้:

  • Shared Firebase: ต้องใช้ฐานข้อมูลร่วมกัน ซึ่งในกรณีนี้ทำไม่ได้
  • postMessage: ต้องอยู่ภายใต้โดเมนเดียวกันหรือใช้ popup ซึ่งจัดการได้ยากกว่า
  • HMAC signed URL: ใช้ลิงก์ที่มี token วิธีนี้ทำงานได้อย่างสมบูรณ์แบบ

หลักการทำงาน: HMAC จะสร้าง signature โดยใช้ secret key จากนั้นผู้รับจะใช้ key เดียวกันเพื่อตรวจสอบ signature หากข้อมูลตรงกัน แสดงว่าผู้ส่งเป็นที่เชื่อถือได้

ขั้นตอนการทำงาน:

  1. ฝั่งผู้ส่ง (Sender side):
  • สร้าง payload ที่ประกอบด้วยชื่อผู้ใช้และ timestamp
  • ลงลายเซ็น (Sign) payload โดยใช้ HMAC-SHA256