Fluxo do usuário

1. O usuário acessa a Web Shop com a autenticação de ID de usuário configurada.
2. O usuário é autorizado na Web Shop de uma das seguintes maneiras:
   • O usuário insere seu ID no bloco Fast Login e clica no botão de login.
   • O usuário clica no botão de compra do item selecionado ou no botão de login na barra superior:
     1. Uma janela modal para inserir o ID de usuário ou fazer login por uma rede social é aberta.
     2. O usuário insere seu ID e clica em Continue ou clica no ícone de redes sociais para escolher uma rede social e concluir a autenticação na respectiva página da rede social.

3. O sistema confere se um usuário já existe no jogo. Se um usuário com esse ID ou conta social existir no jogo, o usuário é autorizado na Web Shop. Caso contrário, uma mensagem de erro é exibida.

Como obtê-lo

1. Do lado do seu aplicativo, implemente a manipulação do webhook de validação do usuário.

Ao receber um webhook, o aplicativo deve fazer o seguinte:

• Procurar um usuário por seu ID passado no webhook.
• Dependendo do resultado, enviar um dos seguintes códigos de status:
  • Código HTTP 200 com uma resposta do webhook se um usuário for encontrado
  • Código HTTP 404 se o ID do usuário não for encontrado
• Enviar atributos de usuário para personalização.

2. Abra seu projeto na Conta de Distribuidor e acesse a seção Storefronts > Websites.
3. No painel do site necessário, selecione Open Site Builder.
4. Vá para o bloco Login settings.

5. Selecione a opção ID do usuário.

6. Na lista suspensa, selecione Novo login.

7. Insira o URL para receber webhooks. Esse URL pode ser diferente do especificado em Project settings > Webhooks.

8. Configurar autorização via redes sociais já conectadas ao seu aplicativo (opcional):
   1. Abra seu projeto na Conta de Distribuidor e vá para a seção Login.
   2. Clique em Configurar na barra do site.
   3. Vá para o bloco Autenticação e selecione Login social.

1. 4. Para configurar uma rede social, vá para o cartão de rede social, clique no ícone ⚙ à direita do título e selecione Connect.

Um link profundo é um URL especial que direciona o usuário não só para a página principal de um aplicativo ou site como também diretamente a uma seção, página ou ação específica.

Links profundos podem ser usados como um método de autenticação ao fazer login via ID de Usuário. Se o jogo for instalado no dispositivo móvel do usuário, ele será redirecionado ao jogo via link profundo para obter um token de autorização.

Fluxo do usuário

No aplicativo móvel

1. Um usuário não autorizado na Web Shop clica no botão de login ou no botão de compra. Uma janela modal para inserir o ID do usuário ou fazer login pelo jogo móvel é aberta.

2. O usuário clica no botão Log in via Jogo Móvel.
3. O usuário é redirecionado e então retorna automaticamente à Web Shop como um usuário autorizado.

Na versão desktop

1. Um usuário não autorizado na Web Shop clica no botão de login ou no botão de compra. Uma janela modal para inserir o ID do usuário ou fazer login na versão móvel do jogo usando um código QR é aberta.

2. O usuário digitaliza o código QR usando seu dispositivo móvel.
3. A Web Shop abre no dispositivo móvel do usuário.
4. O usuário é automaticamente redirecionado ao jogo e então retorna à Web Shop como um usuário autenticado.

Fluxo de interação de serviços

Como configurar

No lado do jogo

1. Nas configurações do aplicativo móvel do seu jogo, cadastre um esquema URL para abrir o jogo via link profundo:
   • em aplicativos Android — no arquivo AndroidManifest.xml
   • em aplicativos iOS — no arquivo Info.plist

Depois de cadastrar o esquema, quando o usuário se autenticar na Web Shop através do jogo, o jogo deve abrir no endereço especificado.

