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円で利用できるのでオススメです。

Recommended Posts