> ## Documentation Index
> Fetch the complete documentation index at: https://devdocs.xbox.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Início rápido de JavaScript para Native e Phaser

> Instale a biblioteca de cliente do PlayFab para JavaScript e faça sua primeira chamada à API do PlayFab em um navegador ou jogo Phaser para autenticar um jogador.

# Início rápido: biblioteca de cliente do PlayFab para JavaScript

Comece a usar a biblioteca de cliente do PlayFab para JavaScript para autenticar um jogador. Siga as etapas para instalar o pacote e experimentar o código de exemplo para tarefas básicas.

## Pré-requisitos

* Uma [conta de desenvolvedor do PlayFab](https://developer.playfab.com). Para obter informações sobre como criar um título e encontrar o TitleId, consulte o [Início rápido do Game Manager](/pt-BR/services/playfab/live-service-management/gamemanager/quickstart).

Este guia de início rápido funciona em qualquer sistema operacional capaz de executar um navegador web.

## Configuração do projeto JavaScript

Antes de chamar qualquer API do PlayFab, você precisa ter uma [conta de desenvolvedor do PlayFab](https://developer.playfab.com). Para obter informações sobre como criar um título e encontrar o TitleId, consulte o [Início rápido do Game Manager](/pt-BR/services/playfab/live-service-management/gamemanager/quickstart).

Sistema operacional: este guia funciona em qualquer sistema operacional capaz de executar um navegador web.

Para configurar um novo projeto, crie uma nova pasta com dois arquivos de texto vazios:

* `PlayFabGettingStarted.html`
* `PlayFabGettingStarted.js`

Pronto: instalação do PlayFab concluída!

## Exemplos de código

Este guia fornece as etapas mínimas para você fazer sua primeira chamada à API do PlayFab. A confirmação é exibida na página web. Para obter mais informações sobre parâmetros e valores de retorno, recomendamos usar primeiro o [modelo do Postman](/pt-BR/services/playfab/sdks/postman/postman-quickstart).

### Autenticar o cliente

No seu editor de texto favorito, atualize o conteúdo de `PlayFabGettingStarted.html` da seguinte forma:

```html theme={null}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PlayFab JavaScript Unit Tests</title>
    <script type="text/javascript" src="https://download.playfab.com/PlayFabClientApi.js"></script>
    <script type="text/javascript" src="PlayFabGettingStarted.js"></script>
</head>
<body>
    PlayFab Getting Started Guide<br />
    TitleID: <input type="text" id="titleId" value="144"><br />
    CustomID: <input type="text" id="customId" value="GettingStartedGuide"><br />
    <input type="button" value="Call LoginWithCustomID" onclick="DoExampleLoginWithCustomID()"><br />
    Result:<br />
    <textarea id="resultOutput" cols="60" rows="5"></textarea><br />
</body>
</html>
```

No seu editor de texto favorito, atualize o conteúdo de `PlayFabGettingStarted.js` da seguinte forma:

```javascript theme={null}
function DoExampleLoginWithCustomID(){
    PlayFab.settings.titleId = document.getElementById("titleId").value;
    var loginRequest = {
        // Currently, you need to look up the required and optional keys for this object in the API reference for LoginWithCustomID. See the Request Headers and Request Body.
        TitleId: PlayFab.settings.titleId,
        CustomId: document.getElementById("customId").value,
        CreateAccount: true
    };

    PlayFabClientSDK.LoginWithCustomID(loginRequest, LoginCallback);
}

// callback functions take two parameters: result and error
// see callback functions in JavaScript if unclear
var LoginCallback = function (result, error) {
    if (result !== null) {
        document.getElementById("resultOutput").innerHTML = "Congratulations, you made your first successful API call!";
    } else if (error !== null) {
        document.getElementById("resultOutput").innerHTML =
            "Something went wrong with your first API call.\n" +
            "Here's some debug information:\n" +
            PlayFab.GenerateErrorReport(error);
    }
}
```

Para consultar o formato correto do objeto loginRequest neste exemplo, consulte a referência da API de [LoginWithCustomID](xref:titleid.playfabapi.com.client.authentication.loginwithcustomid).

## Executar o código

1. Abra `PlayFabGettingStarted.html` no seu navegador favorito.
2. Selecione o botão **Call LoginWithCustomID**.
3. Você verá o seguinte texto na seção Result:
   "Congratulations, you made your first successful API call!"

Agora você pode começar a fazer outras chamadas à API e a criar seu jogo.

Para obter uma lista de todas as chamadas disponíveis da API de cliente, consulte a documentação de [Referências de API do PlayFab](/pt-BR/services/playfab/api-references).

## Desconstruir o código

Esta seção explica em detalhes cada parte do código.

O arquivo HTML tem algumas linhas importantes:

```html theme={null}
<script type="text/javascript" src="https://download.playfab.com/PlayFabClientApi.js"></script>
```

Esta linha carrega o Client-SDK diretamente da CDN do PlayFab. Nossa CDN sempre hospeda a versão mais recente do PlayFabSDK. Pode ser mais seguro baixar os arquivos e usar uma versão fixa: [SDK de JavaScript do PlayFab](https://aka.ms/playfabjavascriptsdkdownload)

```html theme={null}
<script type="text/javascript" src="PlayFabGettingStarted.js"></script>
...
<input type="button" value="Call LoginWithCustomID" onclick="DoExampleLoginWithCustomID()"><br />
```

Como você pode ver acima, `PlayFabGettingStarted.js` contém a função `DoExampleLoginWithCustomID`. Essas linhas vinculam nosso arquivo js à nossa página web e invocam a função `DoExampleLoginWithCustomID` nesse script. Todo o resto é apenas GUI.

As funções em `PlayFabClientSDK` recebem o nome das requisições HTTP correspondentes. Por exemplo, a requisição HTTP correspondente à função `LoginWithCustomID` também se chama "LoginWithCustomID". O Request Body é empacotado no objeto de requisição JavaScript como chaves e valores. O Session Ticket será salvo a partir do logon, portanto as chamadas de cliente não precisam incorporar o Session Ticket do Request Header.

* Análise linha por linha de `PlayFabGettingStarted.js`
  * `PlayFab.settings.titleId = "xxxx";`
    * Todo desenvolvedor do PlayFab cria um título no Game Manager. Ao publicar seu jogo, você precisa codificar esse titleId no jogo. Isso permite que o cliente saiba como acessar os dados corretos no PlayFab. Para a maioria dos usuários, basta considerar isso uma etapa obrigatória para que o PlayFab funcione.

  * `var loginRequest = { TitleId: PlayFab.settings.titleId, CustomId: "GettingStartedGuide", CreateAccount: true };`
    * A maioria dos métodos da API do PlayFab exige parâmetros de entrada, e esses parâmetros são empacotados em um objeto de requisição
    * Cada método da API exige um objeto de requisição exclusivo, com uma combinação de parâmetros opcionais e obrigatórios
      * Para `LoginWithCustomID`, há um parâmetro obrigatório `CustomId`, que identifica um jogador de forma exclusiva, e `CreateAccount`, que permite a criação de uma nova conta com essa chamada. `TitleId` é outro parâmetro obrigatório em JavaScript e precisa corresponder a `PlayFab.settings.titleId`.
      * Para obter informações sobre onde encontrar o `TitleId`, consulte o [Início rápido do Game Manager](/pt-BR/services/playfab/live-service-management/gamemanager/quickstart).

  * Neste caso, `TitleId`,  `customId` e `CreateAccount` vêm do Request Body de `LoginWithCustomID`. Os campos do Request Body são incluídos como chaves e valores no objeto de requisição. O Session Ticket no Request Header será salvo a partir do logon, portanto o SessionTicket não é incluído no objeto de requisição.

  * `PlayFabClientSDK.LoginWithCustomID(loginRequest, LoginCallback);`
    * Isso inicia a requisição assíncrona para `LoginWithCustomID`, que chamará `LoginCallback` quando a chamada à API for concluída.
    * Para o logon, a maioria dos desenvolvedores vai querer usar um método de logon mais adequado.
      * Consulte a [documentação de logon do PlayFab](xref:titleid.playfabapi.com.client.authentication) para obter uma lista de todos os métodos de logon e parâmetros de entrada. As opções comuns são:
        * [LoginWithAndroidDeviceID](xref:titleid.playfabapi.com.client.authentication.loginwithandroiddeviceid)
        * [LoginWithIOSDeviceID](xref:titleid.playfabapi.com.client.authentication.loginwithiosdeviceid)
        * [LoginWithEmailAddress](xref:titleid.playfabapi.com.client.authentication.loginwithemailaddress)

  * Se você é novo em JavaScript, recomendamos ler sobre funções de callback.

  * `LoginCallback` contém dois parâmetros: result, error
    * Em caso de sucesso, error será null e o objeto result conterá as informações solicitadas, de acordo com a API chamada.
    * Este result contém algumas informações básicas sobre o jogador, mas, para a maioria dos usuários, o logon é simplesmente uma etapa obrigatória antes de chamar outras APIs.

  * Se error não for `null`, sua chamada à API falhou.

## Solução de problemas

* As chamadas à API podem falhar por vários motivos, e você deve sempre tentar tratar a falha.
* O objeto de erro inclui o nome, o código e a mensagem do erro. Juntas, essas informações devem ser suficientes para diagnosticar o erro.
* Os códigos de erro globais dos métodos da API podem ser encontrados em [Códigos de erro globais dos métodos da API](/pt-BR/services/playfab/api-references/global-api-method-error-codes) do PlayFab.
* Por que as chamadas à API falham (em ordem de probabilidade)
  * PlayFabSettings.TitleId não está definido. Se o TitleId não estiver definido, nada funcionará.
  * Parâmetros da requisição. Se você não tiver fornecido as informações corretas ou obrigatórias para uma determinada chamada à API, ela falhará. Consulte `error.errorMessage, error.errorDetails` ou `error.GenerateErrorReport()` para obter mais informações.
  * Problema de conectividade do dispositivo. Celulares perdem e recuperam a conectividade constantemente, portanto qualquer chamada à API pode falhar aleatoriamente a qualquer momento e funcionar logo em seguida. Entrar em um túnel pode desconectar você completamente.
* Problema no servidor do PlayFab. Como em qualquer software, podem ocorrer problemas. Consulte nossas [notas de versão](/pt-BR/services/playfab/release-notes) para obter atualizações.
  * A internet não é 100% confiável. Às vezes, a mensagem é corrompida ou não chega ao servidor do PlayFab.
* Se você estiver com dificuldades para depurar um problema e as informações do erro não forem suficientes, visite nossos [fóruns](https://community.playfab.com/index.html).

## Próximas etapas

Este início rápido mostra um procedimento simplificado para autenticar um usuário. Para obter informações adicionais sobre autenticação de usuários, consulte [Noções básicas e práticas recomendadas de logon](/pt-BR/services/playfab/identity/player-identity/login/login-basics-best-practices).

Boa programação!


## Related topics

- [Início rápido de Java para Native e Android Studio](/pt-BR/services/playfab/sdks/java/quickstart.md)
- [SDK de JavaScript](/pt-BR/services/playfab/sdks/javascript/index.md)
- [Início rápido do CloudScript](/pt-BR/services/playfab/live-service-management/service-gateway/automation/cloudscript/quickstart.md)
- [Linguagens compatíveis com o PlayFab](/pt-BR/services/playfab/sdks/languages/index.md)
- [Início rápido Android](/pt-BR/services/playfab/sdks/c/quickstart-android.md)