การแชร์บน iOS

คู่มือนี้อธิบายการเปิดใช้งานการแชร์จากแอพ iOS ไปยัง Facebook เมื่อมีผู้แชร์เนื้อหาจากแอพ เนื้อหานั้นจะแสดงในไทม์ไลน์ของบุคคลนั้นและในฟีดข่าวของเพื่อนของบุคคลนั้น

นอกจากนี้ ผู้ใช้ยังแชร์เนื้อหาจากแอพของคุณไปยัง Facebook Messenger ด้วยแพลตฟอร์ม Messenger Expression หรือจากกล่องการส่งข้อความใน SDK สำหรับ iOS ได้ด้วย

Messenger SDK สำหรับ iOSกล่องการส่งข้อความ

ข้อกำหนดที่ต้องดำเนินการก่อน

ก่อนเพิ่มการแชร์ไปยังแอพ คุณต้องดำเนินการต่อไปนี้:

  • เพิ่ม Facebook SDK สำหรับ iOS ลงในสภาพแวดล้อมการพัฒนาบนอุปกรณ์เคลื่อนที่ของคุณ
  • กำหนดค่าและเชื่อมโยง ID ของแอพของ Facebook
  • เพิ่ม ID ของแอพ, ชื่อที่แสดง และเหตุผลที่มนุษย์สามารถอ่านได้สำหรับการเข้าถึงรูปภาพในไฟล์ .plist ของแอพของคุณ
  • เชื่อมโยง FBSDKShareKit.framework กับโปรเจ็กต์ของคุณ

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

การเริ่มต้นใช้งาน SDK สำหรับ iOS

การทำโมเดลเนื้อหา

Facebook SDK เวอร์ชั่น 4.0 เป็นต้นไปมีโมเดลใหม่สำหรับการแชร์เนื้อหา เนื้อหาแต่ละประเภทมีอินเทอร์เฟซที่ใช้แสดงได้ซึ่งเป็นไปตาม <FBSDKSharingContent> หลังจากทำโมเดลเนื้อหาแล้ว ให้เพิ่มอินเทอร์เฟซการแชร์ลงในแอพซึ่งเป็นไปตาม <FBSDKSharing> เช่น FBSDKShareDialog

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

ตั้งแตวันที่่ 18 เมษายน 2017 พารามิเตอร์ต่อไปนี้จะไม่ได้รับการรองรับโดย API กราฟเวอร์ชั่น 2.9 ขึ้นไป สำหรับเวอร์ชั่น 2.8 และต่ำกว่า พารามิเตอร์จะยังคงทำงานจนถึงวันที่ 17 กรกฎาคม 2017

  • contentTitle - แสดงชื่อเนื้อหาในลิงก์
  • imageURL - URL ของภาพขนาดย่อที่แสดงในโพสต์
  • contentDescription - ของเนื้อหา ซึ่งโดยปกติจะมีความยาว 2-4 ประโยค

ตัวอย่างวิธีทริกเกอร์การแชร์มีดังนี้:

FBSDKShareLinkContent *content = [[FBSDKShareLinkContent alloc] init];
content.contentURL = [NSURL URLWithString:@"https://developers.facebook.com"];

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

รูปภาพ

ผู้ใช้สามารถแชร์รูปภาพจากแอพไปยัง Facebook โดยใช้กล่องการแชร์หรืออินเทอร์เฟซแบบกำหนดเอง ดังนี้:

  • รูปภาพต้องมีขนาดน้อยกว่า 12 MB
  • ผู้ใช้ต้องติดตั้งแอพ Facebook แบบเนทีฟสำหรับ iOS เวอร์ชั่น 7.0 ขึ้นไป

สร้างเนื้อหาที่แชร์สำหรับรูปภาพด้วยโมเดล FBSDKSharePhotoContent โปรดดูรายการแอตทริบิวต์ทั้งหมดใน ข้อมูลอ้างอิง FBSDKSharePhotoContent

- (void)imagePickerController:(UIImagePickerController *)picker
didFinishPickingMediaWithInfo:(NSDictionary *)info
{
  UIImage *image = info[UIImagePickerControllerOriginalImage];

  FBSDKSharePhoto *photo = [[FBSDKSharePhoto alloc] init];
  photo.image = image;
  photo.userGenerated = YES;
  FBSDKSharePhotoContent *content = [[FBSDKSharePhotoContent alloc] init];
  content.photos = @[photo];
  ...
}

วิดีโอ

ผู้ที่ใช้แอพของคุณสามารถแชร์วิดีโอไปยัง Facebook โดยใช้กล่องการแชร์หรืออินเทอร์เฟซแบบกำหนดเองของคุณ:

  • วิดีโอต้องมีขนาดเล็กกว่า 12 MB
  • ผู้ที่แชร์ควรติดตั้งไคลเอ็นต์ Facebook สำหรับ iOS เวอร์ชั่น 26.0 เป็นต้นไป

