Unreal Engine 4 GameSparks Facebook Authentication

VERY IMPORTANT! This tutorial is only valid if you are using up to Unreal version 4.10. If you are using a more recent version, please ignore the details given here. An updated tutorial is being prepared and will be available very soon!

Introduction

GameSparks allows you to use social authentication to keep track of your players without registering them. This tutorial aims to get you started with Unreal Engine 4's Facebook online subsystem and using it to retrieve an authentication token which allows you to use GameSpark's social authentication.

Downloadables. You can download the assets that support this tutorial here.

Setting up your project

Unreal Setup

DefaultEngine.ini

First you need to configure your game for the Facebook online subsystem. For this you need to have a Facebook AppID which you can get from the Facebook developer page.

Refresh your visual studio project through the editor

After you include the modules into your project, refresh your C++ files through the Editor so the changes are recognized in your project. Failing to do this step will result in your "Online.h" and "OnlineSubsystemFacebook.h" not being recognized.

Facebook App Settings

In your Facebook settings advanced tab, flip the button to state that your app is a native one if you're developing or debugging on a desktop.

For Valid OAuth redirect URIs ensure that you add:

https://www.facebook.com/connect/login_success.html

That's all you need! Here's how we set up our App:

To use Facebook authentication with GameSparks, follow the tutorial to setup Unreal for GameSpark integration, here.

Facebook API Component

Header

This is the component which will expose the Online Subsystem API to the Blueprints. Exposing the API through a component allows us to use delegates comfortably and allows us to call the functions through GetGameMode->FBAPIComponent->Function from anywhere in BluePrint.

Unreal Engine Editor and Blueprint

Open your GameMode and add a GameSparks component and the FBAPI Component.

Follow the instructions for setting up GameSparks.

Drop a reference of the FBAPI component in the event graph and access its functions.

For the FBAPI Component you'll need an event or function which will call the C++ login function which takes a username and password parameters.

Click on the FBAPI component on the components list of your GameMode screen and in the details window add the 'On Auth Change' event. Connect the GameSparks Facebook Authentication Request node to the event, connecting the Auth token from the event to the access token slot in the GameSparks request node.

Design a way for your users to input their details or manually do so for testing.

We have attached uassets which show an example of this working with a UMG Widget interface.