Twitter Authentication

Setup

Create a Twitter App

The first step in setting up your Twitter authentication integration is to create an app on Twitter.

Consumer Key & Secret

Now that you’ve got an app setup, you need to let us know about the Consumer Key (API key) and Consumer Secret (API secret). Both can be found in the Keys and Access Tokens tab.

App Implementation

Setup

Plugin Installation

The InAppBrowser plugin is used to login your users with Twitter authentication.

$ cordova plugin add cordova-plugin-inappbrowser --save

Injecting Auth and User

Import Auth and User from the Cloud Client and specify them as dependencies in your component constructor.

  • auth is a service that deals with user authentication.
  • user is a reference to the current user, whether that user is anonymous or authenticated.
import { Component } from '@angular/core';
import { Auth, User } from '@ionic/cloud-angular';

@Component( ... )
export class LoginPage {
  constructor(public auth: Auth, public user: User) {
    ...
  }
}

Specify ionic.cloud as a dependency for your module. This gives you access to $ionicAuth and $ionicUser.

  • $ionicAuth is a service that deals with user authentication.
  • $ionicUser is a reference to the current user, whether that user is anonymous or authenticated.
angular.module('myapp.controllers', ['ionic.cloud'])

.controller('MyCtrl', function($scope, $ionicAuth, $ionicUser) {
  ...
})

Login

this.auth.login('twitter').then( ... );
$ionicAuth.login('twitter').then( ... );

Logout

Logging out clears the current user context.

this.auth.logout();
$ionicAuth.logout();

Social Data

We store social data in user.social.twitter. Unlike your custom data which uses user.get() and user.set(), user.social.twitter is just an object with the following properties.

uid Twitter user ID
data Twitter data object
data.profile_picture Twitter profile picture
data.full_name The user’s full name
data.raw_data The data object straight from Twitter (see these docs

Examples:

const full_name = this.user.social.twitter.data.full_name;
const profile_picture = this.user.social.twitter.data.profile_picture;
const twitter_raw_data = this.user.social.twitter.data.raw_data;
var full_name = $ionicUser.social.twitter.data.full_name
var profile_picture = $ionicUser.social.twitter.data.profile_picture
var twitter_raw_data = $ionicUser.social.twitter.data.raw_data;

Services

    API

      General