วิธีใช้การรับรองความถูกต้องโทเค็นใน Next.js โดยใช้ JWT

วิธีใช้การรับรองความถูกต้องโทเค็นใน Next.js โดยใช้ JWT
ผู้อ่านเช่นคุณช่วยสนับสนุน MUO เมื่อคุณทำการซื้อโดยใช้ลิงก์บนเว็บไซต์ของเรา เราอาจได้รับค่าคอมมิชชั่นจากพันธมิตร อ่านเพิ่มเติม.

การรับรองความถูกต้องของโทเค็นเป็นกลยุทธ์ยอดนิยมที่ใช้ในการปกป้องเว็บและแอปพลิเคชันมือถือจากการเข้าถึงโดยไม่ได้รับอนุญาต ใน Next.js คุณสามารถใช้คุณสมบัติการตรวจสอบสิทธิ์ที่ Next-auth มอบให้ได้





วิธีทำฟิลเตอร์ snap ของคุณเอง
MUO วิดีโอประจำวันนี้ เลื่อนเพื่อดำเนินการต่อด้วยเนื้อหา

หรือคุณสามารถเลือกที่จะพัฒนาระบบการตรวจสอบความถูกต้องตามโทเค็นแบบกำหนดเองโดยใช้ JSON Web Tokens (JWT) การทำเช่นนี้ คุณแน่ใจได้ว่า คุณจะสามารถควบคุมตรรกะการรับรองความถูกต้องได้มากขึ้น โดยพื้นฐานแล้ว การปรับแต่งระบบให้ตรงกับความต้องการของโครงการของคุณอย่างแม่นยำ





ตั้งค่าโครงการ Next.js

ในการเริ่มต้น ให้ติดตั้ง Next.js โดยเรียกใช้คำสั่งด้านล่างบนเทอร์มินัลของคุณ





 npx create-next-app@latest next-auth-jwt --experimental-app

คู่มือนี้จะใช้ Next.js 13 ซึ่งรวมถึงไดเรกทอรีของแอป .

 โครงสร้างโฟลเดอร์โครงการ Next.js 13 บน VS Code

จากนั้น ติดตั้งการขึ้นต่อกันเหล่านี้ในโครงการของคุณโดยใช้ npm ตัวจัดการแพ็คเกจโหนด .



 npm install jose universal-cookie

โฮเซ่ เป็นโมดูล JavaScript ที่ให้ชุดยูทิลิตี้สำหรับการทำงานกับ JSON Web Tokens ในขณะที่ คุกกี้สากล การพึ่งพาให้วิธีง่ายๆ ในการทำงานกับคุกกี้ของเบราว์เซอร์ทั้งในสภาพแวดล้อมฝั่งไคลเอ็นต์และฝั่งเซิร์ฟเวอร์