CloudSSLを導入したホームページにおいて、手順に従ってサイトシールを設置すると、以下のエラーが発生し、サイトシールが表示されませんでした。
cloudssl_w_150-58.js:17 Failed to execute 'write' on 'Document': It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened.
(匿名) @ cloudssl_w_150-58.js:17
実際に設置したコードです。
※CloudSSLより転載。
<script type="text/javascript" src="//seal.cloudsecure.co.jp/js/cloudssl_w_150-58.js" defer="defer"></script>
<noscript>
<img src="//seal.cloudsecure.co.jp/image/cloudssl_noscript_m.png" width="150" height="58">
</noscript>
今回はその対処方法について説明します。
※なお、CloudSSL側の仕様変更により正常に動作しない場合がありますので、自己責任でお願いします。
以下のコードに置き換えます。
ヘッダーとボディに分けて、DOMContentLoadedイベントが発火時にスクリプトが実行されるように変更します。
<!DOCTYPE html>
<html>
<head>
<title>CloudSSL</title>
<script type="text/javascript">
window.addEventListener('DOMContentLoaded', function() {
var sc_p_b = "https://seal.cloudsecure.co.jp/webSiteProfileCloudSSL.php";
var sc_si_b = "https://seal.cloudsecure.co.jp/seal.cgi";
var hn = window.location.hostname;
var w_w = 600;
var w_h = 580;
var i_w = 150;
var i_h = 58;
var brand = "coressl";
var sc_p = sc_p_b + "?p1=" + hn;
var sc_si = sc_si_b + "?p1=" + hn + "&p2=" + i_w + "-" + i_h + "-" + brand + "-w";
function op() {
if (screen != null) {
if (screen.height < 850) {
w_h = screen.height - 50;
}
}
window.open(sc_p, 'SC_P', "status=1,location=0,scrollbars=1,resizable=1,width=" + w_w + ",height=" + w_h);
return false;
}
var a = document.createElement('a');
a.href = sc_p;
a.onclick = function() {
return op();
};
var img = document.createElement('img');
img.src = sc_si;
img.width = i_w;
img.height = i_h;
a.appendChild(img);
document.body.appendChild(a);
});
</script>
</head>
<body>
<noscript>
<img src="https://seal.cloudsecure.co.jp/image/cloudssl_noscript_m.png" width="150" height="58">
</noscript>
</body>
</html>
WordPressのテーマやプラグインなどの影響により正常に動作しない場合、フッターの一部をiframeにして、そこにサイトシールを表示するようにしています。
CloudSSLは、年額1,650円で利用できるのでオススメです。