Klaro ve Consent İşlemleri

Çerezler ve kişisel veriler (PII) ile ilgili daha önce yayınladığım kullanıcı etkinliklerinin izlenmesi ve çerez izin/rıza yönetimi yönetimi yazılarına ek olarak kullanılabilecek bazı yardımcı araçlardan bahsetmiştim.

AA

Elbette bahsi geçen bu konular sadece belirli bir bağlama odaklanmaktalar. Çerez ve kullancı verilerin toplanması, işlenmesi ve/veya paylaşılması gibi durumlar için esas olan konu hukuki destek alınması ve veri sorumlusu bildirimlerinin gerçekleştirilmesi olacaktır. İlgili araçlar planlama sürecinin ardından, kapsama göre (kullanılan araçlar, sorumluluklar, sınırlandırmalar, vb.) değerlendirilmesi gereken konular arasında yer almaktadır.

Klaro

Bu yazı da yine ilgili çerez yönetim çözümlerine bir ekleme olarak ele alınabilir. Yazının kalan bölümünde bahsi geçecek olan Klaro da bu çözümlerden biri.

Klaro

Klaro, KIProtect tarafıdan geliştirilen, web siteleri için GDPR uyumlu açık kaynak bir izin/rıza yönetimi platformu (CMP)1. Platform, açık kaynak seçeneğin2 yanı sıra sunucu taraflı çözümler için de ek abonelik seçenekleri sunmakta3.

Klaro

Alan adı tarama işleminin tamamlanmasının ardından4 görüntülenen çerezlerin ve yerel depolama (local storage) bildirimlerine yönelik kategori seçimi ve açıklama tanımlarının yapılması gerekmekte.

Taramanın ardından eğer eksiklik var ise bu eksikliklerin de belirlenmesi ile birlikte konfigürasyon aşamasına geçilebilir. O halde adım adım klasor ile rıza (consent) yönetiminin popüler etiketlerle ile ilişkili olarak nasıl gerçekleştirilebileceğine bir bakalım.

Klaro

İlk işlem elbette etiket yönetimini gerçekleştirilecek JavaScript dosyasının indirilmesi olacaktır. Yayınlanan son sürüme ve örnek kullanımlara uygulamanın GitHub sayfası üzerinden ulaşmak mümkün2. Ayrıca CDN aracılığı ile kullanmak isterseniz Getting Started sayfasında belirtilen latest seçeneğini kullanarak güncel dosya bağlantısını görüntüleyebilirsiniz. Elbette bu seçeneği kullanmanız durumunda yine bildirimlerin iletileceği modal'a ait CSS içeriğini ayrıca ele almanız gerekir.

Konfigürasyon

Ön tanımlı olarak Klaro klaroConfig global değişkenini temel alır. Ancak, bu değişken tanımı klaro.js dosyasını çağırırken data-klaro-config ile değiştirilebilir.

<script src="klaro.js" data-klaro-config="myConfigVariableName"></script>

İlgili JavaScript içeriğinin websitesine eklenmesinin ardından konfigürasyon işlemine geçilebilir5. Konfigürasyon dosyası (annotated-config-file.js) en temel hali ile şu şekildedir:

window.klaroConfig = {
    services : [...],
}

Consent sürecinin nasıl işleyeceği, Klaro çerez tanımı ve kullanılan servislerin tanımlanması (farklı dillerde açıklamalar ile) ile birlitke kod şu bölümlere sahip olacaktır:

var klaroConfig = {
    testing: false,
    elementID: 'klaro',
    storageMethod: 'cookie',
    storageName: 'klaro',
    htmlTexts: false,
    cookieDomain: '.example.com',
    cookieExpiresAfterDays: 30,
    default: false,
    mustConsent: false,
    acceptAll: true,
    hideDeclineAll: false,
    hideLearnMore: false,
    translations: {
        zz: { // zz ön anımlı dili ifade eder
            privacyPolicyUrl: '/privacy',
        },
        en: {
            privacyPolicyUrl: '/privacy',
            consentModal: {
                description:
                    'Here you can see and customize the information that we collect about you. ' + 
                    'Entries marked as "Example" are just for demonstration purposes and are not ' + 
                    'really used on this website.',
            },
            purposes: {
                analytics: {
                    title: 'Analytics'
                },
                security: {
                    title: 'Security'
                },
                livechat: {
                    title: 'Livechat'
                },
                advertising: {
                    title: 'Advertising'
                },
                styling: {
                    title: 'Styling'
                },
            },
        },
    },
    services: [
        {
            name: 'matomo',
            default: true,
            translations: {
                zz: {
                    title: 'Matomo/Piwik'
                },
                en: {
                    description: 'Matomo is a simple, self-hosted analytics service.'
                },
                de: {
                    description: 'Matomo ist ein einfacher, selbstgehosteter Analytics-Service.'
                },
            },
            purposes: ['analytics'],
            cookies: [
                [/^_pk_.*$/, '/', 'klaro.kiprotect.com'],
                [/^_pk_.*$/, '/', 'localhost'],
                'piwik_ignore',
            ],
            callback: function(consent, service) {
                console.log(
                    'User consent for service ' + service.name + ': consent=' + consent
                );
            },
            required: false,
            optOut: false,
            onlyOnce: true,
        },
        {
            name: 'youtube',
            contextualConsentOnly: true,
        },
    ],
    callback: function(consent, service) {
        console.log(
            'User consent for service ' + service.name + ': consent=' + consent
        );
    },
};

