Re: 外部サイトへのリンクはクッションページを経由させたい

2020年6月2日 at 23:52

aniyaさん。

返信ありがとうございます。
今のところあらゆる方法を模索している段階ですので、どういったアイデアでも歓迎です。
ぜひ、お教えいただきたく思います。

Re: 外部サイトへのリンクはクッションページを経由させたい

2020年6月3日 at 14:12
ほんじゃぁ、ボケ防止のお勉強がてら作成したブツをお試しください。

<script>
function openCushion(e) {
host = location.hostname;
href = this.getAttribute("href");
dn = href.indexOf(host);
if (~href.indexOf("://") && (dn <= -1 || dn > 8)) {
nw = window.open("", "cushion");
ws =
'<p style="text-align:center;margin-top:20px;">' +
'<a href="%s" rel="noreferrer">%s</a><br>にジャンプしちゃうんですか?<br>' +
'<button onclick="window.close();" style="margin-top:20px;">CANCEL</button></p>';
nw.document.body.innerHTML = ws.replace(/%s/g, href);
e.preventDefault();
}
}
window.addEventListener("load", function () {
if (!this.document.getElementById("ccm-tooltip-holder")) {
document.querySelectorAll("a").forEach(function (ce) {
ce.addEventListener("click", openCushion);
}, false);
}
});
</script>


設置方法:
外部へのリンクがあるページに上記をコピペしたHTMLブロックを追加すればOK。
リンクとして埋め込む時は最初と最後の<script></script>タグを外して.jsファイル(例 noreferrer.js)として保存し、適宜ヘッダやbody終盤あたりから読み込んでください。
テンプレートで読み込む場合のサンプルコードは次の通り。

<script type="text/javascript" src="<?= $view->getThemePath() ?>/js/noreferrer.js"></script>


使い方:
編集モードでは動作しませんので、設置後ログアウトした状態でお試しください。
外部リンクをクリックすればクッションページが開きジャンプの確認をします。

動作条件:
次の場合は通常のリンクとして動作します。
・編集モード時
・「絶対パス」「相対パス」「mailto」のリンク
・同一FQDN向けのリンク
 ※サブドメインが異なる場合はクッションページが表示されます。

お試しあれ。
 

Re: 外部サイトへのリンクはクッションページを経由させたい

2020年6月3日 at 17:04
ありがとうございます。早速試してみます。

===ここから追記===
試してみました。意図したとおりの動作です。
ありがとうございました。

追加での質問になってしまい申し訳ないのですが、このコード書き換えることでユーザーがログインした状態でも動作させることは可能なのでしょうか?
 理由:構築予定のC5は基本的にログインした状態を前提として閲覧権限などを設定するため

大変お手数をおかけしますが、どうぞよろしくお願いいたします。
 

Re: 外部サイトへのリンクはクッションページを経由させたい

2020年8月1日 at 12:09
追記に気づかず申し訳ないです。
> このコード書き換えることでユーザーがログインした状態でも動作させることは可能なのでしょうか?
はい、可能です。
ccm-tooltip-holder の有無でログイン状態を判断しているので、
そこら辺をいじってみてください。
 

Re: 外部サイトへのリンクはクッションページを経由させたい

2020年11月11日 at 16:33
遅くなりましたが、返信ありがとうございました。

ログイン状態でも意図した動作となりました。
ありがとうございました。