Swift: Login to WordPress from your iOS App

Swift: Login to WordPress from your iOS App

This tutorial will cover a basic approach to logging into your WordPress site from your iOS using Swift. First, I’m going to start in Xcode by setting up our most basic of login app.

Check out the OAuth2 version of this tutorial

Create your project

What we’re using in this tutorial:

  • Xcode 7.2
  • Swift 2.1
  • Alamofire 3.1.4
  • SwiftyJSON 2.3.2

Fire up Xcode and create a new project. I named this project “Basic WordPress Login”, but you can name it whatever you want. Make sure to select Swift as your language.

create-new-project

Setting up the scenes

Next, we’ll set up the scenes. Drag a label and button onto the initial ViewController scene and set their respective constraints. I named my button “Proceed to Login”, and checked it hidden in the Attributes Inspector. I will explain this a little later once we start setting up the logic behind the app.

initial-veiwDrag another ViewController object onto the storyboard. Next, drag 2 textfields and another button onto the second View. Label the placeholders of each textfield username and password respectively. Name the Login and add the necessary constraints to each object.

login-view

View Controllers

Let’s attach the required view controllers to both scenes. On the Main.storyboard, select the initial view controller. On the right utilities pane (make sure it is visible), select the Identity Inspector and make sure it’s attached to the ViewController class.

viewcontroller-class

Go to File > New File and select Cocoa Touch Class. Next, name the view controller LoginViewController, make sure it’s a subclass of UIViewController and save.

create-login-viewcontroller

Now attach the LoginViewController class to the second scene on the Main.Storyboard. Again, select the scene and the Identity Inspector on the right utilities pane to accomplish this.

login-viewcontroller-class

Let’s create one more file. I call this the “Needs” file. It’s analogous to a config file, but this file will only contain a few lines. Go to File > New File and select Swift File. Name it and save it into your project. Navigate to the file and add the following line under import Foundation:

CocoaPods, Alamofire and SwiftyJSON

As mentioned in a previous tutorial, native handling of json is a pain. Again, we will be using SwiftyJSON to handle the response json objects. Alamofire will be used to make the remote request calls to your WordPress site. CocoaPods is what will be used to install Alamofire and SwiftyJSON into our projects. CocoaPods is a dependancy management tool that handles all your project’s external libraries. If you don’t have CocoaPods installed yet, check out the following CocoaPods beginning tutorial by Ray Wenderlich.

After installing CocoaPods, you are going to create a Podfile and save it inside your Xcode project. The Podfile contains a list of libraries used in the project. The Podfile is used by the CLI to install and update these libraries. Open your Podfile and add the following:

At the time this tutorial was written, the latest versions of Alamofire and SwiftyJSON are reflected above. Please replace the above version numbers with the latest versions if above version numbers are out of date.

Next, Quit Xcode and open the terminal and cd into your project’s directory. Run the following command:

After the installation is complete, you’ll notice an additional file named Basic WordPress Login.xcworkspace. From this point forward, you will be launching the project from this file.

So what’s going on here?

The way this setup will work is the initial view controller will send a request to your WordPress site to check if you are logged in, if not, the “Proceed to Login” button will appear prompting you to proceed to the login page. A more sophisticated approach would be to check the login status upon app launch and to display the login screen as the first view if you’re not logged in. Again, this is just a basic tutorial.

Username and password credentials are entered in the Login View Controller. If the login is successful, we will be rerouted back to the parent (initial view controller) with a welcome message awaiting us upon arrival. If the login failed, we will get alert messages telling us what it wrong. Simple enough, right?

Setting up the server side request handler

A little bit of code has to be added to the functions.php before your WordPress site can acknowledge and handle the request from your iOS app. Add the following to your functions.php:

You don’t have to add this to the functions.php, you can very well create a plugin from this snippet if you choose. Be aware that I am running PHP 5.6, so this object oriented approach might not be compatible with older versions of PHP. We’re only calling one method from the class check_ios_login. The rest of the logic is handled within the class. It should be noted that you only have to instantiate this class once.

The check_ios_login method checks for the check_login parameter in the $_POST request. The method is_the_user_logged_in is called and responds with json object that contains either user data if logged in, or a logged_in = 0. If the app receives a logged_in = 0 response, we are prompted to “Proceed to Login”. If the app receives user data, we will receive a “Welcome Back” message.

When user and password information is submitted from the login screen of our app, our WordPress site will receive the $_POST request and call the get_ios_login method to log us in.

Note that it’s imperative that you exit() after you call the json_encode function. Remember, the responses are being sent before any page output is rendered. If you don’t exit, the entire HTML output will be included in the response and the App will throw and error.

Back to Xcode

In the Needs.swift file, add your website url to the empty myWordPressSite constant. Select the Login Scene from the Main.storyboard, open the Identity Inspector and add LoginPopOverVC in the Storyboard ID field.

In the ViewController.swift file, add the following:

And in the LoginViewController.swift, add:

Now if you run the app, you should get the following:

  • Login I Must.

    Login I Must.

  • Logged in wrong I did.

    Logged in wrong I did.

  • Welcomed I am.

    Welcomed I am.

Important takeaways from this tutorial

Delegates

Delegation is the preferred method in Xcode to pass values and data from one view controller to the next. In the LoginViewController.swift file, right above the class you will see the LoginViewControllerDelegate protocol and it’s sendUser method required by view controllers receiving data from the LoginViewController class.

If you have been paying close attention, you will notice that I also applied that same pattern to the iOSWPLogin by way of iOSWPLoginInterface interface. This technique of writing cleaner, more scalable plugins for WordPress was proposed by Daniel Pataki.

Security

Now that you know the basics of logging into WordPress from an iOS app, DO NOT USE THE METHOD IN PRODUCTION. If you want to quell the App Transport Security error message that appears after logging out, you can add you localhost as an NSExceptionDomains in the Info.plist.

First and foremost you want your requests secured by SSL. Second, even though it wasn’t done in this tutorial, you NEVER want to store login information inside the app. I bring this up because you will soon learn that storing cookies in the headers to the app isn’t the most reliable method to staying logged in.

A much better approach would be to use OAuth with a refresh token. In the future, I will cover how to login to WordPress via OAuth and how to set up an OAuth server on your WordPress installation.

Git this Xcode project .