innoweb / silverstripe-cookie-consent
创建一个cookie同意弹出窗口和cookie政策页面。
Requires
README
概述
创建一个cookie同意弹出窗口和cookie政策页面。
虽然我们尽量勾选尽可能多的法律选项,但我们不对本模块遵守任何立法(包括GDPR)提供任何保证。
这是TheBnl的cookie同意模块的一个修改和简化版本。感谢您的贡献和灵感!
要求
- Silverstripe CMS 5.x
注意:此版本与Silverstripe 5兼容。对于Silverstripe 4,请参阅2发布分支。
安装
使用composer安装模块
composer require innoweb/silverstripe-cookie-consent
然后运行dev/build。
将弹出窗口模板包含在您的base Page.ss中
<% include CookieConsent %>
配置
您可以通过yml配置文件配置cookie和cookie组。您需要按供应商进行配置,供应商的点是转换为下划线,例如ads.marketingcompany.com变为ads_marketingcompany_com。
通过通过yml配置cookie,您可以在代码中检查同意并在必要时进行更改,例如要求分析或其他cookie或跳过放置它们。
配置的cookie的文本可以通过网站配置进行编辑,在这里CMS用户也可以添加其他cookie。例如,如果网站用户决定嵌入YouTube视频,他或她可以指定由YouTube放置的cookie。我建议创建以下三个组,这些组有默认内容,当然您也可以根据需要配置组。
Innoweb\CookieConsent\CookieConsent: cookies: Necessary: local: - PHPSESSID - CookieConsent Marketing: ads_marketingcompany_com: - _track Analytics: local: - _ga - _gid
此模块包含了一些我们之前遇到的cookie的默认内容。如果您想自己设置这些cookie的默认内容,这是可能的,通过lang文件。如果您有本模块中没有的cookie描述,对lang文件的贡献将非常感激!
文件结构如下
en: CookieConsent_{provider}: {cookie}_Purpose: 'Cookie description' {cookie}_Expiry: 'Cookie expire time' # for cookies from your own domain: CookieConsent_local: PHPSESSID_Purpose: 'Session' PHPSESSID_Expiry: 'Session' # for cookies from an external domain: CookieConsent_ads_marketingcompany_com: _track_Purpose: 'Cookie description' _track_Expiry: 'Cookie expire time'
您还可以配置默认CSS样式的需求。
Innoweb\CookieConsent\CookieConsent: include_css: true
使用方法
然后您可以通过调用以下方法在PHP代码中检查同意:
if (CookieConsent::check('Analytics')) { // include analytics script }
在模板中,您可以使用以下方法检查同意:
<% if $CookieConsent(Analytics) %> // include analytics script <% end_if %>
当弹出窗口中的接受按钮被点击时,CookieConsent弹出窗口会触发一个自定义JavaScript事件updateCookieConsent
。您可以使用该事件根据设置的cookie有条件地加载网站的部分。
JavaScript示例
以下是一个示例,只有当营销cookie被接受时才会懒加载视频嵌入。
模板
<% if $EmbedCode %> <div class="VideoEmbed js-load-video" data-required-cookies="Marketing"> <p class="message warning">Please accept marketing cookies to view this video.</p> <noscript><p class="message warning">Please enable JavaScript to view this video.</p></noscript> <div hidden> <!-- $EmbedCode.RAW --> </div> </div> <% end_if %>
脚本
let loadVideos = function() { // unwraps hidden embed code if correct cookie value is set let showVideo = function(video) { let requiredCookies = video.getAttribute('data-required-cookies'); let cookieValue = Cookies.get('CookieConsent'); if (requiredCookies === null || requiredCookies === '' || (cookieValue !== null && cookieValue.indexOf(requiredCookies) !== -1)) { let hidden = video.querySelector('[hidden]'); let content = hidden.innerHTML; // get content from within html comment content = content.replace(/<!--([\S\s]+?)-->/g, '$1'); // replace content video.innerHTML = content; video.classList.remove('js-load-video'); video.classList.add('js-video-loaded'); return true; } return false; }; // intersection observer to load video if in viewport let observer = new IntersectionObserver(function(entries, observer) { entries.forEach(function(entry) { if (entry.isIntersecting) { if (showVideo(entry.target)) { observer.unobserve(entry.target); } } }); }); // load all videos and observe let videos = document.querySelectorAll('.js-load-video'); videos.forEach(function(video) { observer.observe(video); }); }; // load videos on page init loadVideos(); // load videos when JavaScript event is fired document.addEventListener('updateCookieConsent', loadVideos);
默认页面
在运行dev/build时,此模块还会设置一个默认的隐私政策页面。
如果您想防止这种行为,您应该禁用create_default_pages
配置设置。
Innoweb\CookieConsent\CookieConsent: create_default_pages: false
创建的页面填充了基本的文本内容。当然,修改这些文本以适应您的用例是您或您的CMS用户的责任!
许可证
BSD 3-Clause许可证,请参阅许可证