我试图将Klaro集成到Angular 16中,但不知何故,它没有显示cookie弹出窗口,这是我的代码:
klaro-config.js:
export const klaroConfig = {
elementID: 'klaro',
storageMethod: 'cookie',
cookieName: 'klaro-cookie',
cookieExpiresAfterDays: 365,
privacyPolicy: '/privacy-policy.html',
default: false,
mustConsent: true,
acceptAll: true,
translations: {
en: {
consentModal: {
title: 'Privacy Preferences',
description:
'At website name, we are committed to safeguarding your privacy while providing you with the best possible user experience. ' +
'The information we collect through our website is governed by strict data collection practices, ensuring that your personal information remains secure.',
privacyPolicy: {
name: 'Privacy Policy',
text: 'Read the privacy policy here'
}
},
consentNotice: {
description:
'At Carilion Clinic, we are committed to safeguarding your privacy while providing you with the best possible user experience. ' +
'The information we collect through our website is governed by strict data collection practices, ensuring that your personal information remains secure.',
}
}
},
app: [
{
// In GTM, you should define a custom event trigger named `klaro-google-analytics-accepted` which should trigger the Google Analytics integration.
name: 'google-analytics',
purposes: [ 'analytics' ],
cookies: [
/^_ga(_.*)?/,
/^__utm[a-z]$/, // we delete the Google Analytics cookies if the user declines its use
],
},
{
// In GTM, you should define a custom event trigger named `klaro-google-ads-accepted` which should trigger the Google Ads integration.
name: 'google-ads',
purposes: [ 'marketing' ],
cookies: [
/^_gcl(_.*)?/, // we delete the Google Ads cookies if the user declines its use
],
},
{
// In GTM, you should define a custom event trigger named `klaro-facebook-pixel-accepted` which should trigger the Facebook Pixel integration.
name: 'facebook-pixel',
purposes: [ 'marketing' ],
cookies: [
'fr',
'usida',
'ps_n',
'_fbp', // we delete the Facebook Pixel cookies if the user declines its use
],
},
{
// In GTM, you should define a custom event trigger named `klaro-linkedin-insights-accepted` which should trigger the LinkedIn Insights integration.
name: 'linkedin-insights',
purposes: [ 'marketing' ],
cookies: [
/^_gcl(_.*)?/, // we delete the LinkedIn Insights cookies if the user declines its use
],
},
{
// In GTM, you should define a custom event trigger named `klaro-linkedin-insights-accepted` which should trigger the LinkedIn Insights integration.
name: 'microsoft-clarity',
purposes: [ 'analytics' ],
cookies: [
/^[A-Z]*ID$/,
/^_cl[c,s]k$/, // we delete the LinkedIn Insights cookies if the user declines its use
],
},
]
};
app.component.ts:
import { klaroConfig } from '../klaro/klaro-config';
declare const Klaro: any;
ngOnInit() {
const klaro = new Klaro(klaroConfig);
klaro.init();
}
angular.json:
"styles": [ "src/klaro/klaro.css"],
"scripts": [ "src/klaro/klaro.js" ]
package.json:
"klaro": "^0.7.21",
我可以看到<div id="klaro"></div>
已在多姆中创建,但不知何故弹出窗口没有显示