Home > OS >  Cookiebot blocks lazy loeading of images
Cookiebot blocks lazy loeading of images

Time:08-14

Actual behavior:

When opening a page the cookie banner is displayed. When the cookies are accepted everything works as intended. When the only necessary cookies are accepted the lazy loading of pictures doesnt work anymore. After reloading the page everything works as intended. Also, everything works as intended when the necessary cookies are accepted fast.

Expected behavior:

Even when only the necessary cookies are accepted the lazy loading of images still works.

The lazy loading is implemented in a Vue.js component. When a image is intersecting the viewport a method is triggered that adds a event handler for the 'load' event of the image that just sets a property which controls if a loading spinner is displayed.

This is the method. So nothing special.

loadImage() {
            const image = this.$el.querySelector('img');

            if (image) {
                image.addEventListener('load', () => {
                    this.isLoaded = true;
                });
                image.addEventListener('error', () => {
                    this.hasError = true;
                });
                this.isIntersected = true;
            }
        }

It seems that the load event handler never gets triggered when only the necessary cookies are accepted. Anyone had a problem like this and has a solution?

CodePudding user response:

I actually got a response from the Cookiebot Support. They also said that you should just trigger a reload of the page, when the cookies get declined.

  • Related