The following documentation was deprecated. Current version is available at developers.xsolla.com
Back to Docs

Xsolla Login

Xsolla Login lets players log into any game using their social network accounts. Allowing them to start playing instantly and easily. In addition, Xsolla Login stores players’ payment data enabling convenient one-click purchases in future. Developers can completely customize Xsolla Login to make it appear as a part of their game.

Integration Guide

Getting Started

Register your app by emailing us at bizdev@xsolla.com

With the following info:

  • Site - The website to connect to Xsolla Login (e.g. http://mysite.com).

  • Domain - The website’s main domain name (e.g. mysite.com). If you have multiple domain names, specify all of them — they will all have the same projectID .

  • Supported authentication methods are::

    • Login/password,
    • SMS,
    • Social networks (Facebook, Twitter, Steam, Twitch, VK, Naver, etc),
    • i-PIN (BETA),
    • Multi-factor authentication (BETA),
    • Certificate (BETA)
    • Local social network authentication (BETA).

In the last case, let us know which social networks you want to use for authentication.

We’ll reply with your projectID and secretKey.

Authentication Widget

Using the example below, add a standard authentication widget to your project. Download the SCSS template here.

The default block width is 400 px; the height depends on the authentication options.

Example of a default design Example of a custom design Example of a custom design

Installing the Widget

To add an Xsolla Login widget to your game, follow these steps:

Step 1

Enable xl.min.js in the <head> tag:

<script src="https://static.xsolla.com/xsolla-login/1.1.1/xl.min.js"></script>

Step 2

Add the initialization code in the <body> tag:

<script type="text/javascript">
XL.init({
         projectId: '40db2ea4-5p47-11e6-a3ff-005056a0e04a',
         locale: 'en_US',
         onlyWidgets: true,
         redirectUrl: '<your redirect url>',
         fields: 'email'
     });
</script>
Name Type Description
projectId string App id. Required.
locale string User locale specified as <language code>_<country code>, where:
redirectUrl string URL to send the user to after authentication. Sent within a JWT token.
onlyWidgets boolean Initialize Xsolla Login for widgets only. 'True' by default.
preloader string Preloader to be shown while the widget is being loaded. Specify the element’s HTML code.
fields string Data to be requested from the user. Allowed value: 'email'. Required.

Step 3

Add a DIV element to contain the widget, give it a unique id, and add the widget initialization code after it.

<div id="xl_auth"></div>
<script type="text/javascript">
var element_id = 'xl_auth';
var options = {
    width: '200px',
    height: '200px'
};
XL.AuthWidget(element_id, options);
</script>
Name Type Description
element_id string Id of the authentication container element. Required.
options object Widget block settings.
options.width string Width of a block.
options.height string Height of a block.

Xsolla Login Server Side

How it Works

Callback URL

Redirects the user to this URL after authentication.

Successful Authentication

If the authentication is successful, we’ll redirect the user to your callback URL with the following parameters:

HTTP Request

GET https://callBackUrl.php?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOnRydWV9.TJVA95OrM7E2cBab30RMHrHDcEfxjoYZgeFONFh7HgQ

Parameter Type Description
token string JWT. You can decrypt it using the secret key.
is_linking boolean The user has linked an account.

Decrypted token (example)

{
  "exp": 1471071785,
  "iss": "https://login.xsolla.com",
  "iat": 1470985385,
  "id": "11111111",
  "name": "John Carter",
  "email": "john@example.com",
  "type": "social",
  "provider": "social_network",
  "xsolla_login_access_key": "s4dGNSPKinUxkSRI8rhPhZRElHj2yusqEeqgLIgn"
}
Parameter Type Description
exp string Token expiry date (Unix timestamp).
iss string JWT issuer.
iat string Creation date (Unix timestamp).
id string User id.
name string User’s full name.
email string User email.
type string Type of authentication. Can be "proxy" (authenticated via proxy) or "social" (login via a social network).
provider string Social network name. Can be one of the following: "vk," "facebook," "twitter," "steam," "baidu," "naver," "qq," "github," "microsoft," "linkedin," "google".
xsolla_login_access_key string Access key to call methods on behalf of the user.

Failed Authentication

If the authentication fails, we’ll redirect the user to your callback URL with the following parameters:

HTTP Request

GET https://callBackUrl.php?error=003-002&error_description=User+not+found&redirect_url=https://site.com/fail_url

Parameter Type Description
error string Error code group.
error_description string Error description.
redirect_url string Callback URL for the project.

Additional API Methods

If you already have users, you can use authentication via proxy. In this case, implement the following methods:

Xsolla Login calls the methods from https://login.xsolla.com/ and https://test-login.xsolla.com/

Login/Password Check

  • Type: POST
  • Content-type: application/json
  • Request body: {"username":"ХХХХ", "password":"ХХХХ"}
  • Success: {Ok 200}
  • Failure: {"error": {"code": "003-001", "description": "" }}

Signup

  • Type: POST
  • Content-type: application/json
  • Request body: {"username":"ХХХХ", "password":"ХХХХ", "email":"ХХХХ"}
  • Success: {Ok 200}
  • Failure: {error: {code: "003-003|004", description: "" }}

Password Reset

  • Type: POST
  • Content-type: application/json
  • Request body: {"email":"ХХХХ"}
  • Success: {Ok 200}
  • Failure: {"error": {"code": "003-002", "description": ""}}