أحداث Open Graph في iOS

باستخدام Open Graph، يمكن للأشخاص مشاركة الأحداث من تطبيقك إلى فيسبوك من خلال واجهة API منسقة ومحددة النوع بدقة.

عندما يتفاعل الأشخاص مع هذه الأحداث، يمكنهم الانتقال إلى تطبيقك أو إلى صفحة متجر التطبيقات لتطبيقك إذا كان تطبيقك غير مثبت لديهم. وهذا من شأنه أن يعزز التفاعل والتوزيع في تطبيقك.

هناك طريقتان لنشر حدث Open Graph:

المتطلبات الأساسية

حتى يتمكن تطبيقك من نشر أحداث Open Graph، ستحتاج إلى ما يلي:

  • الحصول على معرف تطبيق فيسبوك وتكوينه بشكل صحيح وربطه بتطبيق iOS الخاص بك
  • إضافة Facebook SDK لنظام iOS إلى مشروعك
  • إضافة معرف فيسبوك واسم العرض ومخطط عنوان url إلى ملف .plist الخاص بتطبيقك

لمزيد من المعلومات حول بيئات التطوير ومعرفات التطبيقات، راجع iOS - بدء الاستخدام.

إنشاء أحداث Open Graph

تتألف أحداث Open Graph من أفعال أو إجراءات وأسماء والمعروفة باسم كائنات. لإنشاء حدث، يجب تحديد إجراء وكائن لمحتوى تطبيقك.

يمكن أن يكون الإجراء والكائن من بين الإجراءات والكائنات المتنوعة سابقة الإعداد التي يوفرها فيسبوك، أو للحصول على المزيد من حالات الاستخدام المتقدمة، يمكن تحديدهما على نحو خاص.

الإجراءات

راجع استخدام الإجراءات للحصول على قائمة بالإجراءات المتاحة لك وتعرف على طريقة نشرها.

الكائنات

يتم تحديد الكائنات عن طريق إضافة ترميز Open Graph في صفحة الويب التي تستضيف المحتوى. يمكن التعرف على جميع عروض فيسبوك الخاصة بالكائنات المحدد مسبقًا في قسم مرجع Open Graph.

مراجعة التطبيق

حتى تتمكن من نشر الأحداث بالنيابة عن الأشخاص الذين يستخدمون تطبيقك، ستحتاج إلى تقديمها للمراجعة.

النشر باستخدام مربع الحوار مشاركة

يتيح مربع الحوار مشاركة للأشخاص إمكانية نشر الأحداث من تطبيقك دون الحاجة إلى تسجيل دخول فيسبوك أو الحصول على إذن publish_actions.

وللقيام بذلك، يستخدم مربع الحوار مشاركة التبديل السريع بين التطبيقات للوصول إلى تطبيق فيسبوك لنظام iOS الأصلي المثبت على الجهاز. وبمجرد نشر التطبيق، يعود عنصر التحكم إلى تطبيقك.

وفيما يلي نموذج لحدث يتناول "قراءة أحد الكتب":

قم بإنشاء كائن بنوع الكائن books.book، ثم قم بتعيين الخصائص في هذا الكائن.

// Create an object
NSDictionary *properties = @{
  @"og:type": @"books.book",
  @"og:title": @"A Game of Thrones",
  @"og:description": @"In the frozen wastes to the north of Winterfell, sinister and supernatural forces are mustering.",
  @"books:isbn": @"0-553-57340-3",
};
FBSDKShareOpenGraphObject *object = [FBSDKShareOpenGraphObject objectWithProperties:properties];

قم بعد ذلك بإنشاء إجراء وربط الكائن بالإجراء.

// Create an action
FBSDKShareOpenGraphAction *action = [[FBSDKShareOpenGraphAction alloc] init];
action.actionType = @"books.reads";
[action setObject:object forKey:@"books:book"];

وأخيرًا، قم بإنشاء نموذج محتوى للتعبير عن حدث Open Graph.

