การทำ Social Login สำหรับ Login เว็บ Magento 2 และ WordPress ด้วยบัญชี Google

การทำ Social Login สำหรับ Login เว็บ Magento 2 และ WordPress  ด้วยบัญชี Google

การทำ Social Login สำหรับ Login เว็บ Magento 2 และ WordPress ด้วยบัญชี Google

“Social login” หรือ “การเข้าสู่ระบบผ่านโซเชียลมีเดีย” เป็นวิธีการที่ผู้ใช้สามารถลงชื่อเข้าใช้เว็บไซต์หรือแอปพลิเคชันโดยใช้ข้อมูลประจำตัวจากบริการโซเชียลมีเดียหรือบริการอื่น ๆ ที่พวกเขามีอยู่แล้ว เช่น Facebook, Google, Twitter, LinkedIn ฯลฯ โดยไม่ต้องสร้างบัญชีใหม่เฉพาะสำหรับเว็บไซต์หรือแอปพลิเคชันนั้น

Google Cloud Platform คืออะไร

Google Cloud Platform (GCP) คือเซ็ตของบริการบนคลาวด์ที่ให้บริการโดย Google ที่มาพร้อมกับเครื่องมือและการพัฒนาสำหรับการประมวลผลแบบขนาดใหญ่ การจัดเก็บข้อมูล และการวิเคราะห์ ส่วนมากของบริการเหล่านี้สามารถใช้งานได้ผ่าน API และอินเทอร์เฟซบนเว็บ

การสร้างโปรเจกต์ APIs & Services เพื่อใช้งานฟีเจอร์ Social Login

1. เข้าไปลิงค์ https://cloud.google.com/console/projec คลิกปุ่ม Create Project

Social login

2. ใส่ชื่อ Project แล้ว Create

blank

3. สร้างเสร็จแล้วให้คลิก Select Project

blank

4. เลือก APIs & Services -> Credentials

blank

5. เลือก Create Credentials -> OAuth Client ID

blank

6. คลิก CONFIGURE CONSENT SCREEN

blank

7. เลือก External

blank

8. ใส่ข้อมูลให้เรียบร้อย แล้ว Save

blankblank

9. แท็บ Scope กด Save ได้เลย

blank

10. เพิ่ม test users โดยกด add users แล้วใส่อีเมล

blank

11. คลิก back to dashboard

blank

12. จากนั้นคลิก Create Credentials -> OAuth Client ID อีกครั้ง

blank

13. เลือก Application Type เป็น Web Application

blank

14. กรอกข้อมูลให้เรียบร้อย

blank

15. Authorized redirect URIs ให้ใส่ URL ดังนี้

  • 15.1 Magento 2 จะต้องติดตั้ง Extension Amasty Social Login สำหรับ ให้ดูที่หน้า Config Amasty Social Login บางเวอร์ชั่นให้ใช้ลิงค์จากแท็บ General Settings

    blank

  • – บางเวอร์ชั่นให้ใช้ลิงค์จากแท็บ Google

    blank

  • 15.2 สำหรับ WordPress ให้นำลิงค์จากการตั้งค่าปลั๊กอินมาใส่ คลิกที่นี่

การตั้งค่า Social Login เข้ากับเว็บไซต์

WordPress

1. สำหรับการตั้งค่าใน WordPress ให้ติดตั้งปลั๊กอิน Nextend Social Login

blank

2. ให้เข้าไปที่ ตั้งค่า -> Nextend Social Login แล้วทำการ Settings Google

blank

blank

4. จากนั้นเอา Key ที่ได้ไปใส่ในปลั๊กอิน ให้ใส่ในแท็บ Settings
Client ID = Consumer Key (API Key)
Client Secret = Consumer Secret (API Secret)

blank

WordPress

blank

Magento 2

blank