WebAPI de Autenticação de Usuário

Neste tópico vou mostrar como incorporar uma página do Latromi que exige autenticação dentro de outro site, usando um elemento <iframe>.

Atenticação

Para fazer a autenticação vamos usar uma API que fica hospeda junto ao site, no caminho “/Services/Authentication.svc”.

Se o site estiver publicado na Web (fora da rede interna), é altamente recomendável que este serviço seja consumido através de uma conexão segura (HTTPS).

A mérito de exemplo, vamos considerar que o endereço do site em que estamos trabalhando seja https://latromi.minha-empresa.com.br/web. Esta será a URL base.

Teste Rápido

Você pode testar a autenticação no seu site usando as páginas a seguir.

OBS.: Use o protocolo correspondente ao utilizado no seu site.

Consumindo a API com JavaScript

Abaixo um exemplo de autenticação usando JavaScript puro:

var baseURL = 'https://latromi.minha-empresa.com.br/web';
var authURL = baseURL + '/Services/Authentication.svc/rest/authenticate2';

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function () {
    if (this.readyState == 4) {
        if (this.status == 200) {
            var authResult = JSON.parse(this.responseText);
            if (authResult.status !== 100) {
                alert('Erro: ' + authResult.message);
            }
            else {
                alert('Autenticado: Token ' + authResult.authToken);
            }
        }
        else {
            alert('Erro: ' + (this.responseText || 'Abra o console do navegador para obter mais informações.'));
        }
    }
};
xhttp.open('POST', authURL, true);
xhttp.setRequestHeader("Content-Type", 'application/json; charset=utf-8');
xhttp.send(JSON.stringify({
    username: 'nome_de_usuario',
    password: 'senha'
}));

Formato de Retorno

Segue abaixo o formato do JSON retornado:

{
    "status": 100,
    "message": "Usuário autenticado.",
    "details": null,
    "authToken": "cePWMY8kb0OpdQT1.......=",
    "authType": 1,
    "userProfile": {
        "id": 1,
        "referenceCode": null,
        "username": "admin",
        "fullName": "Administrador",
        "emailAddress": "",
        "isActive": true,
        "isAdmin": true,
        "isIntegratedUser": false,
        "keepAliveEnabled": false,
        "documentType": 0,
        "documentNumber": "",
        "policies": null,
        "extendedProperties": [
            {
                "Key": "CampoLivre1",
                "Value": null
            },
            {
                "Key": "CampoLivre2",
                "Value": null
            },
            {
                "Key": "CampoLivre3",
                "Value": null
            },
            {
                "Key": "CampoLivre4",
                "Value": null
            },
            {
                "Key": "CampoLivre5",
                "Value": null
            }
        ],
        "language": null,
        "roles": "Administrator,User"
    }
}

Códigos de Retorno

Abaixo estão listados os códigos da propriedade “status” do retorno da API (authResult.status):

Códigos de Retorno Código Nome
100 Sucess Operação realizada com sucesso.
201 UserOrPasswordInvalid
202 UserNotFound
203 InactiveUser
204 InvalidToken
205 ExpiredToken
206 AccessDenied
207 SessionNotFound
208 SessionIsClosed
209 IPAddressMismatch

Incorporando a URL

Após realizar a autenticação, basta passar o token retornado pela API (authResult.authToken) como um parâmetro de URL para qualquer página do Latromi.

Exemplo:

https://latromi.minha-empresa.com.br/web/Default.aspx?authtk=XXXXXXXXXXXXXXXXXX

Depois é só adicionar essa URL no elemento iframe, dessa forma:

<iframe sandbox="allow-forms allow-same-origin allow-popups allow-scripts allow-top-navigation"
    src="https://latromi.minha-empresa.com.br/web/Default.aspx?authtk=XXXXXXXXXXXXXXXXXX"></iframe>

Ocultar o Cabeçalho do site

Geralmente quando incorporamos uma página em outro site, não queremos exibir o cabeçalho do site. Neste caso, basta adicionar na URL o parâmetro showHeader=false.

Exemplo:

https://latromi.minha-empresa.com.br/web/Default.aspx?authtk=XXXXXXXXXXXXXXXXXX&showHeader=false