Set up auth with Facebook Login in our iOS app

We are now going to cloud-enable our mobile app by adding Facebook metdata to our info.plist, AWS Mobile SDK dependencies, integrating AWSMobileClient for auth, and then implement the auth UI provided by the mobile SDK.

Add Facebook metadata to your Xcode project info.plist:

Set up AWS Mobile SDK dependencies (Cocoapods)

In this example, I’m going to use Cocoapods for dependency management as this is currently the recommended way to integrate AWS SDK into an iOS project. More info on Cocoapods. If you don’t already have pods in your app, you can simply run a $ pod init and it’ll create a fresh Podfile for you. Once you have a Podfile, add the following dependencies to that file.

$ pod init

In your Podfile, add the following dependencies to that file.

Pull the SDK libraries into your project:

$ pod install --repo-update

Integrate the awsconfiguration.json file into your iOS project

When using the AWS Amplify CLI to provision backend resources, it produces a file called awsconfiguration.json

in the root of your iOS Xcode project. This file contains a description of the resources that you can access via your app and is updated (synced) with your project anytime a resource is added, updated, or deleted by the Amplify Toolchain. This auto-update of the configuration file is one of the great benefits of using the Amplify CLI to provision AWS resources from your local mobile development environment.

You only need to add the awsconfiguration.json file to your Xcode project just once. You can do this by dragging it to your Finder in the Xcode project organizer.

You will be prompted if you want to copy the file. UNCHECK THE COPY ITEMS BOX. The AWS Amplify CLI updates this file when things change. If you check the Destination box, then your project may not receive the updates if copied. If you uncheck the box, this file is updated whenever you modify the project resources via the Amplify CLI.

Initialize the AWSMobileClient in your AppDelegate

There are three (3) snippets of code you’ll add to your AppDelegate for integrating with the AWSMobileClient. I’ve outlined each step visually in the image below.

In the AppDelegate.swift file of your iOS project:

1. Add import AWSMobileClient statement
2. Add the new open URL function with AWSMobileClient intercept
3. Add AWSMobileClient singleton to the didFinishLaunching

We are done with the AppDelegate. Let’s move onto the ViewController.

Implement your sign-up/sign-in and Facebook UI

In your root UIViewController or related screen that you want users to sign-up or sign-in, add the following code referenced in the image below:

1. Add the imports from line 2–3

2. Add showSignIn() call to bottom of your viewDidLoad() as shown on line 11

3. Add the new function showSignIn() from line 14–27 to your view controller.

Warning. A UINavigationController is required: The auth UI as part of the AWS Mobile SDK and it requires that your app have a UINavigationController.

To add a UINavigationController to your app, if one does not exist:

Add a UINavigationController to your iOS app: From your Xcode project, select the ViewController in Storyboard then select menu options:

Editor->Embed In -> Navigation Controller.

Build and run your app

You should see the AWS SDK pre-built sign-in UI for your app as the user is not initially authenticated. The iOS SDK provides a standard default UI that now allows the user to sign in via Facebook along with register (sign-up), trigger “forgot password” functionality, and of course sign-in capabilities built-in along with the default username/email and password fields.

Click on the Continue with Facebook button. The user is then redirected and asked to sign in with their Facebook credentials. Once authenticated, the UI dialog will disappear and you should now see your view controller screen.

At this point, the app user is authenticated through Facebook and the user now assumes the authenticated IAM role and is granted permissions associated with that role, however, that role still has an empty access policy. This is the same process we went through when the user authenticated with username/password via Cognito User Pools. This time, the user authenticated with Facebook as an identity provider for Cognito Identity Pool.

Final Thoughts

Amazon Cognito is the default choice for both authenticated and unauthenticated flows for all mobile apps connecting to AWS resources. If you don’t require a login or use any other identity provider, such as Facebook, use Cognito Federated Identities (Cognito Identity Pool).

For authenticated users via Facebook, the mobile SDK will pass (and act as the identity manager) the authenticated user token to your Cognito Identity Pool in exchange for temporary AWS credentials for that user to make calls to your AWS resources. User access is then defined by the IAM authenticated role. If the user does not authenticate, Cognito Identity Pool still grants AWS credentials and the user’s access is defined by the IAM unauthenticated role.

Time to move onto Google authentication!

Resources

AWS Amplify (using the Amplify CLI to cloud enable our app)

Amazon Cognito Identity Pool (used for federating basic auth and Facebook Login)