Back

แนวทางการประยุกต์ใช้ Google Authentication สำหรับการลงทะเบียนและเข้าสู่ระบบสารสนเทศ

การลงทะเบียนและการตั้งค่าบริการ API Google’s OAuth 2.0  เพื่อให้เว็บแอปพลิเคชันสามารถเข้าสู่ระบบ (Login) ผ่าน Google Account มีขั้นตอนดังนี้

1. พิมพ์ URL  https://console.cloud.google.com และคลิก Select a project

2. คลิก New project

3. กรอกข้อมูลชื่อโครงการ (Project name) ให้ครบถ้วน จากนั้นคลิกปุ่ม Create

4. คลิกเมนูหลักที่มุมบนด้านซ้าย เพื่อให้แสดงเมนูทั้งหมด

5. คลิกที่เมนู APIs & Services จากนั้นเลือก Credentials

6. คลิกปุ่ม + Create Credentials โดยให้สังเกตที่ชื่อโครงการด้านบน และสร้างภายใต้ชื่อโครงการที่ต้องการ

7. เลือก OAuth client ID

8. คลิกเมนู Overview

9. คลิกปุ่ม Get started

10. ระบบจะแสดงหน้า Project configulation ให้กรอกข้อมูลเกี่ยวกับแอปพลิเคชัน

11. กรอกข้อมูลให้ครบถ้วน จากนั้นคลิกปุ่ม Next เพื่อบันทึกข้อมูล

12. คลิกเลือก External เพื่อให้บุคคลทั่วไปสามารถเข้าใช้งานได้ จากนั้นคลิกปุ่ม Next เพื่อบันทึกข้อมูล

13. กรอกข้อมูลอีเมลที่ใช้ติดต่อ จากนั้นคลิกปุ่ม Next เพื่อบันทึกข้อมูล

14. คลิก checkbox I agree to the Google API Services. User Data Policy และคลิกปุ่ม Continue และคลิกปุ่ม Create

15. คลิกเมนู Clients และเลือก Web application

16. ตั้งชื่อ Name และกรอกข้อมูลที่ช่อง Authorized redirect URIs ซึ่งต้องเป็น Url ที่ระบบรับข้อมูลจากบริการของ Google กลับไปใช้งาน จากนั้นคลิกปุ่ม Create

17. คัดลอกClient ID และ Client secret ไว้ใช้งาน

18. นำ Client ID และ Client secret มาใช้งานในไฟล์ .env ของระบบ

19. ในกรณีที่ต้องการบันทึกข้อมูลของแอปพลิเคชันเพิ่มเติม คลิกเมนู APIs & Services เลือก OAuth consent screen และคลิกเมนู Branding และกรอกข้อมูลที่สำคัญของ App information และ App domain เพื่อเพิ่มความน่าเชื่อถือต่อการใช้งาน ดังนี้

          – Application home page

          – Application privacy policy link

          – Application terms of service link

หมายเหตุ : กรณีที่ใส่รูปโลโก้ (App logo) ระบบจะบังคับ verify ซึ่งต้องรอการพิจารณาตัวตนจาก Google

20. ในกรณที่แอปพลิเคชันยังอยู่ในโหมดทดสอบ ยังสามารถใช้บริการได้ แต่เมื่อกด “Publish app” จะไม่สามารถใช้งานข้อมูลที่เป็น Sensitive Scopes (ขอบเขตข้อมูลที่ละเอียดอ่อน) ได้และจะถูกแจ้งเตือนให้ verify ทันที หากแอปพลิเคชันใช้งานเพียง Non-sensitive Scopes (ขอบเขตข้อมูลทั่วไป) ก็ไม่มีผลกระทบหรือข้อจำกัดต่อการใช้งาน แต่ให้ลบรูป logo ออก และระบุ Scope ให้ชัดเจน

21. เมื่อลบรูป logo ออกจะไม่จำเป็นต้องส่ง verify

22. สามารถระบุการเข้าถึงข้อมูลได้ที่เมนู “Data Access”

23. นำค่า env มาใส่ใน /config/services.php

24. นำค่า env มาใส่ใน app/Providers/EventServiceProvider.php

25. สร้างฟังก์ชั่นสำหรับ redirect

26. สร้างฟังก์ชั่น callback สำหรับ รับค่ากลับ

27. สร้าง route สำหรับ redirect ไปหา google และสำหรับ callback