Como usar chamadas do Login Widget SDK API
Você pode trabalhar com as chamadas do Login Widget SDK API separadamente do widget de Login se quiser:
- use seu próprio design de widget
- implementar parcialmente o fluxo do widget de Login
Observação
Nem todas as chamadas de API oferecem suporte a esse cenário.
Inicialização de código
Para usar as chamadas do Login Widget SDK API sem um widget, conecte o seguinte código ao marcador <body>
:
Copy
1<script>
2const api = new XsollaLogin.Api({
3 projectId: 'someProjectId'
4});
5</script>
O código de inicialização ao usar um pacote-npm:
Copy
1import XsollaLogin from '@xsolla/login-sdk';
2const api = new XsollaLogin.Api({
3 projectId: 'someProjectId'
4});
Os seguintes parâmetros são passados no código de inicialização:
Parâmetro | Tipo | Descrição |
---|---|---|
projectId | string | ID do seu projeto Login na Conta de Distribuidor. Obrigatório. |
fullLocale | string | O idioma da interface e uma região no formato <language code>_<country code> , onde:
O parâmetro afeta a classificação das redes sociais pela frequência de uso na região especificada e também afeta o idioma usado para os e-mails enviados aos usuários. |
callbackUrl | string | O URL com o qual o servidor Xsolla Login funciona se o login ou o cadastro for bem-sucedido. |
emailTemplate | string | O nome do projeto pelo qual os e-mails são enviados aos usuários. |
payload | string | Dados adicionais que podem ser passados em um código. Esses dados são adicionados ao JWT de usuário após o login bem-sucedido. |
with_logout | boolean | Se os tokens anteriores devem ser revogados durante um novo login. false por padrão. |
clientId | string | ID do aplicativo cliente. Passado se a autenticação baseada no protocolo OAuth 2.0 for usada no aplicativo. |
scope | string | Informações adicionais sobre um usuário solicitadas pelo aplicativo. Passado se a autenticação com base no protocolo OAuth 2.0 for usada no aplicativo. Valores possíveis:
|
estado | string | Uma verificação de usuário adicional para evitar ataques CSRF, por exemplo. Deve ter mais de 8 caracteres. |
redirectUrl | string | O URL do usuário é redirecionado para após a confirmação da conta, login ou confirmação da redefinição de senha. |
disableConfirmByLink | boolean | Se a confirmação de autenticação sem senha por um link no e-mail quando os usuários fazem login sem uma senha por e-mail ou telefone deve ser desativada ou não. false por padrão. |
is_oauth2 | boolean | Se a autenticação baseada em protocolo OAuth 2.0 para usuários deve ser usada ou não. false por padrão. |
Chamadas de API
Você pode usar as seguintes chamadas do Login Widget SDK API sem um widget de Login:
- Cadastro de usuário por senha
- Login com senha
- Conformação de conta
- Autenticação sem senha
- Solicitação de campos adicionais sem senha
- Redefinição de senha
- Login único
Cadastro de usuário por senha
Chamada | Descrição | Parâmetros |
---|---|---|
api.signup(userInfo); | Cadastra um novo usuário. Os dados sobre o usuário são passados no objeto userInfo durante o cadastro. O token do usuário cadastrado é passado na resposta. |
|
Copy
1let result
2// Request
3api.signup({
4 userInfo: {
5 email: 'email@address.com',
6 fields: {
7 nickname: 'Johny'
8 },
9 password: 'password123',
10 username: 'John'
11 }
12}).then((res) => {
13 result = res;
14})
15
16// Response
17result === {
18 login_url: 'https://someurl.com?token=XXXXXXX'
19}
Login com senha
Chamada | Descrição | Parâmetros |
---|---|---|
api.login(credenciais); | Autentica um usuário com uma senha. Os dados necessários sobre o usuário para o login do usuário são passados no objeto credentials . O token do usuário autenticado é passado na resposta. |
|
Copy
1let result
2// Request
3api.login({
4 credentials: {
5 password: 'password123',
6 username: 'email@address.com'
7 }
8}).then((res) => {
9 result = res;
10})
11
12// Response
13result === {
14 login_url: 'https://someurl.com?token=XXXXXXX'
15}
16
17// Response with additional fields
18result === {
19 ask_fields: [{
20 confirmation_type: 'code' || 'link'
21 name: 'phone_number'
22 required: false
23 step: 0 // Displays the position of the field in the data retrieval queue.
24 type: 'phone'
25 validation: {} // Custom validation
26 }]
27 login_url: 'https://someurl.com?token=XXXXXXX',
28 token: 'sometoken'
29}
Confirmação de conta
Chamada | Descrição | Parâmetros |
---|---|---|
api.resendEmail(nome de usuário); | Envia um e-mail de confirmação de conta adicional. Para confirmar a conta, o usuário deve clicar no link no e-mail. O endereço de e-mail do usuário é passado no objeto username . O código padrão 204 é retornado na resposta. |
|
Copy
1let result
2// Request
3api.resendEmail({
4 username: 'email@address.com'
5}).then((res) => {
6 res.code === 204;
7})
Autenticação sem senha
Fluxo do usuário:- O usuário insere seu número de telefone ou endereço de e-mail. Dependendo das credenciais inseridas,
api.phoneGetCode
ouapi.emailGetCode
é chamado. - O servidor recebe os dados e envia um e-mail ou SMS com o código para o usuário. Se o parâmetro
disableConfirmByLink=true
, que desabilita a confirmação de login pelo link no e-mail, for passado ao inicializar o código, a chamadaapi.getConfirmCode
será usada para o redirecionamento automático do usuário após clicar no link. - A chamada
api.phoneGetCode
ouapi.emailGetCode
retorna o parâmetrooperation_id
usado para confirmar o número de telefone ou endereço de e-mail pela chamadaapi.loginWithPhoneCode
ouapi.loginWithEmailCode
. - Depois que o endereço de e-mail ou número de telefone for confirmado com êxito, o URL com o parâmetro
token
retornará. Ele é usado nas solicitações de dados adicionais sobre o usuário.
Chamada | Descrição | Parâmetros |
---|---|---|
api.phoneGetCode({ phone_number, link_url, isOauth2 }); | Envia um código de confirmação para o número de telefone. O parâmetro operation_id usado para confirmar o número de telefone é retornado na resposta. |
|
Copy
1let result
2// Request
3api.phoneGetCode({
4 phone_number: '+somenumber',
5 link_url: 'https://someurl.com',
6 isOauth2: true
7}).then((res) => {
8 result = res;
9})
10
11// Response
12result === {
13 operation_id: '2334j255fdf13d515fgd1'
14}
Chamada | Descrição | Parâmetros |
---|---|---|
api.phoneGetCode({ phone_number, link_url, isOauth2 }); | Envia um código de confirmação para o endereço de e-mail. O parâmetro operation_id usado para confirmar o endereço de e-mail é retornado na resposta. |
|
Copy
1let result
2// Request
3api.emailGetCode({
4 email: 'email@address.com',
5 link_url: 'https://someurl.com',
6 isOauth2: true
7}).then((res) => {
8 result = res;
9})
10
11// Response
12result === {
13 operation_id: '2334j255fdf13d515fgd1'
14}
Chamada | Descrição | Parâmetros |
---|---|---|
api.getConfirmCode({ cancelToken, login, operation_id }); | Obtém um código de confirmação para o redirecionamento automático de um usuário depois que ele clica no link. |
|
Copy
1let result
2// Request
3const axiosCancelToken = Axios.CancelToken.source();
4
5api.getConfirmCode({
6 cancelToken: axiosCancelToken,
7 login: '+somenumber' || 'email@address.com',
8 operation_id: '334j255fdf13d515fgd1'
9}).then((res) => {
10 result = res;
11})
12
13// Response
14result === {
15 code: 'string'
16}
17
18// If the waiting time has elapsed, returns:
19result === {
20 error: {
21 code: '010-050',
22 description: 'Deadline exceeded.'
23 }
24}
25
26// If you no longer need to wait for verification through the link you can close the request waiting period:
27axiosCancelToken.cancel();
Chamada | Descrição | Parâmetros |
---|---|---|
api.loginWithPhoneCode({ phone_number, code, operation_id, isOauth2 }); | Confirma o número de telefone. O URL com o parâmetro token retorna na resposta. Ele é usado nas solicitações de dados adicionais sobre o usuário. |
|
Copy
1let result
2// Request
3api.loginWithPhoneCode({
4 phone_number: 'email@address.com',
5 code: '3423',
6 operation_id: '334j255fdf13d515fgd1',
7 isOauth2: true
8}).then((res) => {
9 result = res;
10})
11
12// Response
13result === {
14 login_url: 'https://someurl.com?token=XXXXXXX'
15}
16
17
18// Response with additional fields
19result === {
20 ask_fields: [{
21 confirmation_type: 'code' || 'link'
22 name: 'email'
23 required: false
24 step: 0 // Displays the position of the field in the data retrieval queue.
25 type: 'email'
26 validation: {} // Custom validation
27 }]
28 login_url: 'https://someurl.com?token=XXXXXXX',
29 token: 'sometoken'
30}
Chamada | Descrição | Parâmetros |
---|---|---|
api.loginWithEmailCode({ email, code, operation_id, isOauth2 }); | Confirma o endereço de e-mail. O URL com o parâmetro token retorna na resposta. Ele é usado nas solicitações de dados adicionais sobre o usuário. |
|
Copy
1let result
2// Request
3api.loginWithEmailCode({
4 email: 'email@address.com',
5 code: '3423',
6 operation_id: '334j255fdf13d515fgd1',
7 isOauth2: true
8}).then((res) => {
9 result = res;
10})
11
12// Response
13result === {
14 login_url: 'https://someurl.com?token=XXXXXXX'
15}
16
17// Response with additional fields
18result === {
19 ask_fields: [{
20 confirmation_type: 'code' || 'link'
21 name: 'phone_number'
22 required: false
23 step: 0 // Displays the position of the field in the data retrieval queue.
24 type: 'phone'
25 validation: {} // Custom validation
26 }]
27 login_url: 'https://someurl.com?token=XXXXXXX',
28 token: 'sometoken'
29}
Solicitações de campos adicionais sem senha
Fluxo de usuário:- Após a autenticação bem-sucedida de um usuário, a chamada
api.loginWithEmailCode
ouapi.loginWithPhoneCode
retorna uma matriz de campos que você pode exibir em um aplicativo em um formulário separado e, adicionalmente, coletar o número de telefone e o endereço de email do usuário. Você também pode obter a lista de campos executando uma chamadaapi.getAskFields
. - O usuário insere um número de telefone ou endereço de e-mail. O
api.ask
é executado. - O servidor recebe os dados e envia um código de confirmação para um número de telefone ou endereço de e-mail. Se o parâmetro
disableConfirmByLink=true
, que desabilita a confirmação de login pelo link no e-mail, for passado ao inicializar o código, a chamadaapi.getConfirmCode
será usada para o redirecionamento automático do usuário após clicar no link. - A chamada
api.ask
retorna o parâmetrooperation_id
usado para confirmar o número de telefone ou endereço de e-mail pela chamadaapi.loginWithPhoneCode
ouapi.loginWithEmailCode
. - O URL usado para um redirecionamento de um usuário autenticado é retornado após a confirmação bem-sucedida dos dados.
Chamada | Descrição | Parâmetros |
---|---|---|
api.getAskFields(token); | Obtém a lista de campos para uma solicitação adicional. |
|
Copy
1let result
2// Request
3api.getAskFields({
4 token: 'sometoken'
5}).then((res) => {
6 result = res;
7})
8
9// Response
10result === [
11 {
12 confirmation_type: 'code' || 'link'
13 name: 'phone_number' || 'email'
14 required: false
15 step: 0 // Displays the position of the field in the data retrieval queue.
16 type: 'phone' || 'email'
17 validation: {} // Custom validation
18 }
19]
Chamada | Descrição | Parâmetros |
---|---|---|
api.ask({ fields, token, link_url }); | Envia dados adicionais sobre o usuário — um número de telefone ou endereço de e-mail. O parâmetro operation_id usado para confirmar o número de telefone ou endereço de e-mail especificado é retornado na resposta. Se a confirmação não for necessária, o URL com o parâmetro token usado para um redirecionamento de um usuário autenticado será retornado na resposta. |
|
Copy
1let result
2// Request
3api.ask({
4 fields: {
5 phone_number: '+somenumber'
6 },
7 link_url: 'https://someurl.com',
8 token: 'sometoken'
9}).then((res) => {
10 result = res;
11})
12
13// Response
14result === {
15 error: {
16 code: '003-014'
17 description: 'Confirm phone number.'
18 details: { operation_id: 'BPaBScLM44GesoOYSxT5I8QfgIrTSURd' }
19 }
20}
21
22// Response without confirmation
23result === {
24 redirect_url: '<login_url>?token=<token>'
25}
Exemplo de envio de um endereço de e-mail:
Copy
1let result
2// request
3api.ask({
4 fields: {
5 email: 'email@address.com'
6 },
7 link_url: 'https://someurl.com',
8 token: 'sometoken'
9}).then((res) => {
10 result = res;
11})
12
13// Response
14result === {
15 error: {
16 code: '003-011'
17 description: 'Confirm email.'
18 details: { operation_id: 'BPaBScLM44GesoOYSxT5I8QfgIrTSURd' }
19 }
20}
21
22// Response without confirmation
23result === {
24 redirect_url: '<login_url>?token=<token>'
25}
Chamada | Descrição | Parâmetros |
---|---|---|
api.getConfirmCode({ cancelToken, login, operation_id }); | Obtém o código de confirmação para um redirecionamento automático de um usuário depois de clicar no link. |
|
Copy
1let result
2// Request
3const axiosCancelToken = Axios.CancelToken.source();
4
5api.getConfirmCode({
6 cancelToken: axiosCancelToken,
7 login: '+somenumber' || 'email@address.com',
8 operation_id: '334j255fdf13d515fgd1'
9}).then((res) => {
10 result = res;
11})
12
13// Response
14result === {
15 code: 'string'
16}
17
18// If the waiting time has elapsed, returns:
19result === {
20 error: {
21 code: '010-050',
22 description: 'Deadline exceeded.'
23 }
24}
25
26// If you no longer need to wait for verification through the link you can close the request waiting period:
27axiosCancelToken.cancel();
Chamada | Descrição | Parâmetros |
---|---|---|
api.loginWithPhoneCode({ phone_number, code, operation_id, isOauth2 }); | Confirma o número de telefone. O URL com o parâmetro token retorna na resposta. Ele é usado nas solicitações de dados adicionais sobre o usuário. |
|
Copy
1let result
2// Request
3api.loginWithPhoneCode({
4 phone_number: 'email@address.com',
5 code: '3423',
6 operation_id: '334j255fdf13d515fgd1',
7 isOauth2: true
8}).then((res) => {
9 result = res;
10})
11
12// Response
13result === {
14 login_url: 'https://someurl.com?token=XXXXXXX'
15}
16
17
18// Response with additional fields
19result === {
20 ask_fields: [{
21 confirmation_type: 'code' || 'link'
22 name: 'email'
23 required: false
24 step: 0 // Displays the position of the field in the data retrieval queue.
25 type: 'email'
26 validation: {} // Custom validation
27 }]
28 login_url: 'https://someurl.com?token=XXXXXXX',
29 token: 'sometoken'
30}
Chamada | Descrição | Parâmetros |
---|---|---|
api.loginWithEmailCode({ email, code, operation_id, isOauth2 }); | Confirma o endereço de e-mail. O URL com o parâmetro token retorna na resposta. Ele é usado nas solicitações de dados adicionais sobre o usuário. |
|
Copy
1let result
2// Request
3api.loginWithEmailCode({
4 email: 'email@address.com',
5 code: '3423',
6 operation_id: '334j255fdf13d515fgd1',
7 isOauth2: true
8}).then((res) => {
9 result = res;
10})
11
12// Response
13result === {
14 login_url: 'https://someurl.com?token=XXXXXXX'
15}
16
17// Response with additional fields
18result === {
19 ask_fields: [{
20 confirmation_type: 'code' || 'link'
21 name: 'phone_number'
22 required: false
23 step: 0 // Displays the position of the field in the data retrieval queue.
24 type: 'phone'
25 validation: {} // Custom validation
26 }]
27 login_url: 'https://someurl.com?token=XXXXXXX',
28 token: 'sometoken'
29}
Redefinição de senha
Fluxo de usuário:- O aplicativo abre o formulário onde o usuário insere seu endereço de e-mail ou nome de usuário. A chamada
api.reset
é executada. - O servidor envia um e-mail de confirmação para o usuário.
- O usuário clica no link no e-mail e abre um formulário para uma nova senha.
- O usuário insere uma nova senha. A chamada
api.set
é executada.
Chamada | Descrição | Parâmetros |
---|---|---|
api.reset(nome de usuário); | Redefine a senha e confirma a ação. Para confirmar uma redefinição de senha, o usuário deve clicar no link no e-mail. O nome de usuário ou endereço de e-mail do usuário é passado no objeto username . O código 204 é retornado na resposta. |
|
Copy
1let result
2// Request
3api.reset({
4 username: 'John'
5}).then((res) => {
6 res.code === 204;
7})
Chamada | Descrição | Parâmetros |
---|---|---|
api.set({ new_password, reset_code, user_id }); | Define a nova senha e confirma a ação. Para confirmar uma nova senha, o usuário deve clicar no link no e-mail. O código 204 é retornado na resposta. |
|
Copy
1let result
2// Request
3api.set({
4 new_password: 'newpass',
5 reset_code: '3423',
6 user_id: '324324234'
7}).then((res) => {
8 res.code === 204;
9})
Acesso Único
Observação
Consulte as instruções sobre Single Sign-On para obter informações detalhadas.
Parâmetro | Tipo | Descrição |
---|---|---|
api.checkUserAuthSSO(); | Verifica se um usuário está autorizado por meio do Single Sign-On. Se for bem-sucedido, retorna um code único. |
Copy
1let result
2// Request
3api
4 .checkUserAuthSSO()
5 .then(res => {
6 result === res;
7 });
8
9result === {
10 code: "examplecode"
11}
Chamada | Descrição | Parâmetros |
---|---|---|
api.userAuthSSOWithRedirect(loginUrl); | Verifica se um usuário foi autorizado via Single Sign-On. Se for bem-sucedido, um usuário será redirecionado para o URL — loginUrl gerado, incluindo um código de autorização. |
|
Copy
1// Request
2api
3 .userAuthSSOWithRedirect(
4 loginUrl: 'some-redirect-url.com'
5 )
6 .then(res => {
7 res.code === 302;
8 });
Chamada | Descrição | Parâmetros |
---|---|---|
api.logout(token, sessão); | Efetua o logout de um usuário no sistema e exclui uma sessão de usuário de acordo com o parâmetro session . |
|
Copy
1// Request
2api
3 .logout(
4 token: 'exampleToken',
5 session: 'sso' | 'all'
6 )
7 .then(res => {
8 res.code === 204;
9 });
Parâmetro | Tipo | Descrição |
---|---|---|
api.clearSSO(); | Remove os arquivos cookie do Single Sign-on do dispositivo atual do usuário. O código 204 é retornado na resposta se a chamada for bem-sucedida. |
Copy
1// Request
2api
3 .clearSSO()
4 .then(() => {
5 // Success
6 });
Este artigo foi útil?
Obrigado pelo seu feedback!
Avaliaremos sua mensagem e a usaremos para melhorar sua experiência.Encontrou um erro de texto ou digitação? Selecione o texto e pressione Ctrl+Enter.