// Create the content
FBSDKShareOpenGraphContent *content = [[FBSDKShareOpenGraphContent alloc] init];
content.action = action;
content.previewPropertyName = @"books:book";

يجب أن تكون جميع أنواع الإجراءات والكائنات في الرمز البرمجي بأحرف صغيرة.

إظهار مربع الحوار مشاركة

يعرض مربع الحوار مشاركة باستخدام طريقة الفئة showFromViewController:withContent:delegate: في FBSDKShareDialog أو عن طريق بناء مثيل له واستدعاء show.

[FBSDKShareDialog showFromViewController:viewController
                             withContent:content
                                delegate:nil];

أدوات المشاركة البديلة المضمنة

في الإصدارات السابقة من SDK لنظام iOS، كان يجب أن يتحقق التطبيق من وجود تطبيق فيسبوك أصلي مثبت حتى يتمكن من فتح مربع الحوار مشاركة. إذا لم يكن التطبيق مثبتًا، يجب أن تقوم بإدخال الرمز البرمجي لاستدعاء مربع حوار احتياطي.

أما الآن فيتم من خلال SDK التحقق تلقائيًا من وجود تطبيق فيسبوك أصلي. وفي حالة عدم تثبيته، يتم تشغيل مربع الحوار مشاركة على الويب كبديل.

تحقق من توفر مربع الحوار مشاركة باستخدام canShow في المثيلات. يمكن التأكد من إجراء عملية التحقق من صحة المحتوى باستخدام validateWithError:.

FBSDKShareDialog *shareDialog = [[FBSDKShareDialog alloc] init];
shareDialog.fromViewController = viewController;
shareDialog.shareContent = content;
if (![shareDialog canShow]) {
  // update the app UI accordingly
}
NSError *error;
if (![shareDialog validateWithError:&error]) {
  // check the error for explanation of invalid content
}

إضافة صور

يمكنك أيضًا إضافة صور إلى حدث Open Graph الخاص بك. ويمكن أن تكون الصورة أحد ما يلي:

  • صورة مستضافة يوفرها تطبيقك في مكان ما على الويب
  • صورة محلية ملتقطة بواسطة مالك الجهاز.

في هذا المثال، يمكن للأشخاص الذين يستخدمون تطبيقك تحديد صورة من معرض الصور لديهم باستخدام UIImagePickerController.

وللقيام بذلك، اطلب من الشخص اختيار صورة من منتقي الصور، ثم:

  • انقل الرمز البرمجي المستخدم في النشر على فيسبوك إلى الطريقة imagePickerController:didFinishPickingMediaWithInfo:، والتي سيتم استدعاؤها بمجرد انتهاء الشخص من اختيار صورة.

  • قم بإنشاء FBSDKSharePhoto model للتعبير عن الصورة.

  • وأضف الصورة إلى إجراء Open Graph. للقيام بذلك، ستحتاج إلى تعديل الرمز البرمجي ليصبح بالشكل التالي:

// When the person is done picking the image
- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info
{
  // Construct an FBSDKSharePhoto
  FBSDKSharePhoto *photo = [[FBSDKSharePhoto alloc] init];
  photo.image = info[UIImagePickerControllerOriginalImage];
  // Optionally set user generated to YES only if this image was created by the user
  // You must get approval for this capability in your app's Open Graph configuration
  // photo.userGenerated = YES;

  // Create an object
  NSDictionary *properties = @{
    @"og:type": @"books.book",
    @"og:title": @"A Game of Thrones",
    @"og:description": @"In the frozen wastes to the north of Winterfell, sinister and supernatural forces are mustering.",
    @"books:isbn": @"0-553-57340-3",
  };
  FBSDKShareOpenGraphObject *object = [FBSDKShareOpenGraphObject objectWithProperties:properties];

  // Create an action
  FBSDKShareOpenGraphAction *action = [[FBSDKShareOpenGraphAction alloc] init];
  action.actionType = @"books.reads";
  [action setObject:object forKey:@"books:book"];

  // Add the photo to the action. Actions
  // can take an array of images.
  [action setArray:@[photo] forKey:@"image"];

  // Create the content
  FBSDKShareOpenGraphContent *content = [[FBSDKShareOpenGraphContent alloc] init];
  content.action = action;
  content.previewPropertyName = @"books:book";

  [FBSDKShareDialog showFromViewController:viewController
                               withContent:content
                                  delegate:nil];
}

