virtualprodigy/ionic_ios_launch_social_apps.md

## ionic_ios_launch_social_apps.md

      
    Raw
  

              ionic_ios_launch_social_apps.md
            
          
    Creating a simple gist for launching Facebook, Twitter, and LinkedIn using the Ionic IAB(In App Browser). This gist is inspired by the fix found here
I created a config.xml edit-config  tag to handle updating your info.plist for fresh platform installs. (If you run into an issue with it, please let me know)
Type Script Code
private openTwitter(username: string) {  
     this.launchExternalApp('twitter://', 'com.twitter.android', 'twitter://user?screen_name=', 'https://twitter.com/', username);  
  }  
  
 private openLinkedIn(username: string){  
     this.launchExternalApp('linkedin://', 'com.linkedin.android','linkedin://', 'https://www.linkedin.com/', username);  
  
  }  
  
 /**  
 * Facebook's app has a ton of security. If the app fails to launch the FB app when it's installed on the device please refer to these posts. * https://developers.facebook.com/docs/ios/ios9 * http://www.ionichelper.com/2017/05/06/ionic-native-error-canopenurl-failed-for-url/ * * I have created `<edit-config file="*-Info.plist" mode="merge" target="LSApplicationQueriesSchemes">` in config.xml to handle updating the plist when a new platform is install. * Please verify that your plist is up to date. You'll need to right click the plist file xcode and view it as source, these values are hidden * @param username  
 */  openFacebook(username: string) {  
     this.launchExternalApp('fb://profile', 'com.facebook.katana', 'fb://profile/', 'https://www.facebook.com/', username);  
  }  
  
 launchExternalApp(iosSchemaName: string, androidPackageName: string, appUrl: string, httpUrl: string, username: string) {  
  let app: string;  
  if (this.platform.is("ios"))  {  
         app = iosSchemaName;  
  } else if (this.platform.is("android")) {  
         app = androidPackageName;  
       if(app === this.linkedInPackageName){ //linkedIn's sdk is not well maintained. Android must use linkedin://profile/ not linkedin://in/  to open the native app
            appUrl = "linkedin://profile/";
            if(username.indexOf("/") > 0){
                username = username.substr(username.lastIndexOf("/"), username.length)
            }
        }
  } else {  
         let browser = new InAppBrowser(httpUrl + username, '_system');  
  return;  
  }  
  
  AppAvailability.check(app).then(() => { // success callback  
  let browser = new InAppBrowser(appUrl + username, '_system');  
  console.log("app launch", appUrl + username);  
  },  
  () => { // error callback  
  let browser = new InAppBrowser(httpUrl + username, '_system');  
  console.log("url launch", httpUrl + username);  
  }  
     );  
  }

Confix.xml
Currently broken: Cordova can't handle adding tags to the config.xml that aren't in the pick list on xCode's UI.

Open Support Ticket

Add the following to your config.xml. If you already have an existing platform then you'll need to manual edit your iOS plist file.
<edit-config file="*-Info.plist" mode="merge" target="LSApplicationQueriesSchemes">

<string>fbapi</string>

<string>fbapi20130214</string>

<string>fbapi20130410</string>

<string>fbapi20130702</string>

<string>fbapi20131010</string>

<string>fbapi20131219</string>

<string>fbapi20140410</string>

<string>fbapi20140116</string>

<string>fbapi20150313</string>

<string>fbapi20150629</string>

<string>fbapi20160328</string>

<string>fbauth</string>

<string>fbauth2</string>

<string>fb-messenger-api20140430</string>

<string>fbapi</string>

<string>fb-messenger-share-api</string>

<string>fbauth2</string>

<string>fbshareextension</string>

<string>fb-messenger-platform-20150128</string>

<string>fb-messenger-platform-20150218</string>

<string>fb-messenger-platform-20150305</string>

<string>fb</string>

<string>twitter</string>

<string>linkedin</string>

</edit-config>

Potential Errors


If you receive this error canOpenURL: failed for URL: "linkedin://" - error: "This app is not allowed to query for scheme linkedin" please try the following

Please verify that your plist is up to date. You'll need to right click the plist file xCode and view it as source; these values are hidden. It should at least contain

< string>fb< /string>
< string>twitter< /string>
< string>linkedin< /string>


Review https://developers.facebook.com/docs/ios/ios9


Review http://www.ionichelper.com/2017/05/06/ionic-native-error-canopenurl-failed-for-url/


*/