Exemplo de um esquema URL para cadastrar o jogo:
gamename://authorize?operationPayload=<VALUE>, onde:
• gamename — o nome do seu jogo que deve abrir em um dispositivo móvel para a autenticação do usuário.
• authorize — um exemplo de um nome de ação que deve ser desempenhada após o jogo gamename abrir. Use o nome da ação que corresponde às ações no sistema operacional do seu aplicativo.
• operationPayload=<VALUE> — um parâmetro adicional contendo informações para a geração de tokens durante a autenticação.

Exemplos:

• Cadastrando um esquema URL em aplicativos iOS
• Cadastrando um esquema URL em aplicativos Android

Copy

Full screen

Small screen

• xml

 1<key>CFBundleURLTypes</key>
 2  <array>
 3    <dict>
 4      <key>CFBundleTypeRole</key>
 5      <string>Editor</string>
 6      <key>CFBundleURLSchemes</key>
 7      <array>
 8        <string>gamename</string>
 9      </array>
10    </dict>
11  </array>

Copy

Full screen

Small screen

• xml

1<intent-filter>
2    <action android:name="android.intent.action.VIEW" />
3    <category android:name="android.intent.category.DEFAULT" />
4    <category android:name="android.intent.category.BROWSABLE" />
5    <data android:scheme="gamename" android:host="authorize" />
6</intent-filter>

2. Implemente a geração de um token de autorização no formato JWT usando o ID de usuário do jogo.

Exemplo de chamamento do método API de geração de token do usuário usando curl:

 1curl -X 'POST' \
 2'https://sb-user-id-service.xsolla.com/api/v1/user-id/token' \
 3-H 'accept: /' \
 4-H 'Content-Type: application/json' \
 5-d '{
 6 "loginId": "000001aa-001a-0ab0-00001-01a01a01a01a",
 7 "settings": {
 8   "projectId": 123456,
 9   "merchantId": 123456
10 },
11 "user": {
12   "id": "123",
13   "country": "US"
14 }
15 "operationPayload": "kosarb2NyrtIWaegJAH1f6P7XrBYPXYDya5coc_ZzcfiS_5o4QTUAL-CcGRC_Kv4CAtg"
16}'

Você receberá uma resposta como {token="JWT_TOKEN"}.

3. Adicione uma janela pop-up com uma notificação de autorização bem-sucedida (opcional).
4. Implemente a abertura do Web Shop no navegador usando o token de usuário obtido.

Exemplo de criação de um URL para abrir a Web Shop no navegador para um usuário autorizado:
• https:​//example.com/?token={token}, se você estiver usando um domínio personalizado
• https:​//example.xsolla.site/?token={token}, se você estiver usando um domínio da Xsolla

Onde {token} é o token de autorização do usuário.

Dentro do Site Builder

1. Abra seu projeto na Conta de Distribuidor e vá para a seção Storefronts > Websites.
2. Clique em Configure no cartão do seu site Web Shop com autenticação via ID de Usuário.
3. Vá para Login Settings e selecione a seção User ID.
4. Ative a opção Autorização de Link Profundo.

5. No campo Deeplink URL, insira o link para a autenticação do usuário.

6. Se você estiver usando o bloco Login Rápido no site:
   1. Vá para o bloco Login Rápido.
   2. Na seção Layout, ative a opção Código QR.

7. Para conferir a autorização, clique em Preview.
8. Para publicar o site, clique em Publish.

Um link profundo é um URL especial que direciona o usuário não só para a página principal de um aplicativo ou site como também diretamente a uma seção, página ou ação específica.

Links profundos permitem que o usuário autentique-se na Web Shop pelo jogo em um clique, em vez de passar pelo processo de autenticação via ID de Usuário ou Xsolla Login.

Se o jogo for instalado no dispositivo móvel do usuário, ele será redirecionado ao jogo via link profundo para obter um token de autorização.

Quando um link profundos é utilizado como método de autenticação primário, ele permite salvar os dados de pagamento, o que não é possível com a autenticação via ID de Usuário e link profundo. Neste caso, o link profundo apenas acelera a autenticação, mas não adiciona nenhum recurso novo.

