Problemas com Strophe.js e Ionic 2

08/02/2018

0

Boa tarde pessoal!

Estou desenvolvendo um um chat com IONIC 2 que fará comunicação com um servidor OpenFire. Para isso, estou utilizando o framework Strophe.js.
O problema que estou tendo é para realizar o login. Criei a Classe ConexaoService (com o decorate @Injectable) para ser responsável por gerenciar as conexões, e criei a classe LoginComponent (com o decorate @Component).
Ao chamar o método fazerLogin(), o mesmo envia os dados do usuário para o método login do serviço, que, por sua vez, inicia a conexão e passa o retorno para uma função de Callback, conforme código abaixo:
this.connection = new Strophe.Connection(this.BOSH_SERVICE, {''''keepalive'''': true});
        this.connection.connect(jid, senha, this.onConnect);


O problema é que o retorno enviado para a função de callback é proveniente do Strophe.js, e é executado de forma assíncrona. Sempre que ocorre uma alteração no status da conexão, ele envia o retorno para este callback. Para saber se o usuário está ou não conectado, eu preciso aguardar o retorno de um status = 4 ou status = 5 e, com isso, não consigo atualizar a variavél loggedin para true, de forma que eu possa obter este valor na classe LoginComponent e redirecionar para a HomePage ou Exibir uma mensagem de erro.

A minha dificuldade está em fazer com que o método login() aguarde o recebimento de um status = 4 ou 5 na função de Callback, para então retornar algum valor para a função fazerLogin().
Obs.: A implementação de Observable não funcionou nese caso.

Seguem os códigos das 2 classes:

import { Injectable } from ''''@angular/core'''';
import { Strophe } from ''''strophe.js'''';

@Injectable()
export class ConexaoService{
    private connection: Strophe.Connection = null;
    private loggedIn: boolean = false;
    private host: string = "localhost";
    private BOSH_SERVICE: string = "http://"+ this.host +":7070/http-bind/";

    constructor(){
        
    }

    getConnection(){
        return this.connection;
    }

    setLoggedIn(logged){
        this.loggedIn = logged;
    }

   isLoggedin(){
       return this.loggedIn;
   }

   login(jid, host, senha, callback){
        this.connection = new Strophe.Connection(this.BOSH_SERVICE, {''''keepalive'''': true});
        this.connection.connect(jid, senha, this.onConnect);
   }

    onConnect(status){
        //$pres();
        if (status == Strophe.Status.CONNECTING) {
			console.log(''''Strophe is connecting.'''');
		} else if (status == Strophe.Status.CONNFAIL) {
			console.log(''''Strophe failed to connect.'''');
		} else if (status == Strophe.Status.DISCONNECTING) {
			console.log(''''Strophe is disconnecting.'''');
		} else if (status == Strophe.Status.DISCONNECTED) {
			console.log(''''Strophe is disconnected.'''');
		} else if (status == Strophe.Status.CONNECTED) {		
            console.log("Strophe is connected!");
           
            this.connection.send($pres().tree());
            this.loggedIn=true;
        }
        
    }
}


[code=jsimport { Component } from ''''@angular/core'''';
import { NavController, AlertController, LoadingController, Loading } from ''''ionic-angular'''';
import { ContatosComponent } from ''''../contatos/contatos'''';
import { PerfilComponent } from ''''../perfil/perfil'''';
import { HomePage } from ''''../home/home'''';
import { ConexaoService } from ''''../../services/conexaoService'''';
import { Strophe } from ''''strophe.js'''';

@Component({
selector: ''''page-login'''',
templateUrl: ''''login.html''''
})
export class LoginPage {
loading: Loading;
credenciais = { usuario: '''''''', senha: '''''''', host: '''''''' };
usuarioLogado = false; // Armazena variável para indicar se está ou não logado


constructor(private conexao: ConexaoService, public navCtrl: NavController, private alertController: AlertController, private loadingController: LoadingController) {
console.log("Página de Login Carregada!");
if(this.usuarioLogado){
this.navCtrl.setRoot(HomePage);
}
}

fazerLogin(){
this.conexao.login(this.credenciais.usuario, this.credenciais.host, this.credenciais.senha, this.onConnect);

if(this.conexao.isLoggedin()){
// Redireciona para a página principal, que contém as TABs
this.navCtrl.setRoot(HomePage);
} else {
this.showError("Credenciais inválidas");
}
}

showLoading() {
this.loading = this.loadingController.create({
content: ''''Please wait...''''
});
this.loading.present();
}

// Função de callback do Strophe.Connection.connect()
onConnect(status){
//$pres();
if (status == Strophe.Status.CONNECTING) {
console.log(''''Strophe is connecting.'''');
} else if (status == Strophe.Status.CONNFAIL) {
console.log(''''Strophe failed to connect.'''');
} else if (status == Strophe.Status.DISCONNECTING) {
console.log(''''Strophe is disconnecting.'''');
} else if (status == Strophe.Status.DISCONNECTED) {
console.log(''''Strophe is disconnected.'''');
} else if (status == Strophe.Status.CONNECTED) {
console.log("Strophe is connected!");

// this.connection.send($pres().tree());
//this.conexao.setLoggedIn(true);
this.navCtrl.setRoot(HomePage);

}
}

showError(text) {
this.loading.dismiss();

let alert = this.alertController.create({
title: ''''Falha no Login'''',
subTitle: text,
buttons: [''''OK'''']
});
alert.present();
}

}
][/code]

Alguém tem alguma ideia de como realizar esta implementação?

Obrigado!
Thiago Silva

Thiago Silva

Responder

Assista grátis a nossa aula inaugural

Assitir aula

Saiba por que programar é uma questão de
sobrevivência e como aprender sem riscos

Assistir agora

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar