如何在没有刷新页面的情况下阻止第三方Cookie的检测；[?]

本文介绍了如何在没有刷新页面的情况下阻止第三方Cookie的检测；[?]的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

JavaScript; localStorage Cookie; Block third-party cookies and site data;

创建动态独立的HTML文档，其中"项目"为脱机优先；
检测第三方Cookie的方法是更改浏览器设置，该cookie继续设置直到页面已刷新；

creating Dynamic Self-Contained HTML Documents in which "the Project" is Offline First;
the detection of Third-party cookies happens by changing the browser settings, the cookie continue to set until the page is refreshed;

if (typeof(Storage) !== "undefined") {
  try{
    localStorage.setItem("document","test");
    localStorage.removeItem("document");
  } catch(err) {
    alert("Cookies had failed to be set; Blocked!!");
  }
}

if (!navigator.cookieEnabled) {
  //Sample Code here;
} else { //Sample Code Here; }

这种情况只会检测到不刷新主Cookie设置，而不会检测到第三方数据；

this situation only detects without a refresh the main cookie setting, not the third-party data;

推荐答案

此处的解决方案基于https://github.com/mindmup/3rdpartycookiecheck

这涉及三个文件.客户端文件，我们称其为 ThirdPartyCookies.html ，以及其他服务器(第三方服务器)中的两个其他文件.让我们将这两个其他文件称为 ThirdPartyCookies2.html 和 ThirdPartyCookies3.html .这是一个全JavasScript解决方案.您的第三方服务器可以是静态CDN.

There are three files involved in this. The client file, let's call it ThirdPartyCookies.html, and two other files in a different server (the 3rd party server). Let's call these two other files ThirdPartyCookies2.html and ThirdPartyCookies3.html. This is an all JavasScript solution. Your 3rd party server can be a static CDN.

ThirdPartyCookies.html(客户端)::此文件是客户端文件.无需刷新页面即可测试第三方Cookie.使用您自己的第三方服务器或CDN在代码中显示文件位置的位置修改代码.

ThirdPartyCookies.html (client side): This file is the client side file. No need to refresh the page to test for third party cookies. Modify the code by using the location of your own 3rd party server or CDN where it says LOCATION OF THE FILE in the code.

<!DOCTYPE html>
<html>
<head>
<style>
.testbutton {
  background-color: blue;
  color: yellow;
  text-align: center;
  border: 1px solid #000000;
  border-radius: 8px;
  min-width: 100px;
  max-width: 100px;
  cursor: pointer;
}

.testbutton:hover {
  background-color: darkgreen;
  color: yellow;
}

.small {
  font-family: "Verdana";
  font-size: x-small;
}
</style>
<script>
window.onload = function (){
    var receiveMessage = function (evt) {
      if (evt.data === 'MM:3PCunsupported') {
        alert("Cookies had failed to be set; Blocked!!");
      } else if (evt.data === 'MM:3PCsupported') {
        // Third party cookies are supported
      }
    };
    window.addEventListener("message", receiveMessage, false);
};
function samplestorage(){
    var iframe = document.getElementById('iframeCookies');
    iframe.src = iframe.src;
}
</script>
</head>
<body>
    <div class="small">
      go at Privacy &amp; Security, under browser settings, "Chrome,Opera"<br> then check\uncked [ ] Block third-party cookies and site data;
    </div>

    <br>

    <div class="testbutton" onclick="samplestorage();">
      Test Button
    </div>

    <br> page has to be refreshed if cookie settings are changed at browser settings;


  <iframe id="iframeCookies" src="LOCATION OF THE FILE/ThirdPartyCookies2.html" style="display:none" />
</body>
</html>

ThirdPartyCookies2.html(在您的第3方服务器中):

<!DOCTYPE html>
<html>
<head></head>
<body>
<script>
    document.cookie="thirdparty=yes";
    document.location="ThirdPartyCookies3.html";
</script>
</body>
</html>

ThirdPartyCookies3.html(在您的第3方服务器中):

<!DOCTYPE html>
<html>
<head></head>
<body>
<script>
 if (window.parent) {
    if (/thirdparty=yes/.test(document.cookie)) {
        window.parent.postMessage('MM:3PCsupported', '*');
    } else {
        window.parent.postMessage('MM:3PCunsupported', '*');
    }
 }
</script>
</body>
</html>

如果您想查看其他解决方案，请查看此问题>查看是否为第三缔约方Cookie已启用

If you want to see other solutions check out this SO question Check if third-party cookies are enabled

这篇关于如何在没有刷新页面的情况下阻止第三方Cookie的检测；[?]的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！