Fluxo do usuário

No aplicativo móvel

1. Um usuário não autorizado na Web Shop clica no botão de login ou no botão de compra. Uma janela modal para fazer login pelo jogo móvel é aberta.

2. O usuário clica no botão Log in via Jogo Móvel.
3. O usuário é redirecionado e então retorna automaticamente à Web Shop como um usuário autorizado.

Na versão desktop

1. Um usuário não autorizado na Web Shop clica no botão de login ou no botão de compra. Uma janela modal para fazer login na versão móvel do jogo usando um código QR é aberta.

2. O usuário digitaliza o código QR usando seu dispositivo móvel.
3. A Web Shop abre no dispositivo móvel do usuário.
4. O usuário é automaticamente redirecionado ao jogo e então retorna à Web Shop como um usuário autenticado.

Fluxo de interação de serviços

Como configurar

No lado do jogo

1. Nas configurações do aplicativo móvel do seu jogo, cadastre um esquema URL para abrir o jogo via link profundo:
   • em aplicativos Android — no arquivo AndroidManifest.xml
   • em aplicativos iOS — no arquivo Info.plist

Depois de cadastrar o esquema, quando o usuário se autenticar na Web Shop através do jogo, o jogo deve abrir no endereço especificado.

Exemplo de um esquema URL para cadastrar o jogo:
gamename://authorize?operationPayload=<VALUE>, onde:
• gamename — o nome do seu jogo que deve abrir em um dispositivo móvel para a autenticação do usuário.
• authorize — um exemplo de um nome de ação que deve ser desempenhada após o jogo gamename abrir. Use o nome da ação que corresponde às ações no sistema operacional do seu aplicativo.
• operationPayload=<VALUE> — um parâmetro adicional contendo informações para a geração de tokens durante a autenticação.

Exemplos:

• Cadastrando um esquema URL em aplicativos iOS
• Cadastrando um esquema URL em aplicativos Android

Copy

Full screen

Small screen

• xml

 1<key>CFBundleURLTypes</key>
 2  <array>
 3    <dict>
 4      <key>CFBundleTypeRole</key>
 5      <string>Editor</string>
 6      <key>CFBundleURLSchemes</key>
 7      <array>
 8        <string>gamename</string>
 9      </array>
10    </dict>
11  </array>

Copy

Full screen

Small screen

• xml

1<intent-filter>
2    <action android:name="android.intent.action.VIEW" />
3    <category android:name="android.intent.category.DEFAULT" />
4    <category android:name="android.intent.category.BROWSABLE" />
5    <data android:scheme="gamename" android:host="authorize" />
6</intent-filter>

2. Implemente a geração de um token de autorização no formato JWT usando o ID de usuário do jogo.

Exemplo de chamamento do método API de geração de token do usuário usando curl:

 1curl -X 'POST' \
 2'https://sb-user-id-service.xsolla.com/api/v1/user-id/token' \
 3-H 'Accept: /' \
 4-H 'Content-Type: application/json' \
 5-d '{
 6 "loginId": "string",
 7 "settings": {
 8   "projectId": 0,
 9   "merchantId": 0
10 },
11 "user": {
12   "id": "string",
13   "country": "string",
14   "name": "string",
15   "picture": "string"
16 },
17 "operationPayload": "eyJ4c29sbGF1aWQiOiIzNzE5Nzc5NjU1MDE2Nzc2MzcifQ%3D%3D"
18}'

Você receberá uma resposta como {token="JWT_TOKEN"}.

3. Adicione uma janela pop-up com uma notificação de autorização bem-sucedida (opcional).
4. Implemente a abertura do Web Shop no navegador usando o token de usuário obtido.

Exemplo de criação de um URL para abrir a Web Shop no navegador para um usuário autorizado:
• https:​//example.com/?token={token}, se você estiver usando um domínio personalizado
• https:​//example.xsolla.site/?token={token}, se você estiver usando um domínio da Xsolla

Onde {token} é o token de autorização do usuário.

