Search code examples
cordovaionic3hybrid-mobile-appdeep-linkingbranch.io

Branch matrix shorten Url not fetch og:url facebook share debug


I have recently build an application and I am using branch IO for sharing and tracking the users activities for product share and user's event track. The basic config I have done to create the branch universal object as:

Code Sample:

let branchConfig = {
    canonicalIdentifier: product/details/12345, 
    canonicalUrl : "https://example.com/product/details/12345",
    title : "Some title text ",
    contentDescription : "desc of product",
    contentImageUrl : "https://example.com/product.product/image/12345",  
    contentIndexingMode: 'private',
    contentMetadata : {
        createdBy : "user_id", 
        creation_time : Date.now(),
        deeplinkType  : "Custom data"
    }
};
Branch.createBranchUniversalObject(branchConfig)
.then((initbranch) => {
    analytics = { 
        channel  : "Unknown",
        feature  : "sharing",
        campaign : "Marketing",
        stage    : '',
        tags     : ['some text and more'],
        type     : 2
    };
    let properties = {
        $fallback_url: "https://example.com/product/details/12345",
        $desktop_url: "https://example.com/product/details/12345",
        $android_url: android_play_store_url, 
        $ios_url: ios_app_store_url, 
        $ipad_url : ios_app_store_url,
        $og_image_url: "https://example.com/product.product/image/12345",
        $og_title : "Some title text ",
        $og_description : "desc of product",
        $always_deeplink: true,
        $deeplink_path: "product/details/12345"
        $ios_passive_deepview : "default_template",
        $android_passive_deepview : "default_template",
        $match_duration: 7200,
        $canonical_url : "https://example.com/product/details/12345",
        $og_url : "https://example.com/product/details/12345",
        $uri_redirect_mode : 1
    };
    return initbranch.generateShortUrl(analyticsOptions, properties);
})
.then((result) => {
    Promise.resolve(result.url);
})
.catch((err) => {
    console.log(err);
});

The above code returns me a shorten url to share. But when I debug the url with facebook sharing debug, it tells og:url is not found. But on webpage the og:title, og:image, og:description, og:url all are mentioned. Other meta tags like image, title,description are being fetched but og:url is missing.

My Ionic info

cli packages: (/usr/local/lib/node_modules)

   @ionic/cli-utils  : 1.18.0
   ionic (Ionic CLI) : 3.18.0

global packages:

   cordova (Cordova CLI) : 7.1.0 
local packages:

   @ionic/app-scripts : 1.3.12
   Cordova Platforms  : android 6.3.0 ios 4.5.4
   Ionic Framework    : ionic-angular 3.1.1
System:

   ios-deploy : 1.9.2 
   ios-sim    : 5.0.13 
   Node       : v9.2.1
   npm        : 3.10.10 
   OS         : macOS High Sierra
   Xcode      : Xcode 9.1 Build version 9B55 

Plugins Installed

branch-cordova-sdk 2.6.22 "branch-cordova-sdk"
com.darktalker.cordova.screenshot 0.1.5 "Screenshot"
cordova-plugin-admobpro 2.30.1 "AdMob Plugin Pro"
cordova-plugin-camera 2.4.1 "Camera"
cordova-plugin-compat 1.2.0 "Compat"
cordova-plugin-extension 1.5.4 "Cordova Plugin Extension"
cordova-plugin-facebook4 1.9.1 "Facebook Connect"
cordova-plugin-file 5.0.0 "File"
cordova-plugin-file-opener2 2.0.19 "File Opener2"
cordova-plugin-file-transfer 1.7.0 "File Transfer"
cordova-plugin-firebase 0.1.25 "Google Firebase Plugin"
cordova-plugin-inappbrowser 1.7.2 "InAppBrowser"
cordova-plugin-network-information 1.3.4 "Network Information"
cordova-plugin-splashscreen 4.1.0 "Splashscreen"
cordova-plugin-statusbar 2.4.1 "StatusBar"
cordova-plugin-whitelist 1.3.3 "Whitelist"
cordova-plugin-wkwebview-engine` 1.1.6 "Cordova WKWebView Engine"
cordova-plugin-x-socialsharing 5.2.1 "SocialSharing"
cordova-sqlite-storage 2.2.0 "Cordova sqlite storage plugin"
es6-promise-plugin 4.1.0 "Promise"
ionic-plugin-keyboard 2.2.1 "Keyboard"
phonegap-plugin-barcodescanner 7.0.2 "BarcodeScanner"

Please help why facebook sharing debug is not getting og:url. Because of this the url is getting blocked by facebook or marked as spam. Or if i am missing some thing please guide me to get the actual context.

Thank You :)


Solution

  • I fixed this issue by modifying some context. If we use $fallback_url, the facebook crawel fetch details from the fallback_url which holds a branch session Id.

    And the url mismatch in this scenario. As I am defining all respective url types like desktop, ios, android, etc so no need of fallback Url. I commented out the section

    $fallback_url: "https://example.com/product/details/12345"

    It worked.

    I debugged the shorten url on https://developers.facebook.com/tools/debug/og/object/ and https://developers.facebook.com/tools/debug/sharing.

    Both returned me the true data.