สร้างเนื้อหาที่แชร์สำหรับวิดีโอด้วยโมเดล FBSDKShareVideoContent โปรดดูรายการแอตทริบิวต์ทั้งหมดใน ข้อมูลอ้างอิง FBSDKShareVideoContent

- (void)imagePickerController:(UIImagePickerController *)picker
didFinishPickingMediaWithInfo:(NSDictionary *)info
{
  NSURL *videoURL = [info objectForKey:UIImagePickerControllerReferenceURL];

  FBSDKShareVideo *video = [[FBSDKShareVideo alloc] init];
  video.videoURL = videoURL;
  FBSDKShareVideoContent *content = [[FBSDKShareVideoContent alloc] init];
  content.video = video;
  ...
}

URL วิดีโอ videoURL ต้องเป็น URL เนื้อหา คุณสามารถรับ URL เนื้อหาวิดีโอได้จาก UIImagePickerController เป็นต้น

มัลติมีเดีย

ผู้ที่ใช้แอพของคุณสามารถแชร์แบบผสมผสานทั้งรูปภาพและวิดีโอไปยัง Facebook ด้วยกล่องการแชร์ได้ โปรดคำนึงสิ่งต่อไปนี้:

  • ผู้ใช้จะต้องมี iOS เวอร์ชั่น 7.0 ขึ้นไป
  • ผู้ที่แชร์ควรติดตั้งไคลเอนต์ Facebook สำหรับ iOS เวอร์ชั่น 52.0 ขึ้นไป
  • รูปภาพและวิดีโอแต่ละรายการจะต้องมีขนาดเล็กกว่า 12 MB
  • ผู้ใช้สามารถแชร์วิดีโอได้สูงสุด 1 รายการกับรูปภาพ 29 หรือ 30 รูป

สร้างเนื้อหาการแชร์มัลติมีเดียของคุณด้วยโมเดล FBSDKShareMediaContent โปรดดูรายการแอตทริบิวต์ทั้งหมดใน ข้อมูลอ้างอิง FBSDKShareMediaContent

FBSDKSharePhoto *photo = [FBSDKSharePhoto photoWith...
FBSDKShareVideo *video = [FBSDKShareVideo videoWith...
FBSDKShareMediaContent *content = [FBSDKShareMediaContent new];
content.media = @[photo, video];
}

วิธีการแชร์

หลังจากจัดการเนื้อหาโดยสร้างโมเดลแล้ว คุณสามารถทริกเกอร์กล่องการแชร์หรือกล่องการส่งข้อความ หรืออินเทอร์เฟซแบบกำหนดเองของคุณที่ใช้สำหรับแชร์ได้

ปุ่ม

Facebook ใน iOS มีปุ่มเนทีฟที่ทริกเกอร์การแชร์ได้


ปุ่มถูกใจ

ผู้ใช้สามารถใช้ปุ่มถูกใจในการแชร์เนื้อหากับเพื่อนได้อย่างรวดเร็ว เมื่อแตะปุ่มถูกใจ คุณจะ “ถูกใจ” เนื้อหาจากแอพและจะแชร์ไปยัง Facebook โปรดใส่ส่วนย่อยของโค้ดต่อไปนี้ลงในมุมมองเพื่อเพิ่มปุ่มถูกใจ:

FBSDKLikeControl *button = [[FBSDKLikeControl alloc] init];
button.objectID = @"https://www.facebook.com/FacebookDevelopers";
[self.view addSubview:button];

ปุ่มแชร์

คุณสามารถใช้ปุ่มแชร์เพื่อให้ผู้ใช้แชร์เนื้อหาลงในไทม์ไลน์ Facebook ของตน, ในไทม์ไลน์ของเพื่อนหรือในกลุ่มได้ ปุ่มแชร์จะเรียกกล่องการแชร์ขึ้นมา โปรดใส่ส่วนย่อยของโค้ดต่อไปนี้ลงในมุมมองเพื่อเพิ่มปุ่มแชร์:

FBSDKShareButton *button = [[FBSDKShareButton alloc] init];
button.shareContent = content;  
[self.view addSubview:button];

ปุ่มส่ง

ผู้ใช้สามารถส่งรูปภาพ วิดีโอ และลิงก์ให้เพื่อนและผู้ติดต่อได้แบบส่วนตัวด้วยปุ่มส่งโดยใช้ Facebook Messenger ปุ่มส่งจะเรียกกล่องการส่งข้อความขึ้นมา โปรดใส่ส่วนย่อยของโค้ดต่อไปนี้ลงในมุมมองเพื่อเพิ่มปุ่มส่ง:

FBSDKSendButton *button = [[FBSDKSendButton alloc] init];
button.shareContent = content; 
[self.view addSubview:button];

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

if (button.isHidden) {
  NSLog(@"Is hidden");
} else {
  [self.view addSubview:button];
}

กล่องการแชร์

หากต้องการใช้ประสบการณ์การแชร์ที่ Facebook สร้าง คุณต้องกำหนดเนื้อหาในส่วน การทำโมเดลเนื้อหา ข้างต้น แล้วเรียกกล่องการแชร์ เช่น หากต้องการแชร์ลิงก์ด้วยกล่องการแชร์:

FBSDKShareLinkContent *content = [[FBSDKShareLinkContent alloc] init];
content.contentURL = [NSURL URLWithString:@"http://developers.facebook.com"];
[FBSDKShareDialog showFromViewController:self
                              withContent:content
                                 delegate:nil];

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

ในขณะนี้ SDK จะตรวจสอบแอพ Facebook แบบเนทีฟให้โดยอัตโนมัติ หากยังไม่ได้ติดตั้งแอพไว้ SDK จะนำผู้ใช้สลับไปที่เบราว์เซอร์เริ่มต้นของตนและเปิด กล่องการแชร์บนฟีด หากมีคนต้องการแชร์ข้อมูล Open Graph ใดๆ SDK จะเปิดกล่องการแชร์ในเว็บ

ถ้าติดตั้งแอพ Facebook แบบเนทีฟไว้แล้ว SDK เวอร์ชั่น 4.0-4.4 จะสลับกลับเป็นแอพ Facebook สำหรับ iOS แบบเนทีฟ และคืนการควบคุมให้แอพหลังจากที่เผยแพร่โพสต์แล้ว หากคุณใช้ SDK เวอร์ชั่น 4.5 ขึ้นไป ผู้ใช้จะเห็นชีทการแชร์ของ iOS แทนที่จะสลับไปยังแอพ Facebook สำหรับ iOS แบบเนทีฟ เว้นแต่ว่าสิ่งที่แชร์เป็นข้อมูล Open Graph

กล่องการส่งข้อความ

กล่องการส่งข้อความสลับไปที่ Messenger สำหรับ iOS แบบเนทีฟ แล้วคืนการควบคุมให้แอพหลังจากที่เผยแพร่โพสต์แล้ว

[FBSDKMessageDialog showWithContent:content delegate:nil];

หมายเหตุ: ขณะนี้ iPad ยังไม่สนับสนุนกล่องการส่งข้อความ

การผสานรวม iOS

iOS 6 ขึ้นไปมีชีทการแชร์แบบเนทีฟที่ให้ผู้ใช้สามารถโพสต์การอัพเดตสถานะ รูปภาพ วิดีโอ และลิงก์ไปยัง Facebook และรวมการสนับสนุนการตั้งกลุ่มเป้าหมายให้โพสต์และแท็กในโพสต์พร้อมตำแหน่งที่ตั้ง คุณไม่สามารถแชร์ข้อมูล Open Graph พร้อมชีทการแชร์ได้ Facebook SDK สนับสนุนการใช้การควบคุมแบบเนทีฟโดยเริ่มจาก Facebook SDK เวอร์ชั่น 4.5 ประสบการณ์นี้เป็นสิ่งที่ผู้ใช้ได้เห็นในกรณีส่วนใหญ่เมื่อคุณเรียกกล่องการแชร์ใน Facebook

การใช้ชีทการแชร์ iOS ต้องเป็นไปตามนโยบายแพลตฟอร์มของ Facebook ซึ่งรวมถึงหัวข้อที่ 2.3 ซึ่งระบุว่าต้องไม่กรอกข้อมูลแอพไว้ล่วงหน้าในเนื้อหาของชีทการแชร์ นั่นหมายความว่าแอพจะต้องไม่กรอกข้อมูลในช่อง initialText ของชีทการแชร์ไว้ล่วงหน้าด้วยเนื้อหาที่ผู้ใช้ไม่ได้กรอกไว้ก่อนเมื่อใช้งานแอพ

API นี้ยังใช้บล็อกสไตล์เดียวกับส่วนอื่นๆ ของ Facebook SDK ด้วย หากต้องการแสดงกล่องการแชร์ iOS แบบเนทีฟ โปรดใช้:

// Example content. Replace with content from your app.
FBSDKShareLinkContent *content = [[FBSDKShareLinkContent alloc] init];
content.contentURL = [NSURL URLWithString:@"https://developers.facebook.com"];

FBSDKShareDialog *dialog = [[FBSDKShareDialog alloc] init];
dialog.fromViewController = self;
dialog.content = content;
dialog.mode = FBSDKShareDialogModeShareSheet;
[dialog show];

โปรดทราบว่าต้องมี .fromViewController หากต้องการแสดงชีทการแชร์

คุณสมบัติเพิ่มเติม

เมื่อคุณใช้กล่องการแชร์ Facebook คุณจะมีตัวเลือกเพิ่มเติมที่ไม่สามารถใช้งานได้เมื่อคุณแชร์โดยการใช้ API

แฮชแท็ก

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

ต่อไปนี้คือตัวอย่างของการเพิ่มแฮชแท็กไปยังการแชร์ลิงก์

FBSDKShareLinkContent *content = [[FBSDKShareLinkContent alloc] init];
content.contentURL = [NSURL URLWithString:@"https://developers.facebook.com"];
content.hashtag = [FBSDKHashtag hashtagWithString:@"#MadeWithHackbook"];

การแชร์คำพูดอ้างอิง

คุณสามารถอนุญาตให้ผู้ใช้ไฮไลท์ข้อความให้ปรากฏเป็นคำพูดอ้างอิงไปกับลิงก์ที่แชร์ได้ หรือคุณสามารถกำหนดคำพูดอ้างอิงล่วงหน้า ตัวอย่างเช่น ข้อความไฮไลท์ในบทความให้ปรากฏพร้อมลิงก์ที่แชร์ได้ ไม่ว่าในกรณีใดๆ คำพูดอ้างอิงจะปรากฏในช่องของตนซึ่งแยกจากความคิดเห็นของผู้ใช้

FBSDKShareLinkContent *content = [[FBSDKShareLinkContent alloc] init];
content.contentURL = [@"https://developers.facebook.com/products/sharing"];
content.quote = @"Learn quick and simple ways for people to share content from your app or website to Facebook.";

หัวข้อขั้นสูง

คุณสามารถใช้ ลิงก์ที่ไปยังแอพ เพื่อเชื่อมโยงกลับไปที่แอพจากโพสต์บน Facebook ที่เผยแพร่จากแอพของคุณได้

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

อินเทอร์เฟซแบบกำหนดเอง

หากต้องการใช้อินเทอร์เฟซของคุณเองในการแชร์ คุณจะต้อง:

การเรียก API กราฟให้โพสต์ลิงก์ลงใน Facebook มีดังนี้:

[FBSDKShareAPI shareWithContent:content delegate:nil];

การแชร์ข้อมูล Open Graph

ข้อมูล Open Graph ช่วยให้ผู้ใช้แชร์เนื้อหาที่จัดโครงสร้างไว้อย่างดีผ่าน API ที่จัดประเภทไว้ชัดเจนซึ่งระบุโดยการดำเนินการและอ็อบเจ็กต์ Open Graph

ข้อมูลที่แชร์จะเชื่อมโยงกลับไปยังแอพของคุณหรือเพจ App Store ของแอพ

ดูเพิ่มเติมเกี่ยวกับวิธีเพิ่มข้อมูลที่กำหนดเองลงในแอพได้ใน ข้อมูล Open Graph ใน iOS

สร้างเนื้อหาที่จะแชร์สำหรับการดำเนินการ Open Graph ลงในโมเดล FBSDKShareOpenGraphContent โปรดดูรายการแอตทริบิวต์ทั้งหมดในข้อมูลอ้างอิง FBSDKShareOpenGraphContent

NSDictionary *properties = @{
  @"og:type": @"fitness.course",
  @"og:title": @"Sample Course",
  @"og:description": @"This is a sample course.",
  @"fitness:duration:value": @100,
  @"fitness:duration:units": @"s",
  @"fitness:distance:value": @12,
  @"fitness:distance:units": @"km",
  @"fitness:speed:value": @5,
  @"fitness:speed:units": @"m/s",
};
FBSDKShareOpenGraphObject *object = [FBSDKShareOpenGraphObject objectWithProperties:properties];
FBSDKShareOpenGraphAction *action = [[FBSDKShareOpenGraphAction alloc] init];
action.actionType = @"fitness.runs";
[action setObject:object forKey:@"fitness:course"];
FBSDKShareOpenGraphContent *content = [[FBSDKShareOpenGraphContent alloc] init];
content.action = action;
content.previewPropertyName = @"fitness:course";

โปรแกรมจำลองและการทดสอบ iOS

หากกำลังใช้โปรแกรมจำลองเพื่อทดสอบการแชร์ในแอพพลิเคชั่น คุณจะเห็นข้อผิดพลาดถ้าคุณพยายามแชร์วิดีโอ รูปภาพ หรือการดำเนินการ Open Graph นั่นเป็นเพราะคุณต้องติดตั้ง Facebook สำหรับ iOS ซึ่งมีกล่องการแชร์ ทั้งนี้ เราไม่สนับสนุนกล่องการแชร์นี้ในโปรแกรมจำลอง

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