Skip to main content
 

implementation in angular website

Pieter
  • Edited

I'm trying to use cookiebot on our angular website and am running into several issues. these are the following:

 

1. I have added a few translations of the declaration, but they are not shown on the relevant website. It is always the default language (english) that is shown.
2. The declaration is simply pasted over the page where it is placed and not integrated within it, on the place where I added the script. Is this normal behavior? How can I fix this? 
3. The consent banner seems to seriously slow down the website and eventually even make loading impossible. in the console of devtools is shows "[WDS] Disconnected!". What is causing this to happen?

I encounter these issues during development, on the domain "localhost". I have added this to the domain aliases.

0

Comments

10 comments

Date Votes
  • Spas – vConnect – Community Supporter

    Hi Pieter,

    The Cookie Declaration will be displayed in the same language(s) as you have chosen for the cookie consent banner. You can see what languages are available here: What languages are available for the cookie consent banner?
    However, in case that you are using "localhost" as a test domain environment this could be the reason why the declaration is shown only on the default language.

    Regarding your second question, yes, the declaration is simply pasted over the page where it is placed the script, you could find more information under step 3, point 2 here: https://www.cookiebot.com/en/help/ 
    Basically, you should copy the declaration script and insert it in the HTML on the specific page and at the exact position where you would like the Cookie Declaration to appear.

    When comes to the "[WDS] Disconnected!" error, this is a simple SSL error in Angular and Ionic and it means that the browser could not verify the certificate from which webpack dev server has send to the browser. I think that in order to avoid this console error you could try to allow invalid certificates for resources loaded from localhost. 

    Regards,
    Spas

    0
  • Pieter

    Hi Spas,

     the second question is resolved by now. It was a mistake on my part that I've tracked down and fixed.

    the "[WDS] Disconnected!" error is only shown when I include cookiebots banner script. otherwise it is never shown (i didnt know it existed until adding the script). the presence of the declaration script has no influence on this.

    • on chrome and Edge our website simply does not load when the banner script is there. a blank page is shown
    • if i manually type a path, chrome stays blank while edge will show 
      Cannot GET /fr
    • on firefox, IE and chrome incognito the page does load (and works as it should) but much much slower then before. 
    • on Edge InPrivate only the banner is shown but the page itself does not load. accepting all cookies and then reloading (pressing F5) does load the page.

    as soon as i remove the banner script, everything works as before. everything is shown and loads at normal speed

     

    concerning the language issue: I've checked the languages allowed and the ones we use (EN, FR, NL) are all listed there.

    • I have noticed that on firefox, edge and IE the NL version is always shown, independent of which language is actually selected (and included as a path parameter).
    • on chrome it is always the EN version. both times I was testing locally (using localhost).

    how does cookiebot decide which language to show?

    this last observation is only valid for the browser that manage to load something (see first observations).

    a final observation is that hotreloading only works for the browsers that manage to load something. so for normal (not private/incognito) chrome and edge does not work with the banner script. for the others it does.

    0
  • Pieter

    the language issue is fixed. now just the loading of the script.

    0
  • Spas – vConnect – Community Supporter

    Hi Pieter,

    As I mentioned above the error [WDS] Disconnected! is indeed coming from the Angular framework. WDS stands for Webpack Dev Server. The reason this occurs is that a script bundle gets blocked because cookies originate from it. This of course leads many scripts not working.
    However, you can fix this by assigning the data-cookieconsent="ignore" attribute to the blocked script. This does allow the bundle to set cookies prior consent though. You could also unbundle the scripts, so the individual scripts can be blocked without affecting the ones that don't.

    Another approach would be to use the manual implementation (by removing data-blockingmode="auto" from the Cookiebot script tag). You could then use the boolean (true/false) return values from Cookiebot.consent.statiscs in an if statement to isolate individual commands in the bundle. But this approach could lead to another script loading issue and that is why we would not recommend this approach though.

    Regards,
    Spas

    -1
  • Pieter

    This answer is a copy/paste  of the one I received in my (closed for some reason) ticket in the requests. unfortunately we dont really understand. I need more information and have been asking for it for almost 2 weeks. I'll probably escalate it this afternoon and switch to another service.

    0
  • Spas – vConnect – Community Supporter

    Hi Pieter,

    You are right and you did indeed write to Cookiebot support team directly as well. The reason why the answer is the same (a copy/paste of the one you have received in your ticket in the requests) is that we assumed that you have made this work and solve your issue. We are apologizing for the inconvenience.

    I will try to explain what is happening, why you receive an error and eventually how it could be fixed. 
    What basically happens is that all/most scripts are in the same file and one or more of those scripts are setting cookies. The Cookiebot scanner detects that, and therefore blocks the entire file. This means that all functions within the file are blocked, not just the ones that set cookies. I hope that this explains the error.

    But, fixing it is difficult though. The best (but not easiest) approach would be to split the file up in separate files, so only the scripts that actually set cookies are blocked, and the others can load as normal, preserving normal function of the website.
    This could be done by inserting the scripts that set cookies in one file and the other scripts in another separate file. In this way Cookiebot would block only the file which contains scripts which set cookies.
    Unfortunately, how you need to do that is difficult to say and we cannot provide you with step by step instructions. We fully understand that you could choose to switch to another service, but you would still run into the same issue.
    Because you could either block the script and loose all functions or you don't and set cookies without consent which is contrary to the GDPR rules. 


    Regards,
    Spas

    0
  • Pieter
    • Edited

    Hi Spas,

    thanks for your explanation.  I'm wondering however why the site doesnt load on some browsers and not on others. is the cookiebot script reacting differently depending on the browser?

    sometimes there is even a difference between private browsing and normal browsing of the same browser (e.g. chrome and chrome incognito). this is when the bannerscript is included in the head (as the very first script, only after the meta charset attribute) and in auto blockingmode. in normal mode, the page is blocked, except for the cookiebot banner, nothing is shown. in incognito the page loads and works as normal, the banner is also shown and no error pops up in the console.

    I also note a difference in the cookies loaded between normal and incognito. both load 2 (_ga and _gid) but in incognito _gat_UA-122074490-1 is also there...

    is this normal behaviour?

    I have tried following doing the manual implementation https://www.cookiebot.com/en/manual-implementation/ but can't figure out with what is meaned by the 3th paragraph of step 4. in your answer you also refer to doing a manual implementation. how does your explanation tie in with what is written on the page I referenced above?

    It is very possible that I'm missing something but since this is an angular app, I dont know how or if it is even possible, to add attributes, as  data-cookieconsent="ignore",   to our scripts. 

    I can neither find all the cookies listed in our management page of cookiebot, nor are all cookies that I do know of in that list.

    0
  • Spas – vConnect – Community Supporter

    Hi Pieter,

    I know this is a problem that needs to be investigated further and you have been submitted a ticket and being directly in touch with Cookiebot support team, so I assume that everything is or would be fine. Please do not hesitate to write us back in case if any issues. 

    Regards,
    Spas

    0
  • Pieter

    Hi Spas,

     

    thanks for your help. unfortunately contacting cookiebot support team doesnt help much (read: "at all"). I grew tired of this ticket and not getting replies from them that I simply gave up. everything is far from fine and I would recommend anyone to look for another service. I suppose cookiebot is an okay technology but their service team is horrific. 

    Others in my team are trying a new approach (for which I asked questions and didnt receive replies, as usual) but I'm highly sceptical that it will work.

    0
  • Andreas Larssen

    Check this out: https://www.npmjs.com/package/@halloverden/ngx-cookiebot

    0

Please sign in to leave a comment.

Didn't find what you were looking for?

New post