Flutter open facebook link in facebook app android & ios

Question

In my app i have stored Facebook url's. I want to open them in facebook app not in browser. I tried using flutter_url_launcher package but it open the link in default browser ... What i want is to open the link directly into the facebook app . Can anyone suggest any solution or package to help me out of this situation?

Answer 1

I also used the solution from the link @ruelluna mentioned.

Per current version, the below code worked for me:

String fbProtocolUrl;
if (Platform.isIOS) {
  fbProtocolUrl = 'fb://profile/page_id';
} else {
  fbProtocolUrl = 'fb://page/page_id';
}

String fallbackUrl = 'https://www.facebook.com/page_name';

try {
  bool launched = await launch(fbProtocolUrl, forceSafariVC: false);

  if (!launched) {
    await launch(fallbackUrl, forceSafariVC: false);
  }
} catch (e) {
  await launch(fallbackUrl, forceSafariVC: false);
}

Also, make sure Info.plist file contains the following:

 <array> 
        <dict>
            <key>CFBundleURLSchemes</key>
            <array>
                <string>fb[your_page_id]</string>
            </array>
        </dict>
    </array>

You can take your_page_id from: https://findmyfbid.com/

Answer 2

My working function:

 void launchUrl2() async{
   var url = 'fb://facewebmodal/f?href=https://www.facebook.com/al.mamun.me12';
   if (await canLaunch(url)) {
     await launch( url, universalLinksOnly: true, );
   } else { throw 'There was a problem to open the url: $url'; }

 }

Answer 3

I struggled with this for a couple hours and found an updated solution.
First of all, if you add

<array> 
        <dict>
            <key>CFBundleURLSchemes</key>
            <array>
                <string>fb[your_page_id]</string>
            </array>
        </dict>
    </array>

To your Info.plist file as stated by @Al Manum, method canOpenUrl will always return true, even if Facebook app is not installed.
+1 to this answer for giving me the hint.

Add the following instead:

<key>LSApplicationQueriesSchemes</key>
<array>
    <string>fb</string>
</array>

The following code will open Facebook native app if installed on device, else it will open the browser

Future<void> _openFacebook() async {
    String fbProtocolUrl;
    if (Platform.isIOS) {
      fbProtocolUrl = 'fb://profile/{your-page-id}';
    } else {
      fbProtocolUrl = 'fb://page/{your-page-id}';
    }

    String fallbackUrl = 'https://www.facebook.com/{your-page-uri}';

    try {
      Uri fbBundleUri = Uri.parse(fbProtocolUrl);
      var canLaunchNatively = await canLaunchUrl(fbBundleUri);

      if (canLaunchNatively) {
        launchUrl(fbBundleUri);
      } else {
        await launchUrl(Uri.parse(fallbackUrl),
            mode: LaunchMode.externalApplication);
      }
    } catch (e, st) {
      // Handle this as you prefer
    }
  }

Tested on iOS 15.5, Android 11 and Flutter 3.

Answer 4

I used this approach:

  Future<bool> openInFacebook({
    required bool isIOS,
    required String linkSection,
  }) async {
    final fbProtocolUri = isIOS
        ? Uri(
            scheme: 'fb',
            host: 'profile',
            path: '/$linkSection',
          )
        : Uri(
            scheme: 'fb',
            host: 'page',
            path: '/$linkSection',
          );

    final fallbackUri = Uri(
      scheme: 'https',
      host: 'www.facebook.com',
      path: '/$linkSection',
    );

    return _launchUrlSafe(fbProtocolUri, fallback: fallbackUri);
  }

  Future<bool> _launchUrlSafe(
    Uri url, {
    Uri? fallback,
  }) async {
    var success = false;
    try {
      success = await launchUrl(url);
    } catch (e, st) {
      success = false;
    }
    if (!success) {
      try {
        if (fallback != null) {
          success = await launchUrl(fallback);
        }
      } catch (e, st) {
        success = false;
      }
    }
    return success;
  }

It's recommended to use launchUrl to check if the URI can be launched https://pub.dev/packages/url_launcher#checking-supported-schemes

Answer 5

I set Mode property to externalApplication then it worked fine

Future<void> _launchUrl(String url) async {
  try {
    if (!await launchUrl(Uri.parse(url), mode: LaunchMode.externalApplication)) {
      throw Exception('Could not launch');
    }
  } catch (e) {
    Fluttertoast.showToast(msg: "$e");
  }
}

Answer 6

added new one which uses the new launchUrl

onTap: () {
_launchSocial('fb://page/109225061600006', 'https://www.facebook.com/IAMZenju');
},

void _launchSocial(String url, String fallbackUrl) async {
    try {
      final Uri uri = Uri.parse(url);
      await launchUrl(uri, mode: LaunchMode.platformDefault);
    } catch (e) {
      final Uri fallbackUri = Uri.parse(fallbackUrl);
      await launchUrl(fallbackUri, mode: LaunchMode.externalApplication);
    }
  }

Answer 7

You can open it as web

final url =
      "web://$**Your_Profile_Page**";
  if (await UrlLauncher.canLaunch(url)) {
    await UrlLauncher.launch(url,forceSafariVC: false);
  } else {
    throw 'Could not launch $url';
  }