在 Ionic 4 的应用程序中打开 facebook 链接在 iOS 中不工作（在 Android 中工作）答案

【问题标题】：Open facebook link in app from Ionic 4 not working in iOS (works in Android)在 Ionic 4 的应用程序中打开 facebook 链接在 iOS 中不工作（在 Android 中工作）
【发布时间】：2019-12-30 11:09:18
【问题描述】：

附加的代码适用于 Android 上的 facebook 和 instagram 以及 iOS 上的 instagram，但是当它在 iOS 上打开 facebook 应用程序时，它只是打开到我的提要而不是预期的链接位置。

任何想法为什么这不起作用？我需要更改以下内容吗？

我正在使用以下代码生成并打开此链接：

fb://facewebmodal/f?href=https://www.facebook.com/AtlasQueenstown

编辑：我也试过：

fb://profile/AtlasQueenstown
fb://page/AtlasQueenstown

模板：

<p *ngIf="partner.deal.link" class="deal-link-text" 
    (click)="openAppUrl('facebook', 'AtlasQueenstown')">CHECK OUT {{partner.name}}</p>

TS：

openAppUrl(app: string, name: string) {
    switch (app) {
        case 'facebook':
            this.launchApp('fb://', 'com.facebook.katana', 'fb://facewebmodal/f?href=https://www.facebook.com/' + name, 'https://www.facebook.com/' + name);
            break;
        case 'instagram':
            this.launchApp('instagram://', 'com.instagram.android', 'instagram://user?username=' + name, 'https://www.instagram.com/' + name);
            break;
        case 'twitter':
            this.launchApp('twitter://', 'com.twitter.android', 'twitter://user?screen_name=' + name, 'https://twitter.com/' + name);
            break;
        default:
            break;
      }
  }

private launchApp(iosApp: string, androidApp: string, appUrl: string, webUrl: string) {
    let app: string;
    // check if the platform is ios or android, else open the web url
    if (this.platform.is('ios')) {
      app = iosApp;
    } else if (this.platform.is('android')) {
      app = androidApp;
    } else {
      const browser: InAppBrowserObject = this.inAppBrowser.create(webUrl, '_system');
      return;
    }
    this.appAvailability.check(app).then(
        () => {
            // success callback, the app exists and we can open it
            console.log('success');
            console.log(appUrl);
            const browser: InAppBrowserObject = this.inAppBrowser.create(appUrl, '_system');
        },
        () => {
            console.log('fail');
            console.log(webUrl);
            // error callback, the app does not exist, open regular web url instead
            const browser: InAppBrowserObject = this.inAppBrowser.create(webUrl, '_system');
        }
    );
}

info.plist：

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

【问题讨论】：

你试过Capacitor的App插件吗？
啊，我没有意识到电容器有办法做到这一点。我确实快速浏览了一下，但没有发布它在“应用程序”下。下次我一定会用这个。原来我的问题是 facebook 已经更新了 url 代码（或任何它们被称为的）。

标签： ios facebook ionic-framework capacitor

【解决方案1】：

让它工作，不要使用名称使用 id。你可以在这里得到这个： https://findmyfbid.com/

安卓：

fb://profile/' + id

iOS：

fb://page/' + id


 openAppUrl(app: string, name: string, id?: string) {
    switch (app) {
        case 'facebook':
            this.launchApp(
              'fb://', 'com.facebook.katana',
              'fb://profile/' + id,
              'fb://page/' + id,
              'https://www.facebook.com/' + name);
            break;
        case 'instagram':
            this.launchApp(
              'instagram://',
              'com.instagram.android',
              'instagram://user?username=' + name,
              'instagram://user?username=' + name,
              'https://www.instagram.com/' + name);
            break;
        case 'twitter':
            this.launchApp(
              'twitter://', 'com.twitter.android',
              'twitter://user?screen_name=' + name,
              'twitter://user?screen_name=' + name,
              'https://twitter.com/' + name);
            break;
        default:
            break;
      }
  }

private launchApp(iosApp: string, androidApp: string, appUrlIOS: string, appUrlAndroid: string, webUrl: string) {
    let app: string;
    let appUrl: string;
    // check if the platform is ios or android, else open the web url
    if (this.platform.is('ios')) {
      app = iosApp;
      appUrl = appUrlIOS;
    } else if (this.platform.is('android')) {
      app = androidApp;
      appUrl = appUrlAndroid;
    } else {
      const browser: InAppBrowserObject = this.inAppBrowser.create(webUrl, '_system');
      return;
    }
    this.appAvailability.check(app).then(
        () => {
            // success callback, the app exists and we can open it
            const browser: InAppBrowserObject = this.inAppBrowser.create(appUrl, '_system');
        },
        () => {
            // error callback, the app does not exist, open regular web url instead
            const browser: InAppBrowserObject = this.inAppBrowser.create(webUrl, '_system');
        }
    );
}

【讨论】：