显示空白页的社交媒体链接
Social media links showing blank page
我正在尝试将一些社交媒体 link 添加到我在 CodePen 中的网页，但是单击 link 会显示一个空白页面。
例如：
<div class="col-md-2"><a href="https://twitter.com/Mr_Cool_Web"><i class="fab fa-twitter-square"></i></a></div>
这 URL 只会导致空白页。我的网站可以访问 here。我在这里做错了什么？
CodePen 以 iframe 显示您的网页。 iframes 允许您将另一个网页嵌入另一个网页[1]。当您单击 iframe 内的 link 时，新网页将显示在 iframe.
内
但是，您可以阻止网页或网站显示在 iframe 内。您只需将 X-Frame-Options 设置为 'deny'，您的页面将不再显示在 iframe、frame 或 object 中。这用作针对 clickjacking[2].
的安全措施
维基百科将 clickjacking 定义为[3]
Clickjacking is a malicious technique of tricking a Web user into
clicking on something different from what the user perceives they are
clicking on, thus potentially revealing confidential information or
taking control of their computer while clicking on seemingly innocuous
web pages.
A clickjacked page tricks a user into performing undesired actions by
clicking on a concealed link. On a clickjacked page, the attackers
load another page over it in a transparent layer. The users think that
they are clicking visible buttons, while they are actually performing
actions on the invisible page. The hidden page may be an authentic
page; therefore, the attackers can trick users into performing actions
which the users never intended. There is no way of tracing such
actions to the attackers later, as the users would have been genuinely
authenticated on the hidden page.
现在，Twitter 和 Facebook 已将 X-Frame-Options 设置为 `'deny'。控制台输出将证明这一点。
正如我们从上面了解到的，这将阻止 CodePen 显示您的 Twitter 和 Facebook 页面。因此，导致空白页。
参考资料
我正在尝试将一些社交媒体 link 添加到我在 CodePen 中的网页，但是单击 link 会显示一个空白页面。
例如：
<div class="col-md-2"><a href="https://twitter.com/Mr_Cool_Web"><i class="fab fa-twitter-square"></i></a></div>
这 URL 只会导致空白页。我的网站可以访问 here。我在这里做错了什么？
CodePen 以 iframe 显示您的网页。 iframes 允许您将另一个网页嵌入另一个网页[1]。当您单击 iframe 内的 link 时，新网页将显示在 iframe.
但是，您可以阻止网页或网站显示在 iframe 内。您只需将 X-Frame-Options 设置为 'deny'，您的页面将不再显示在 iframe、frame 或 object 中。这用作针对 clickjacking[2].
维基百科将 clickjacking 定义为[3]
Clickjacking is a malicious technique of tricking a Web user into clicking on something different from what the user perceives they are clicking on, thus potentially revealing confidential information or taking control of their computer while clicking on seemingly innocuous web pages.
A clickjacked page tricks a user into performing undesired actions by clicking on a concealed link. On a clickjacked page, the attackers load another page over it in a transparent layer. The users think that they are clicking visible buttons, while they are actually performing actions on the invisible page. The hidden page may be an authentic page; therefore, the attackers can trick users into performing actions which the users never intended. There is no way of tracing such actions to the attackers later, as the users would have been genuinely authenticated on the hidden page.
现在，Twitter 和 Facebook 已将 X-Frame-Options 设置为 `'deny'。控制台输出将证明这一点。
正如我们从上面了解到的，这将阻止 CodePen 显示您的 Twitter 和 Facebook 页面。因此，导致空白页。