JavaScript SDK - ตัวอย่าง

อ่านคู่มือการเริ่มต้นใช้งานอย่างง่ายเพื่อเรียนรู้วิธีโหลดและเริ่มต้น Facebook SDK สำหรับ JavaScript และคู่มือการตั้งค่าขั้นสูงของเราเพื่อปรับแต่งการนำไปใช้งานของคุณ ต่อไปให้ลองดูตัวอย่างการใช้งาน SDK ของเราต่อไปนี้

• ทริกเกอร์กล่องการแชร์
• การเข้าสู่ระบบด้วย Facebook

ทริกเกอร์กล่องการแชร์

กล่องการแชร์ ช่วยให้ผู้อื่นสามารถใช้เพจโพสต์ลิงก์ในไทม์ไลน์ของตน หรือสร้างข้อมูล Open Graph ได้ กล่องโต้ตอบที่แสดงโดยใช้ JavaScript SDK จะได้รับการจัดรูปแบบโดยอัตโนมัติตามบริบทที่โหลด อย่างเว็บบนมือถือหรือเว็บบนเดสก์ท็อป เป็นต้น

ต่อไปนี้เราจะแสดงให้ทราบว่าสามารถใช้เมธอด FB.ui() ของ SDK เพื่อเรียกใช้งานกล่องการแชร์ขั้นพื้นฐานจริงๆ ได้อย่างไร เพิ่มส่วนย่อยนี้หลังการเรียก FB.init() ในโค้ดการตั้งค่าพื้นฐานดังแสดงด้านล่าง

FB.ui({
  method: 'share',
  href: 'https://developers.facebook.com/docs/'
}, function(response){});
    

เมื่อคุณโหลดเพจของคุณอีกครั้ง คุณจะเห็นกล่องการแชร์ปรากฏอยู่ด้านบนของเพจ เมื่อปิดกล่องโต้ตอบ ไม่ว่าโดยการโพสต์เรื่องราวหรือการยกเลิก ระบบจะทริกเกอร์ฟังก์ชั่นการตอบกลับ

อ่านFB.uiเอกสารอ้างอิงเพื่อดูรายการพารามิเตอร์ทั้งหมดที่สามารถใช้ได้ และโครงสร้างของอ็อบเจ็กต์การตอบกลับ

การเข้าสู่ระบบด้วย Facebook

การเข้าสู่ระบบด้วย Facebook ช่วยให้ผู้ใช้สามารถลงทะเบียนหรือลงชื่อเข้าใช้แอพของคุณด้วยข้อมูลระบุตัวตนบน Facebook ของผู้ใช้เองได้

เรามีคู่มือฉบับสมบูรณ์เกี่ยวกับวิธีใช้ JS SDK เพื่อนำการเข้าสู่ระบบด้วย Facebook มาใช้งาน แต่ในขณะนี้เราจะใช้แค่โค้ดตัวอย่างขั้นพื้นฐานเพียงบางส่วน เพื่อให้คุณเห็นว่าโค้ดทำงานอย่างไร แทรกโค้ดต่อไปนี้หลังการเรียก FB.init เดิมของคุณ

FB.login(function(response) {
    if (response.authResponse) {
     console.log('Welcome!  Fetching your information.... ');
     FB.api('/me', function(response) {
       console.log('Good to see you, ' + response.name + '.');
     });
    } else {
     console.log('User cancelled login or did not fully authorize.');
    }
});
    

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