Приложение Vue.js с базой данных Firebase в реальном времени, и VueFire внезапно перестал работать - PullRequest
Новая
       90

Приложение Vue.js с базой данных Firebase в реальном времени, и VueFire внезапно перестал работать

0 голосов
/ 10 июня 2019

Я не изменил свой код, но на прошлой неделе VueFire прекратил загрузку любых данных.Я попытался вернуться к более старым версиям Vue и VueFire, но не могу найти причину проблемы.

На данный момент мой код почти идентичен документации, доступной здесь: https://vuefire.vuejs.org/vuefire/#why

    // Vue.js
    let config = {
        apiKey: "<?php echo getenv('FB_API_KEY'); ?>",
        authDomain: "<?php echo getenv('FB_AUTH_DOMAIN'); ?>",
        databaseURL: "<?php echo getenv('FB_DB_URL'); ?>",
        projectId: "esportsgametrainers",
        storageBucket: "<?php echo getenv('FB_STORAGE_BUCKET'); ?>",
        messagingSenderId: "<?php echo getenv('FB_MSG_SENDER_ID'); ?>"
    };

    let app = firebase.initializeApp(config);
    let db = app.database();

    // Open Session Ref.
    let openSessionsRef = db.ref('openSessions');

    let vm = new Vue({
        el: '#open_training_sessions',
        data: () => ({ openSessions: [] }),
        firebase: {
            openSessions: openSessionsRef
        },
        computed: {
            latestOpenSessions: function () {
                console.log('??', this.openSessions);
                //return this.openSessions;
                return this.openSessions.filter(function (session) {
                    console.log(session);
                    return session;
                    // Only unaccepted games
                    if (!session.accepted) {
                        // Date filter
                        let currentTime = new Date().getTime();
                        let sessionCreated = new Date(session.CreatedDate).getTime();
                        if (sessionCreated < currentTime) {
                            let offset = currentTime - sessionCreated;
                            if (offset / 3600000 < 3) {
                                return session;
                            }
                        } else {
                            return session;
                        }
                    }
                });
            }
        }
    });

После добавления строки: data: () => ({ openSessions: [] }), приложение больше не выдает ошибок, однако содержимое массива всегда пустое, а загружаемая мной база данных Firebase содержит много записей.

Это действительно расстраивает, что это произошло.Как я уже сказал, я не менял код, он работал несколько месяцев, а теперь нет.

Кто-нибудь знает, почему это происходит?

1 Ответ

0 голосов
/ 13 июня 2019

Я наконец-то обнаружил источник этой проблемы и способы ее устранения.

Некоторая путаница была вызвана тем фактом, что, поскольку мое приложение все еще находится на ранней стадии разработки, оно фактически загружало Vuefire из CDN, а нечем из локальной зависимости.

Недавно разработчики Vuefire изменили версию с 1.x на 2.x в качестве официального стабильного релиза.Тем не менее, может показаться, что в версиях 2.x (теперь стабильный канал) и 3.x (следующий предварительный релиз-кандидат), когда основной акцент смещен на Cloudstore, в настоящее время существуют серьезные проблемы с реализациями баз данных реального времени.

После понижения Vuefire до версии 1.4.5 (последняя версия 1.x) весь мой исходный код снова работает как положено.

...