Yukarıdaki örnek konfigürasyon tanımı içerisinde yer alan Matomo ile ilgili kod tanımı ise şu şekilde güncellendiğinde işlemler tamamlanmış olacaktır:

<script
    type="text/plain"
    data-type="application/javascript"
    data-src="https://analytics.7scientists.com/matomo.js"
    data-name="matomo">
</script>

Bu harici dosya (img, link, script, vb.) tanımında önemli olan data-name="matomo" ile ilgili konfigürasyonun ilişkilendirilmesinin sağlanması. Konfigürasyon içerisinde yer alan services nesnesi içerisinde yer alan name ile aynı içeriğin kullanılması önemli. Konfigürasyon işleminde kullanılan parametreler ile ilgili olarak açıklamalara Klaro dokümantasyonu üzerinden ulaşılabilir5 6. Bu açıklamaların yanı sıra, aşağıda yer alan örnekler vasıtasıyla ayrıca kısa notlarımı ileteceğim.

Entegrasyon İşlemleri

Yukarıda bahsi geçen çerezlerin ve yerel depolama kullanımlarının listelenmesi ile birlikte konfigürasyon dosyasının içeriği netleşmiş olacaktır. Artından etiket yönetimine geçilebilir. Bu işlem için ilk olarak konfigürasyon ve Klaro kodunun çağırılması gerekli7.

<script
    defer type="application/javascript"
    src="config.js"></script>
<script 
    defer
    data-config="klaroConfig"
    type="application/javascript"
    src="https://cdn.kiprotect.com/klaro/v0.7/klaro.js">
</script>

Bu aşamada etiketler ve bağlamsal onaylar üzerine düşünelim. Örneğin, bu sitede yayınlanan yazılar içerisine tweet paylaşımlarına ve youtube videolarına yer verilmeke. Bunun yanı sıra, yorum alanı disqus ile yönetilmekte. Etiket yönetimi Google Tag Manager aracılığı ile gerçekleştirilmekte, izleme işlemlerinde ise Google Analytics, Hotjar, HubSpot, Google Optimize, Facebook Pixel kullanılmakta. Dolayısıyla, consent sürecinin bu bilgiler ışığında ele alınması gerekmekte.

Klaro

Klaro işlemleri etiketler ve bağlamsal onaylar şeklinde ele almakta. Etiketler bir kodun yüklenmesi ile başlayan süreci kaparsaken bağlamsal izinler bir kodun o an gösterimini kontrol eder. Bağlamsal iziler için web sayfanıza yerleştirilmiş (embed) bir YouTube videosunu düşünebilirsiniz. Elbette sadece video ile sınırlı değil; iframe ve inline-script'lerin tamamını bağlamsal izinler altında ele almak mümkün. Şimdi, bu iki konsepti ayrı başlıklar altında detaylandıralım.

Klaro

Etiket Yönetimi

Klaro ile etiket yönetimi ilgili etikete ait kurulum kodu ve Klaro konfigürasyon dosyası aracılığı ile ele alınır. Websitesindeki bir etiketi Klaro ile kontrol etmek istediğimizde, ilk olarak ilgili etiket için bir ad ve açıklama belirtilmelidir.

var klaroConfig = {
    //...
    translations: {
        zz: {
            //... ön tanımlı dil içeriği
        },
        tr: {
            etiketAdi: {
                description: 'Etiket ile ilgili açıklama',
            },
            purposes: {
                analytics: 'Analytics',
                //...
            },
        },
        en: {
            //...
        }
    },
    services: [{
        name: 'etiketAdi',
        title: 'etiketBasligi',
        purposes: ['analytics'], // marketing, performans, ...
        cookies: [ // ilgili çerezler
            ['/^_xy(_.*)?/'],
            ['/^_xyz(_.*)?/']
        ],
    },
    {
        //...
    }]
}

Bu bilgiler doğrultusunda popüler servislerle ilgili süreçleri örneklendirmeye geçebiliriz.

Google Analytics

Çerez İzin / Rıza (Cookie Consent) Yönetim Araçları başlıklı yazıda Google Analytics etiketine değinmiştim. Klaro bu yazıda da bahsi geçen consent mode desteğine sahip. Bu sayede kolay bir şekilde etiket yönetimini gerçekleştirebilmekteyiz. Google Analytics'in bizim için zorunlu servislerden biri olduğunu varsayalım. Elbette bu durumda kullanıcılara ait IP adresinin de anonimleştirilmiş olmasını tavsiye ederim8.

Yukarıda örneklendirilen konfigürasyon ile ilişkili olarak şu eklemeleri yapabiliriz:

Patreon'a Özel İçerik

Klaro ve Consent İşlemleri ve daha pek çok kapsamlı yazı Patreon'da!