All posts
iOS

Log in with Twitter

Paweł Sternik

Paweł Sternik

Currently, most mobile applications have the option to login by social networks. In this post we will focus on solution using Twitter platform. We will try to create simple login using Parse backend service which provides support for the Twitter API.

The first step is to create accounts for application on Twitter and Parse. So, visit Twitter Developer Site and configure an application’s profile. But if you don’t have an account on Twitter, you have to sign up. Next you will add our new application on Twitter Application Manager. Click the button “Create New App”, and you will be redirected to this site:

Zrzut ekranu 2015-12-15 o 13.16.04

You should fill empty places like name, description, website and callback URL. After this operation you will be granted the access to your web app where you will find requirements informations for registering an app on Parse. So, it’s perfect moment to visit Parse website. Create an account and log in. On main website you can see a button with the title “Create a new App” – below dashboard label. Please click this button. After that new application panel should appear.

Zrzut ekranu 2015-12-16 o 09.53.16

Please fill a new application name field and press “Create” button. Now you have access to management panel of your application backend structure and architecture. Next press “Core” option on application panel and “Settings” on web site navigation bar. Finally, choose “Authentication” on sidebar menu. You can enable and disable various authentication types for your application and provide additional settings for login methods, which will limit and help secure your application. At the bottom of the page you should find section related to Twitter platform. So, we go back to Twitter application management page and choose our app. On section Details or Keys and Access Tokens you should find “Consumer Key” (Api Key) easily. Copy and paste data to field on Parse website. Now you have established the connection between Twitter application and Parse backend.

After creating relevant online accounts we should get going and play with code. Run Xcode and choose Create new Xcode project / Single View Application, fill name of application and uncheck unnecessary boxes like Include Unit Tests and Include UI Tests – we won’t use them in this project.

Zrzut ekranu 2015-12-16 o 11.18.04

After the initial setup, press Next button and choose place to save project folder. I created Swift project with Xcode in version 7.2.

An important element of the project is CocoaPods. CocoaPods is a dependency manager for Swift and Objective-C Cocoa projects. It has over 10,000 libraries and can help you scale your projects elegantly. You can find very helpful and complete tutorial how to install and using pods on official website of CocoaPods. The Podfile looks like this:

So, this code requires little explanation. The first line specifies that CocoaPods integrates with your project via frameworks instead of static libraries. It’s required in Swift. You have to only add remaining frameworks to project in General settings – section Linked Frameworks and Libriaries.

Zrzut ekranu 2015-12-16 o 12.55.13

Next part of this tutorial is setting authentication data in AppDelegate file.

First, I set root view controller for the whole application with storyboard. ClientKey parameter you can find on Parse application website in section Settings / Keys and consumerSecret is on Twitter application page in section Keys and Access Tokens

Zrzut ekranu 2015-12-16 o 13.10.52 Zrzut ekranu 2015-12-16 o 14.06.05

It seems that we finished the part related with setting up connections, authentications and keys. Now, our main goal is to create a view which will allow us to fetch user data and connect with the backend. So, I created main controller with two buttons.

Simulator Screen Shot 16.12.2015, 14.50.50

The first method which we will check uses controller available from Parse library. That complete controller consist of required elements and buttons like Sign In, Sign Up, Facebook and Twitter button. Parse Controller is presented when button is touched with the same title which then calls “touch up inside” action. Implementation of the Parse Controller is pretty easy. Look at this:

First step is checking if singleton object of PFUser exists, because user which have current access tokens for session, signs in automatically. Next, I created object of PFLogInViewController and set necessary fields. An important part is setting up the delegate. Also, we should add the delegate in class’s definition. As a result we can handle all login cases.

So, with a few lines of code we have created complete login view like this:

PopUpViewController

In the end I would like to show you another simple option to create own Twitter login. In this case, we will use NSURLSession to send request to Twitter API and communicate with Parse to save our received data. First, I will show you a listings of code:

For nice and dynamic user interaction when user is waiting for response, I added custom activity indicator from MBProgressHUD library (available via CocoaPods). Next step is check access to Twitter username and finally we can create the request. Request is executed by asynchronous NSURLSession method with error handling. For method NSJSONSerialization.JSONObjectWithData which can throw error we have to implement the do – catch block. In this block I firstly find URL for avatar from Twitter and fetch image by NSData initialization method, but of course we need another object type for Parse. I have created a PFFile object using initializer with argument data. Finally I set value for current Parse user and run animation for new elements.

In conclusion Parse provides easy and complete support for Twitter authentication in our applications. Additionally documentation available on official Parse website is helpful and very clear. I hope I have shown you one of several solution to connect Twitter with your mobile applications. I encourage you to check the other possible solutions (e.g. Fabric SDK).

 

Newsletter

The post is created by Droids On Roids Team Member.
We would love to take care of your business.

Leave comment