Dentro do Site Builder

1. Abra seu projeto na Conta de Distribuidor e vá para a seção Storefronts > Websites.
2. Clique em Configurar no cartão do seu site na Web Shop.
3. Vá para Configurações de Login e selecione a seção Link Profundo.

4. No campo Deeplink URL, insira o link para a autenticação do usuário.

5. Se você estiver usando o bloco Fast Login no site:
   1. Vá para o bloco Fast Login.
   2. Na seção Configurações do Bloco, ajuste a exibição do botão de login pelo código QR.

6. Para conferir a autorização, clique em Preview.
7. Para publicar o site, clique em Publish.

Fluxo do usuário

1. O usuário vai à Web Shop com a autenticação por Xsolla Login configurada.
2. O usuário clica no botão de compra do item selecionado, o botão de login na barra superior, ou o botão de login no bloco Fast Login.
3. Uma janela modal é aberta com os métodos de autorização configurados no Xsolla Login.

4. O usuário prossegue à autorização e insere dados adicionais se necessário.
5. O sistema confere se um usuário já existe no jogo. Se um usuário existir no jogo, o usuário é autorizado na Web Shop. Caso contrário, uma mensagem de erro é exibida.

Como obtê-lo

1. No Builder do seu site, vá para o bloco Login settings.

2. Selecione a opção de autorização Xsolla Login.
3. Na lista suspensa, selecione New Login.

4. Vá para as configurações do projeto Login na janela modal ou clique em Set up authentication method no bloco Xsolla Login.

5. Conecte o armazenamento de dados do usuário.

Dependendo do método de armazenamento de dados do usuário, diferentes funcionalidades do produto estão disponíveis para você (consulte a Comparação de opções de armazenamento de dados do usuário).

Armazenamento Xsolla

Se você quiser que o produto Login processe toda a lógica de autenticação, conecte-se ao armazenamento Xsolla. Você terá configurações mais flexíveis disponíveis a você.

Quando você cria um projeto Login, o armazenamento Xsolla é conectado por padrão, sem nenhuma etapa adicional sendo necessária para configurá-lo. Se você alterou o tipo de armazenamento padrão e precisa se reconectar ao armazenamento Xsolla, siga essas etapas:

1. Vá para o bloco User database e selecione a seção Storage.
2. Selecione o Xsolla storage e clique em Save changes.

Armazenamento PlayFab

Se você quiser usar a funcionalidade do PlayFab para trabalhar com usuários, conecte-se ao armazenamento PlayFab. Esse armazenamento salva os seguintes dados do usuário:

• nome de usuário
• endereço de e-mail do usuário
• senha do usuário
• campos de um formulário de registro estendido se o formulário estiver configurado

O armazenamento do PlayFab dá acesso aos seguintes recursos:

• cadastro do usuário
• autenticação por endereço de e-mail ou nome de usuário e senha
• autenticação via Twitch
• redefinição de senha do usuário
• bloqueio de usuários

Para conectar o armazenamento:

1. Vá para o bloco User database e selecione a seção Storage.
2. Selecione PlayFab.
3. No campo Title ID, insira o valor do mesmo campo da sua conta.
4. Clique em Save changes.

Armazenamento Firebase

Se você quiser usar a funcionalidade do Firebase para trabalhar com usuários, conecte-se ao armazenamento Firebase. Esse armazenamento salva os seguintes dados do usuário:

• nome de usuário
• endereço de e-mail do usuário
• senha do usuário
• campos de um formulário de registro estendido se o formulário estiver configurado

1. Vá para o bloco User database e selecione a seção Storage.
2. Selecione Firebase.
3. No campo API key, insira o valor do mesmo campo da sua conta Firebase.
4. Clique em Save changes.

Armazenamento personalizado

Se você usar seu próprio sistema de autorização e armazenar dados do usuário no lado do aplicativo, conecte-se ao armazenamento personalizado.

O armazenamento personalizado dá acesso aos seguintes recursos:

• cadastro de usuário
• autenticação por endereço de e-mail ou nome de usuário e senha autenticação
• autenticação sem senha por número telefônico
• autenticação via redes sociais
• redefinição de senha de usuário

1. Conecte o armazenamento personalizado.
2. Configure o processamento de solicitações do servidor Xsolla Login.

Conectar armazenamento personalizado

1. Vá para o bloco Banco de dados de usuários e selecione a seção Armazenamento.
2. Selecione Armazenamento personalizado.
3. Insira URLs para onde enviar as solicitações de API:
   • URL de verificação de usuário
   • URL de novo usuário
   • URL de redefinição de senha
   • URL de login sem senha
   • URL de login social
4. Clique em Salvar alterações.
5. Para os URLs definidos, implemente uma API que responderá da seguinte maneira:
   • HTTP 200 / HTTP 204 para solicitações bem-sucedidas. Se necessário, um JSON contendo dados adicionais do usuário pode ser colocado no corpo da resposta. Os dados passados são gravados em um JWT (o parâmetro partner_data).
   • Outros códigos de status HTTP para solicitações malsucedidas.

Configure o processamento de solicitações do servidor Xsolla Login

As solicitações do servidor Xsolla Login são enviadas para os URLs que você especificou na Conta de Distribuidor, com o cabeçalho Authorization: Bearer <JWT>. O JWT é assinado com a chave secreta do seu projeto.

Para processar uma solicitação:

1. Valide um JWT recebido.
2. Se a validação for bem-sucedida, decodifice o JWT e verifique se ele inclui as declarações da tabela abaixo. Localize e use uma biblioteca para a decodificação.

1{
2  "exp": 1573635020,
3  "iat": 1573634600,
4  "iss": "https://login.xsolla.com",
5  "request_type": "gateway_request",
6  "xsolla_login_project_id": "00000000-0000-0000-0000-000000000000"
7}

Fluxo do usuário

1. O usuário acessa a Web Shop pela primeira vez com uma autenticação configurada com ID de usuário vinculado.
2. O usuário clica no botão de compra do item selecionado, o botão de login na barra superior, ou o botão de login no bloco Fast Login.
3. Uma janela modal é aberta com os métodos de autorização configurados no Xsolla Login.
4. O usuário prossegue à autorização e insere dados adicionais, se necessário.

5. A janela modal do jogo para vincular o ID de usuário é aberta após a autorização bem-sucedida via Xsolla Login.

6. O sistema confere se o usuário existe. Se o usuário com o ID especificado existir no jogo, o usuário é autorizado na Web Shop. Caso contrário, é exibida uma mensagem de erro.

Como obter

1. Do lado do seu aplicativo, implemente a manipulação do webhook de validação do usuário.

Ao receber um webhook, o aplicativo deve fazer o seguinte:

• Procurar um usuário por seu ID passado no webhook.
• Dependendo do resultado, enviar um dos seguintes códigos de status:
  • Código HTTP 200 com uma resposta do webhook se um usuário for encontrado
  • Código HTTP 404 se o ID do usuário não for encontrado
• Enviar atributos de usuário para personalização.

2. Abra seu projeto na Conta de Distribuidor e acesse a seção Storefronts > Websites.
3. No painel do site necessário, selecione Open Site Builder.
4. Vá para o bloco Login settings.

5. Selecione a opção Login with linked user ID.
6. Na lista suspensa, selecione New Login ou um dos projetos criados.
7. Insira o URL para receber webhooks.

8. Você pode configurar qualquer método de autorização, mas para simplificar a experiência do usuário durante o estágio inicial de autenticação, recomendamos usar o login social:

   a. Abra seu projeto na Conta de Distribuidor e vá para a seção Players > Login.

   b. Selecione Configure no painel do projeto Login necessário.

   c. Acesse o bloco Authentication e selecione Social login.

   d. Para configurar uma rede social, vá para o cartão de rede social, clique no ícone ⚙ à direita do título e selecione Connect.