วิธีทำ LINE Login เข้าสู่ระบบด้วย Line (PHP) บนเว็บไซต์

LINE Login API คือการเข้าสู่ระบบหรือสมัครสมาชิกแบบ SSO ( Single Sign On ) ความหมายคือการใช้ข้อมูลเดียวกันกับแพลตฟอร์มใด แพลตฟอร์มหนึ่งในการลงทะเบียนใช้งาน ในตัวอย่างนี้ก็คือการใช้ Line Account ในการเข้าสู่ระบบหรือสมัครสมาชิกเข้าใช้งานซอฟต์แวร์อื่น

ในเวอร์ชั่นก่อนหน้านี้ของ LINE Login API อาจจะยังไม่ได้รับความนิยมมากนัก เพราะข้อมูล JSON ที่ Response กลับมาจะได้ข้อมูลที่จำเป็นจริง ๆ แค่ชื่อและรูปภาพประจำตัวเท่านั้น ยังไม่ให้อนุญาติให้เข้าถึง email ในแต่เวอร์ชั่นปัจจุบัน 2.x ได้อนุญาติให้สามารถเข้าถึงข้อมูลอีเมลแล้ว ผ่าน id_token โดยการเข้ารหัส JWT ( Json Web Token ) ด้วยเหตุนี้ทำให้การเข้าสู่ระบบผ่าน LINE Login API กำลังได้รับความนิยมขึ้นเรื่อย ๆ เพราะได้ข้อมูลครบถ้วนขึ้น ทั้งการเข้าระบบผ่าน Mobile Apps และ Web Apps

เริ่มต้นด้วยการสร้าง Line Channel

• เข้าไปที่ https://developers.line.biz/en/ ในหัวข้อ Products ให้เลือก LINE Login กดปุ่ม ‘Start Now’
• ในหน้า Create a channel ให้เรากรอกข้อมูลทุกอย่างให้ครบถ้วน Provider ถ้ายังไม่เคยสร้าง ให้เลือกไปที่ Create a new Provider
• หลังจากกด Create ระบบจะพาเรามาที่หน้ารายละเอียดของ Channel และแท็บ Basic Setting ให้เลื่อนลงไปหาหัวข้อ OpenID Connect สถานะเริ่มต้นจะเป็น Unapplied ให้กด Apply และกรอกข้อมูล จนสถานะเปลี่ยนเป็น Applied

• ต่อไปให้เลือกไปที่แท็บ LINE Login เลือกเปิดใช้งาน Web Apps และ ระบุ Callback URL สำหรับ Callback URL จะเป็น URL ที่เราไว้รับ JSON Response ที่ถูกคืนค่ามาจาก Line API ถ้าไม่สำเร็จเราก็จะรู้ว่า สาเหตุเกิดจากอะไร ถ้าสำเร็จเราก็สามารถ Get ข้อมูลได้จากตรงนี้ และนำไปใช้งานในขั้นตอนต่อ ๆ ไป

ข้อมูลที่ต้องใส่ตอน Request และข้อมูล JSON Response ที่จะได้กลับมา

• ถ้าเข้าไปดูใน Document ของ LINE API https://developers.line.biz/en/docs/line-login/integrate-line-login/ จะมีระบุชัดเจนนะครับว่า ตอน Request ไป เราต้องส่งข้อมูลอะไรไปบ้าง

• และเมืออ Request สำเร็จเราจะได้ Reponse ข้อมูลอะไรกลับมาบ้าง

เริ่มต้นเขียน PHP Line Login

เบื้องต้นให้เตรียม Environment ตามด้านล่างนะครับ

• ดาวน์โหลด https://github.com/makorn645/PHP-line-login-sdk
• ใช้ PHP 7.2 หรือเวอร์ชั่นที่สูงกว่า
• ใช้ Codeigniter Framework ในการทดสอบ

• เปลี่ยนชื่อไฟล์ linelogin.php เป็น Linelogin.php และเปลี่ยนชื่อคลาสจาก linelogin เป็น Linelogin
• วางไฟล์ Linelogin ไว้ในส่วนของ application/libraries
• เปิดไฟล์ Linelogin.php แก้ไขข้อมูลดังต่อไปนี้

private const CLIENT_ID = 'ใส่ Channel ID ที่ได้จากการทำในขั้นตอนแรก';
private const CLIENT_SECRET = 'ใส่ Channel secret ที่ได้จากการทำในขั้นตอนแรก';
private const REDIRECT_URL = 'url ที่เรากรอกไปในแท็บ Line Login';

• สร้าง Login Controller และทำการ load libraries เข้ามาใช้งานตัวอย่างโค๊ดตามด้านล่าง

class Login extends MX_Controller
{
	public function __construct()
	{
		parent::__construct();
		$this->load->library('linelogin'); // โหลด line libraries มาใช้งาน
	}
	public function index(){
		$url = $this->linelogin->getLink(7); // ขอ permission สำหรับเข้าถึง profile, email 
		redirect($url);
	}
	public function line_login_callback(){
		$get = $this->input->get(); // รับ json payload
		$code = $get['code'];
		$state = $get['state'];
		$token = $this->linelogin->token($code,$state); // curl เพื่อขอ id_token
		$token = json_decode($token);
		print_r($token);
	}
}

• ข้อมูลสำคัญ 3 อย่างคือ name, picture, email จะถูกเข้ารหัสในรูปแบบ JWT ซึ่งอยู่ใน $token->id_token สามารถใช้คำสั่ง base64_decode ดูข้อมูลเบื้องต้นได้ในรูปแบบ String แต่ถ้าต้องการนำไปใช้งานต่อต้อง ต้องใช้ JWT decode ในการถอดรหัส https://github.com/firebase/php-jwt

echo base64_decode($token->id_token);

ทดสอบการทำงานได้ที่ https://www.ivomaker.com/login