Magento 2: check customer logged in by javascript use model

Question

Just wanna to check if customer logged in by javascript use

Magento_Customer/js/model/customer.

I've included following js file in module:

define([
    "jquery",
    'Magento_Customer/js/model/customer',
], function($, customer) {

    'use strict';

    $.widget('conv.bolPrices', {
        _init: function init() {
            console.log('customer', customer);
            console.log('Logged in', customer.isLoggedIn()); //getting undefined
        },

    });

    return $.conv.bolPrices;
});

After login, every time when I am loading page I am getting undefined value, instead true/false.

I wanna to do it use model/customer. I cleared cache, removed generated/*, etc, read a lot of topics about this theme, but had no success.

I very appreciate any help and advice. Thanks.

Answer 1

customer.isLoggedIn() is a ko.obervable on window.isCustomerLoggedIn and it seems that window.isCustomerLoggedIn is set by default only in the checkout templates: module-checkout in onepage.phtml and cart/shipping.phtml and module-multishipping in checkout/billing.phtml

So one approach could be to add a similar functionality in some appropriate template and assign Magento\Customer\Model\Session->isLoggedIn() to window.isCustomerLoggedIn in case that window.isCustomerLoggedIn is not defined. Maybe it works in footer template.

One more thought on this issue: If you are using caching (what you most likely do) you should move that to an uncached part if your cache key does not consider if customer is logged in or not.

Answer 2

Takes time to populate customer info into CustomerData.

Try the following code:

var self = this;
var counter = 0;
var timeTopMenu = setInterval(function () {

    self.customer = customerData.get('customer');

    if (self.customer().fullname != undefined) {
        // custom code here
        clearInterval(timeTopMenu);
    } else {
        counter++;
        if(counter > 5) {
            clearInterval(timeTopMenu);
        }
    }
}, 1000);