สรุปเรื่องการเลือกใช้การเก็บ token ไว้ที่ไหนดีระหว่าง localstorage กับ cookie

Image placeholder
แวะมาทักทายกันได้


สรุปเรื่องการเลือกใช้การเก็บ token ไว้ที่ไหนดีระหว่าง localstorage กับ cookie

 ● Localstorag

ข้อดี
สะดวก เป็น javascript ถ้าคุณไม่มี backend และต้องใช้ library ของบุคคลที่ 3 จะไม่สามารถตั้งคุ้กกี้สำหรับใช้งานบนเว็บไซต์ได้

ข้อเสีย
สามารเกิดการโจมตีแบบ XSS ได้เพราะการทำ xss นี้เป็นการใส่ javascript เข้าไปใน input สามารถเกิดขึ้นได้จาก code ของบุคคลที่ 3 ที่อยู่ในเว็บไซต์พวก library ที่ติดตั้ง

● Cookie

ข้อดี
คุ้กกี้ไม่สามารถเข้าถึงได้ผ่าน javascript จึงไม่เสี่ยงต่อการโจมตีด้วย XSS

ถ้ากำหนดให้ใช้ httponly และ https cookies จะไม่สามารถเข้าถึงข้อมูลได้โดย javascript แม้ว่าผู้โจมตีจะพยายามใช้ javascript ก็ตาม

มันจะถูกส่งอัตโนมัติในทุกคำขอ http ไปยัง server

ข้อเสีย
อาจจะไม่สามารถเก็บ token ไว้ใน cookie ได้ถ้าขนาดของ cookie มีมากกว่า 4KB หากคุณใช้ JWT ขนาดใหญ่ การจัดเก็บใน cookie ก็ไม่ใช่ตัวเลือก

มีบางสถานการณ์ที่คุณไม่สามารถแชร์คุ้กกี้กับ server api ของคุณได้ หรือ api ต้องการให้คุณใส่ token เอาไว้ใน header กรณีนี้จะไม่สามารถเก็บ token ในคุ้กกี้ได้

● About xss attack

Local storage มีช่องโหว่เพราะว่าง่ายต่อการเข้าถึงด้วย javascript และผู้โจมตีสามารถดึงข้อมูล access token และเอาไปใช้ภายหลังได้ แต่ยังไงก็ตาม ในขณะที่ httponly cookie จะไม่สามารถเข้าถึงด้วย javascript ไม่ได้หมายความว่าจะปลอดภัยจากการโจมตีแบบ XSS ที่ดึง access token ได้

ถ้าผู้โจมตีสามารถรัน javascript ได้ ใน application ของคุณ ผู้โจมตีเพียงแค่สาง http request ไปที่ server ของคุณและรวมถึง cookie ของคุณด้วยโดยอัตโนมัติ เพียงแค่มันสะดวกน่อยกว่าเพราะไม่สามารถอ่าน content ของ token ได้

● CSRF Attack

เป็นการโจมตีที่บังคับให้ผู้ใช้ทำการร้องขอโดยไม่ตั้งใจ ยกตัวอย่างเช่น ในการส่ง form email ถ้าเว็บไซต์ยินยอมให้ email เปลี่ยน request ได้ แล้วผู้โจมตีสามารถสร้าง form อันตรายขึ้นมาแล้วส่ง POST ไปยังเว็บไซต์หนึ่ง เช่น https://site.com/email/change โดยซ่อมอีเมล์ field และ session เอาไว้ cookie ก็จะรวมไปโดยอัตโนมัติ อย่างไรก็ตามมันสามารถป้องกัน CSRF ได้

● สรุป

แม้ว่าจะช่องโหว่อยู่บ้าง แต่ก็ดีกว่า localstorage
ทำไม เพราะอะไร

Localstorage และ cookie ต่างก็มีช่องโหว่ แต่ผู้โจมตีจะทำได้ยากกว่าถ้าเจอกับ httponly

Cookies มีช่องโหว่ที่ถูกโจมตีด้วย CSRF แต่ป้องกันได้ด้วยการใช้ sameSite flag และ anti-CSRF token

แม้ว่าจะต้องใส่Authorization หรือ JWT ที่ขนาดใหญ่กว่า 4KB คุณก็ยังจำเป็นต้องใช้วิธีนี้ตามคำปนะนำของ OWASP

ห้ามเก็บ session ที่ระบุตัวตนเอาไว้ใน local storage เนื่องจาก javascript ดึงออกมาได้เสมอ แต่คุ้กลดความเสี่ยงนี้ได้โดยใช้ httponly

● ติดตั้งวิธีนี้อย่างไร

ขั้นตอนที่ 1

Return Acces token และ refresh token เมื่อ user เข้าสู่ระบบสำเร็จ โดยที่ access token จะส่งมายัง body response และ refresh token เอาเจ้าไปเก็บใน cookie โดยที่ refresh token จะประกอบไปด้วย

ใช้ flag httponly เพื่อป้องกัน javascript
ใช้ flag secure=true ส่งผ่านบน https
ใช้ flag SameSite=strict เพื่อป้องกัน csrf

ขั้นตอนที่ 2

เก็บ access token เอาไว้บน memory

ขั้นตอนที่ 3

ถ้าหากว่า ปิดเพจหรือ รีเฟรชก็ให้ไปทำการ generate token ใหม่ ด้วย refresh token

โดย concept แล้วน่าจะปลอดภัยเพิ่มขึ้น แต่ถึงอย่างไรก็ต้องคอยป้องกันและหมั่นดูแลระบบให้ปลอดภัยอยู่เสมอนะครับ

Ref:
Cookie compare Local Storage

แวะมาทักทายกันได้
donate

Categories: Research Tags: #web application , 4261