FCM cordova push notification not received in secondary page

1

I have the following problem with the plugin FCM.plugin to connect Firebase Cloud Messaging with cordova.

My application is a login and then a secondary page where I load all the content. The problem is that I do not receive notifications when I am on this second page.

Inside the file index.js in the function onDeviceReady I have the following to obtain the token and allow notifications, until then everything works fine.

onDeviceReady: function() {
//var tokenget;

//alert(navigator.onLine ? "OnLine" : "OffLine");
if(window.localStorage.getItem("token") == null){window.localStorage.setItem("token", "")};
setTimeout(getTheToken, 1000);

function getTheToken() {
    if(window.localStorage.getItem("token") == ""){
        FCMPlugin.getToken(
            function (token) {
                if (token == null) {
                    console.log("null token");
                    setTimeout(getTheToken, 1000);
                    //window.localStorage.setItem("token", token);
                    navigator.notification.alert("Bucle");
                } else {
                    console.log("I got the token: " + token);                    
                    window.localStorage.setItem("token", token);   
                    alert("Ya tengo Token" + token);                
                }
            },
            function (err) {
                alert('error retrieving token: ' + err);
            }
        );
    }
}

FCMPlugin.onNotification(
    function(data){
        if(data.wasTapped){
//Notification was received on device tray and tapped by the user.
            alert("Tapped: " +  JSON.stringify(data) );
        }else{
//Notification was received in foreground. Maybe the user needs to be notified.
            alert("Not tapped: " + JSON.stringify(data) );
        }
    },
    function(msg){
        alert('onNotification callback successfully registered: ' + msg);
        console.log('onNotification callback successfully registered: ' + msg);
    },
    function(err){
        alert('Error registering onNotification callback: ' + err);
        console.log('Error registering onNotification callback: ' + err);
    }
);
//tokenget = window.localStorage.getItem("token");
app.receivedEvent('deviceready');

Inside a separate file js I have the function with a basic login form, which contains:

$(document).ready(function(){
    $("#entrar").on("click",function(e){
        var identificador = $("#asociado_id").val();
        var token = window.localStorage.getItem("token");
        //alert(token);
        login(identificador, token, "#entrar");

    });
});

Inside the function login I make an ajax call to a web service that tells me if the user is in a database and if it is correct, redirects it to a second page.

success: function(respuesta) {
                if(respuesta.tk == "true"){
                    window.localStorage.setItem("login", "true");
                   window.location.href = "main.html";

When I am on the second page, it does not receive notifications. I do not know what is due. The file main.html contains these loaded script.

    <script type="text/javascript" src="js/jquery.mobile-1.4.5.min.js"></script>
    <!-- <script type="text/javascript" src="cordova.js"></script>-->
    <script type="text/javascript" src="js/index.js"></script> 
    <script type="text/javascript" src="js/velocity.min.js"></script>
    <script type="text/javascript" src="js/main_menu.js"></script> <!-- Resource jQuery -->

Note: I have included the cordova.js and index.js files but the applications do loop and it does not work.

    
asked by cignius 03.01.2017 в 18:10
source

2 answers

0

When navigating to a different page, the javascript context is lost.

You have 2 options:

  • Put all the code also in the main.html, put the link to cordova.js, re-register the deviceready, all.

  • Find information about SPA (Single Page Apps) and turn your app into one of them, where you only have one page that takes care of everything. It does not mean that you only have one screen, but that you "navigate" to different divs that are shown in full screen as if they were different pages, but that you are always always in the index.html.

  • answered by 20.01.2017 / 17:24
    source
    0

    Well, it seems like a problem that is resolved by ordering the code a bit.

    Try to move the function

    FCMPlugin.onNotification (...);

    just below

    FCMPlugin.getToken (...);

    This is the index.js file that I use when I want my app to have push notifications with FCM. I hope it serves you.

    var app = {
    
    initialize: function () {
        this.bindEvents();
    },
    
    bindEvents: function () {
        document.addEventListener('deviceready', this.onDeviceReady, false);
        document.addEventListener('backbutton', this.onBackKeyDown, false);
    },
    onDeviceReady: function () {
    
        app.notificacionesPush();
    
    
    },
    
    notificacionesPush: function () {
    
        FCMPlugin.getToken(
                function (token) {
    
                    var obj = {"token": token};
    
                    Ajax("http://MI-URL/webservice.php", obj, function (data) {
                        if (data.code === "OK")
                            console.info("Token de Dispositivo registrado correctamente");
                        else
                            console.info("Error en registro de Token");
    
                    }, function () {
                        console.warn("Error en registro de Token");
                    });
                },
                function (err) {
                    console.warn('error retrieving token: ' + err);
                }
        );
    
    
        FCMPlugin.onNotification(
                function (data) {
                    if (data.wasTapped) {
                        console.info(JSON.stringify(data));
                    } else {
                        console.info(JSON.stringify(data));
                    }
                },
                function (msg) {
                    console.info('onNotification callback successfully registered: ' + msg);
                },
                function (err) {
                    console.info('Error registering onNotification callback: ' + err);
                }
        );
    },
    }; app.initialize();
    
        
    answered by 04.01.2017 в 01:49