يمكن القيام بعدة أمور منها التقاط الصور مباشرة بواسطة الكاميرا. ويمكن أيضًا إرفاق عدد من الصور بإجراء، والتي سيتم اعتبار كل منها على أنها FBSDKSharePhoto في مصفوفة الصور.

ويبلغ الحد الأدنى لدقة صورة SDK 480 × 480 بيكسل، في حين يبلغ الحد الأقصى لملف الصورة 12 ميجابايت. رمز الخطأ للصور التي تقل أو تزيد عن حدود الحجم هو 102.

إمكانات إضافية

تتطلب الإمكانات الإضافية مراجعة التطبيق والموافقة عليها حتى يتمكن الأشخاص من استخدامها في النشر. اطلع على الإرشادات الخاصة بالموافقة في هذه الوثيقة التي تسلط الضوء على عملية تقديم التطبيق.

يمكن الإشارة إلى أماكن وأشخاص مثل:

// Tag one or multiple people using their ids
content.peopleIDs = @[PEOPLE_IDS];

// Tag a place using the place's id
content.placeID = @"141887372509674"; // Facebook Seattle

موضوعات متقدمة

واجهة مخصصة

لاستخدام واجهتك الخاصة للمشاركة، يجب القيام بما يلي:

فيما يلي عملية استدعاء Graph API التي يستخدمها تطبيقك في نشر رابط على فيسبوك:

[FBSDKShareAPI shareWithContent:content delegate:nil];

عند تشغيل هذا الرمز البرمجي في تطبيقك، يمكن التعرف على الكائن الذي ينتج باستخدام متصفح الكائنات. تذكر أن هذا الكائن ملك الشخص الذي قام بإنشائه، وحتى تتمكن من رؤية الكائن الخاص بك ستحتاج إلى اختيار اسم الشخص في "مالك الكائن" في القائمة العلوية للكائن المطلوب عرضه:

من الميزات القوية لمشاركة أحداث Open Graph من تطبيقك هو أنه يمكنك استخدام روابط التطبيق في توجيه الأشخاص إلى تطبيقك الأصلي عند تفاعلهم مع الحدث في آخر الأخبار.

يمكن التعرف على المزيد حول تنفيذ الروابط العميقة من خلال الاطلاع على دليل روابط التطبيق لنظام iOS.

كائنات Open Graph المعقدة

يجب فصل كائنات Open Graph المعقدة التي تتضمن خصائص موروثة أو مصفوفات قيم بعلامة النقطتين (:) أو رموز الفهرسة بدلاً من الكائنات المتداخلة في قاموس JSON. وهذا يعني أنه يجب أن يكون قاموس JSON الذي يحتوي على خصائص Open Graph بتنسيق ثابت.

على سبيل المثال، إذا كان يتوفر نوع Open Graph بخاصية تسمى 'checkpoints (نقاط التحقق)' وتمثل مصفوفة خصائص GeoPoint، يمكن استخدام قاموس الخصائص التالي في تمرير عملية تهيئة FBSDKShareOpenGraphObject:

@"og:type": @"app-namespace:tour",
@"og:title": @"Example tour",
@"og:description": @"Some description lorem ipsum dolor",
@"app-namespace:start_point:latitude": @(48.85831),
@"app-namespace:start_point:longitude": @(2.29465),
@"app-namespace:end_point:latitude": @(45.85831),
@"app-namespace:end_point:longitude": @(2.29465),
@"app-namespace:checkpoints[0]:latitude": @(48.85831),
@"app-namespace:checkpoints[0]:longitude": @(2.29465),
@"app-namespace:checkpoints[1]:latitude": @(47.85831),
@"app-namespace:checkpoints[1]:longitude": @(2.29465),
@"app-namespace:distance": @(20)